diff --git a/examples/district/app/[locale]/[district]/[department]/[scheme]/components/BarView.tsx b/examples/district/app/[locale]/[district]/[department]/[scheme]/components/BarView.tsx index 7ce45319..f06e53b2 100644 --- a/examples/district/app/[locale]/[district]/[department]/[scheme]/components/BarView.tsx +++ b/examples/district/app/[locale]/[district]/[department]/[scheme]/components/BarView.tsx @@ -1,4 +1,4 @@ -import { BarChart } from 'opub-viz/src'; +import { BarChart } from 'opub-viz'; import React from 'react'; export const BarView = React.forwardRef(({ data }: { data: any }, ref: any) => { diff --git a/examples/district/app/[locale]/[district]/[department]/[scheme]/components/Explorer.tsx b/examples/district/app/[locale]/[district]/[department]/[scheme]/components/Explorer.tsx index a886ebb8..9100f670 100644 --- a/examples/district/app/[locale]/[district]/[department]/[scheme]/components/Explorer.tsx +++ b/examples/district/app/[locale]/[district]/[department]/[scheme]/components/Explorer.tsx @@ -61,7 +61,7 @@ export const Explorer = React.forwardRef( return (
@@ -283,11 +283,7 @@ const Content = ({ }, ].map((tab) => ( -
- - {tab.label} - -
+ {tab.label}
))} @@ -327,7 +323,7 @@ const Content = ({ Copy Link
diff --git a/packages/opub-ui/src/components/DataTable/components/Toolbar/Toolbar.tsx b/packages/opub-ui/src/components/DataTable/components/Toolbar/Toolbar.tsx index 366f173f..5a22d7cc 100644 --- a/packages/opub-ui/src/components/DataTable/components/Toolbar/Toolbar.tsx +++ b/packages/opub-ui/src/components/DataTable/components/Toolbar/Toolbar.tsx @@ -47,7 +47,7 @@ export function Toolbar({
); + +export const Filled = () => ( +
+ +
+); diff --git a/packages/opub-ui/src/components/Icon/Icon.tsx b/packages/opub-ui/src/components/Icon/Icon.tsx index 8f93f47d..78dc3325 100644 --- a/packages/opub-ui/src/components/Icon/Icon.tsx +++ b/packages/opub-ui/src/components/Icon/Icon.tsx @@ -3,7 +3,6 @@ import { variationName } from '../../utils/css'; import { Text } from '../Text'; import styles from './Icon.module.scss'; import cx from 'classnames'; -import React from 'react'; export function Icon({ source, @@ -24,24 +23,16 @@ export function Icon({ ); const SourceComponent: any = source; - const iconSize = size - ? typeof size === 'number' - ? size - : Number(size) * 4 - : 20; + const iconSize = size ? size : 20; + + const style = { + height: size ? size : iconSize, + width: size ? size : iconSize, + color: `var(--icon-${convertToCSSVariable(color)})`, + }; return ( - + {accessibilityLabel} diff --git a/packages/opub-ui/src/components/IconButton/IconButton.module.scss b/packages/opub-ui/src/components/IconButton/IconButton.module.scss index 8e252372..952db4fb 100644 --- a/packages/opub-ui/src/components/IconButton/IconButton.module.scss +++ b/packages/opub-ui/src/components/IconButton/IconButton.module.scss @@ -17,7 +17,7 @@ } &:hover { - background: var(--surface-selected); + // background: var(--surface-selected); outline: var(--border-width-1) solid transparent; } @@ -29,7 +29,7 @@ } &:active { - background: var(--surface-selected); + // background: var(--surface-selected); box-shadow: var(--shadow-button-default); &::after { @@ -39,7 +39,7 @@ } &.pressed { - background: var(--surface-selected); + // background: var(--surface-selected); box-shadow: var(--shadow-button-pressed); @include recolor-icon(currentColor); diff --git a/packages/opub-ui/src/components/Tag/Tag.tsx b/packages/opub-ui/src/components/Tag/Tag.tsx index 6380a0c6..c1333f84 100644 --- a/packages/opub-ui/src/components/Tag/Tag.tsx +++ b/packages/opub-ui/src/components/Tag/Tag.tsx @@ -60,7 +60,7 @@ export const Tag = React.forwardRef( onMouseUp={handleMouseUpByBlurring} disabled={disabled} > - + ) : null; diff --git a/packages/opub-ui/src/types/icon.tsx b/packages/opub-ui/src/types/icon.tsx index c307334f..165c8e21 100644 --- a/packages/opub-ui/src/types/icon.tsx +++ b/packages/opub-ui/src/types/icon.tsx @@ -1,4 +1,3 @@ -import { SpacingSpaceScale } from '../tokens'; import { TablerIconsProps } from '@tabler/icons-react'; export type Color = @@ -32,7 +31,7 @@ export interface IconProps { /** Descriptive text to be read to screenreaders */ accessibilityLabel?: string; /** size of the icon, use space tokens */ - size?: SpacingSpaceScale | number; + size?: number; /** stroke width */ stroke?: number; /** class name */ diff --git a/packages/opub-viz/styles/base.css b/packages/opub-viz/styles/base.css index 61e046ba..db442cb0 100644 --- a/packages/opub-viz/styles/base.css +++ b/packages/opub-viz/styles/base.css @@ -82,7 +82,7 @@ body { line-height: 150%; box-sizing: border-box; font-family: var(--primary-font); - --outline: 2px solid var(--focused); + --outline: 2px solid var(--text-interactive); --outline-offset: 2px; } diff --git a/yarn.lock b/yarn.lock index bf8bd8b6..75589fab 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4687,11 +4687,6 @@ resolved "https://registry.yarnpkg.com/@rushstack/eslint-patch/-/eslint-patch-1.4.0.tgz#77e948b9760bd22736a5d26e335a690f76fda37b" integrity sha512-cEjvTPU32OM9lUFegJagO0mRnIn+rbqrG89vV8/xLnLFX0DoR0r1oy5IlTga71Q7uT3Qus7qm7wgeiMT/+Irlg== -"@shopify/polaris-icons@^6.12.0": - version "6.16.0" - resolved "https://registry.yarnpkg.com/@shopify/polaris-icons/-/polaris-icons-6.16.0.tgz#47000cd96bcfcf38efda747482a7ec343c735fd5" - integrity sha512-vEF/6yVSvgPTBgWDbpmcPsZvTyKu+2BeuTYo7Ys6vDTY8ZSQSpK+/uhdT3CJ0WSTr4yibnXeWP6eqssqBmJWtg== - "@sinclair/typebox@^0.27.8": version "0.27.8" resolved "https://registry.yarnpkg.com/@sinclair/typebox/-/typebox-0.27.8.tgz#6667fac16c436b5434a387a34dedb013198f6e6e"