From 364a774131d14daf5fe603a983155373defde212 Mon Sep 17 00:00:00 2001 From: Masoud Amjadi Date: Wed, 1 May 2024 16:47:23 -0400 Subject: [PATCH 1/7] fix(build): fix variables file --- packages/components/src/core/styles/common/defaultTheme.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/packages/components/src/core/styles/common/defaultTheme.ts b/packages/components/src/core/styles/common/defaultTheme.ts index 5d2b1ead8..1a084c42e 100644 --- a/packages/components/src/core/styles/common/defaultTheme.ts +++ b/packages/components/src/core/styles/common/defaultTheme.ts @@ -7,4 +7,7 @@ const defaultThemeOptions: SDSThemeOptions = makeThemeOptions(SDSAppTheme); export const defaultTheme = createTheme(defaultThemeOptions); +/** + * (masoudmanson): This is to keep the old defaultAppTheme export for backward compatibility. + */ export const defaultAppTheme = defaultTheme; From 0bb69bd91bae8ab5e0722b2cc25188ba6d5cda09 Mon Sep 17 00:00:00 2001 From: Masoud Amjadi Date: Wed, 1 May 2024 16:59:15 -0400 Subject: [PATCH 2/7] fix(designtokens): fix sds border design tokens --- .../src/common/styles-dictionary/css/variables.css | 6 +++--- .../src/common/styles-dictionary/design-tokens/borders.json | 6 +++--- .../src/common/styles-dictionary/scss/_variables.scss | 6 +++--- 3 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/components/src/common/styles-dictionary/css/variables.css b/packages/components/src/common/styles-dictionary/css/variables.css index 4179440a0..7c96c6356 100644 --- a/packages/components/src/common/styles-dictionary/css/variables.css +++ b/packages/components/src/common/styles-dictionary/css/variables.css @@ -4,9 +4,9 @@ --sds-border-base-table: 1px solid #cccccc; --sds-border-base-disabled: 1px solid #cccccc; --sds-border-base-default: 1px solid #999999; - --sds-border-base-black: 2px dashed #000000; - --sds-border-base-hover: 2px dashed #000000; - --sds-border-base-dashed: 2px dashed #999999; + --sds-border-base-black: 1px dashed #000000; + --sds-border-base-hover: 1px dashed #000000; + --sds-border-base-dashed: 1px dashed #999999; --sds-border-link-dashed: 1px dashed; --sds-border-link-solid: 1px solid; --sds-border-accent-disabled: 1px solid #a6c9ff; diff --git a/packages/components/src/common/styles-dictionary/design-tokens/borders.json b/packages/components/src/common/styles-dictionary/design-tokens/borders.json index 16c676656..5b0d4d6c2 100644 --- a/packages/components/src/common/styles-dictionary/design-tokens/borders.json +++ b/packages/components/src/common/styles-dictionary/design-tokens/borders.json @@ -9,9 +9,9 @@ "table": { "value": "1px solid {sds.color.primitive.gray.300.value}" }, "disabled": { "value": "1px solid {sds.color.primitive.gray.300.value}" }, "default": { "value": "1px solid {sds.color.primitive.gray.400.value}" }, - "black": { "value": "2px dashed {sds.color.primitive.common.black.value}" }, - "hover": { "value": "2px dashed {sds.color.primitive.common.black.value}" }, - "dashed": { "value": "2px dashed {sds.color.primitive.gray.400.value}" } + "black": { "value": "1px dashed {sds.color.primitive.common.black.value}" }, + "hover": { "value": "1px dashed {sds.color.primitive.common.black.value}" }, + "dashed": { "value": "1px dashed {sds.color.primitive.gray.400.value}" } }, "link": { "dashed": { "value": "1px dashed" }, diff --git a/packages/components/src/common/styles-dictionary/scss/_variables.scss b/packages/components/src/common/styles-dictionary/scss/_variables.scss index f4452839d..fa833dd73 100644 --- a/packages/components/src/common/styles-dictionary/scss/_variables.scss +++ b/packages/components/src/common/styles-dictionary/scss/_variables.scss @@ -3,9 +3,9 @@ $sds-border-base-divider: 1px solid #EAEAEA; $sds-border-base-table: 1px solid #CCCCCC; $sds-border-base-disabled: 1px solid #CCCCCC; $sds-border-base-default: 1px solid #999999; -$sds-border-base-black: 2px dashed #000000; -$sds-border-base-hover: 2px dashed #000000; -$sds-border-base-dashed: 2px dashed #999999; +$sds-border-base-black: 1px dashed #000000; +$sds-border-base-hover: 1px dashed #000000; +$sds-border-base-dashed: 1px dashed #999999; $sds-border-link-dashed: 1px dashed; $sds-border-link-solid: 1px solid; $sds-border-accent-disabled: 1px solid #A6C9FF; From 129dcf16507cdaf9da04190fbad1a1ae01e989a4 Mon Sep 17 00:00:00 2001 From: Masoud Amjadi Date: Wed, 1 May 2024 17:32:15 -0400 Subject: [PATCH 3/7] fix(styles): remove style-dictionary files --- .../styles-dictionary/css/variables.css | 250 ------------------ .../styles-dictionary/scss/_variables.scss | 247 ----------------- 2 files changed, 497 deletions(-) delete mode 100644 packages/components/src/common/styles-dictionary/css/variables.css delete mode 100644 packages/components/src/common/styles-dictionary/scss/_variables.scss diff --git a/packages/components/src/common/styles-dictionary/css/variables.css b/packages/components/src/common/styles-dictionary/css/variables.css deleted file mode 100644 index 7c96c6356..000000000 --- a/packages/components/src/common/styles-dictionary/css/variables.css +++ /dev/null @@ -1,250 +0,0 @@ -:root { - --sds-border-negative-default: 1px solid #dc132c; - --sds-border-base-divider: 1px solid #eaeaea; - --sds-border-base-table: 1px solid #cccccc; - --sds-border-base-disabled: 1px solid #cccccc; - --sds-border-base-default: 1px solid #999999; - --sds-border-base-black: 1px dashed #000000; - --sds-border-base-hover: 1px dashed #000000; - --sds-border-base-dashed: 1px dashed #999999; - --sds-border-link-dashed: 1px dashed; - --sds-border-link-solid: 1px solid; - --sds-border-accent-disabled: 1px solid #a6c9ff; - --sds-border-accent-default: 1px solid #0b68f8; - --sds-border-accent-hover: 1px solid #0142a4; - --sds-border-accent-dashed: 2px dashed #0b68f8; - --sds-border-info-default: 1px solid #0b68f8; - --sds-border-beta-default: 1px solid #7a41ce; - --sds-border-positive-default: 1px solid #3cb371; - --sds-border-notice-default: 1px solid #f5a623; - --sds-border-neutral-default: 1px solid #999999; - --sds-border-none: none; - --sds-color-primitive-common-black: #000000; - --sds-color-primitive-common-white: #ffffff; - --sds-color-primitive-blue-100: #f5f9ff; - --sds-color-primitive-blue-200: #e9f1ff; - --sds-color-primitive-blue-300: #a6c9ff; - --sds-color-primitive-blue-400: #0b68f8; - --sds-color-primitive-blue-500: #0142a4; - --sds-color-primitive-blue-600: #002660; - --sds-color-primitive-gray-100: #f8f8f8; - --sds-color-primitive-gray-200: #eaeaea; - --sds-color-primitive-gray-300: #cccccc; - --sds-color-primitive-gray-400: #999999; - --sds-color-primitive-gray-500: #767676; - --sds-color-primitive-gray-600: #545454; - --sds-color-primitive-green-100: #ecf5f0; - --sds-color-primitive-green-200: #e6f7ed; - --sds-color-primitive-green-400: #3cb371; - --sds-color-primitive-green-500: #349a61; - --sds-color-primitive-green-600: #1c7f48; - --sds-color-primitive-purple-100: #f4f0f9; - --sds-color-primitive-purple-200: #f0ebf6; - --sds-color-primitive-purple-400: #7a41ce; - --sds-color-primitive-purple-500: #703cbe; - --sds-color-primitive-purple-600: #693bac; - --sds-color-primitive-red-100: #fef2f2; - --sds-color-primitive-red-200: #f8e8e8; - --sds-color-primitive-red-400: #dc132c; - --sds-color-primitive-red-500: #c61128; - --sds-color-primitive-red-600: #b70016; - --sds-color-primitive-yellow-100: #fcf6ec; - --sds-color-primitive-yellow-200: #fff3e1; - --sds-color-primitive-yellow-400: #f5a623; - --sds-color-primitive-yellow-500: #d8921f; - --sds-color-primitive-yellow-600: #946314; - --sds-color-primitive-overlay-100: rgba(0, 0, 0, 0.08); - --sds-color-primitive-overlay-200: rgba(0, 0, 0, 0.03); - --sds-color-semantic-text-base-primary: #000000; - --sds-color-semantic-text-base-secondary: #767676; - --sds-color-semantic-text-base-disabled: #cccccc; - --sds-color-semantic-text-base-on-fill: #ffffff; - --sds-color-semantic-text-base-on-fill-disabled: #999999; - --sds-color-semantic-text-base-accent: #002660; - --sds-color-semantic-text-action-default: #0b68f8; - --sds-color-semantic-text-action-hover: #0142a4; - --sds-color-semantic-text-action-pressed: #002660; - --sds-color-semantic-text-beta: #693bac; - --sds-color-semantic-text-info: #002660; - --sds-color-semantic-text-negative: #b70016; - --sds-color-semantic-text-neutral: #545454; - --sds-color-semantic-text-notice: #946314; - --sds-color-semantic-text-positive: #1c7f48; - --sds-color-semantic-component-base-fill: #ffffff; - --sds-color-semantic-component-base-fill-hover: #f8f8f8; - --sds-color-semantic-component-base-fill-pressed: #f8f8f8; - --sds-color-semantic-component-base-fill-open: #f8f8f8; - --sds-color-semantic-component-base-fill-selected: #000000; - --sds-color-semantic-component-base-fill-disabled: #cccccc; - --sds-color-semantic-component-base-on-fill-disabled: #999999; - --sds-color-semantic-component-base-surface: #ffffff; - --sds-color-semantic-component-base-surface-primary: #ffffff; - --sds-color-semantic-component-base-surface-secondary: #f8f8f8; - --sds-color-semantic-component-base-surface-tertiary: #eaeaea; - --sds-color-semantic-component-base-divider: #eaeaea; - --sds-color-semantic-component-base-border: #999999; - --sds-color-semantic-component-base-border-hover: #000000; - --sds-color-semantic-component-base-border-disabled: #cccccc; - --sds-color-semantic-component-base-icon: #767676; - --sds-color-semantic-component-base-icon-hover: #000000; - --sds-color-semantic-component-base-icon-pressed: #000000; - --sds-color-semantic-component-base-icon-disabled: #cccccc; - --sds-color-semantic-component-accent-fill: #0b68f8; - --sds-color-semantic-component-accent-fill-hover: #0142a4; - --sds-color-semantic-component-accent-fill-pressed: #002660; - --sds-color-semantic-component-accent-fill-on-fill: #ffffff; - --sds-color-semantic-component-accent-fill-disabled: #a6c9ff; - --sds-color-semantic-component-accent-surface: #e9f1ff; - --sds-color-semantic-component-accent-border: #0b68f8; - --sds-color-semantic-component-accent-border-hover: #0142a4; - --sds-color-semantic-component-accent-border-open: #0b68f8; - --sds-color-semantic-component-accent-border-focus: #0b68f8; - --sds-color-semantic-component-accent-border-selected: #0b68f8; - --sds-color-semantic-component-accent-border-disabled: #a6c9ff; - --sds-color-semantic-component-accent-icon: #0b68f8; - --sds-color-semantic-component-beta-fill: #7a41ce; - --sds-color-semantic-component-beta-fill-hover: #703cbe; - --sds-color-semantic-component-beta-fill-pressed: #693bac; - --sds-color-semantic-component-beta-fill-on-fill: #ffffff; - --sds-color-semantic-component-beta-surface: #f0ebf6; - --sds-color-semantic-component-beta-border: #7a41ce; - --sds-color-semantic-component-beta-icon: #7a41ce; - --sds-color-semantic-component-info-fill: #0b68f8; - --sds-color-semantic-component-info-fill-hover: #0142a4; - --sds-color-semantic-component-info-fill-pressed: #002660; - --sds-color-semantic-component-info-fill-on-fill: #ffffff; - --sds-color-semantic-component-info-surface: #e9f1ff; - --sds-color-semantic-component-info-border: #0b68f8; - --sds-color-semantic-component-info-icon: #0b68f8; - --sds-color-semantic-component-negative-fill: #dc132c; - --sds-color-semantic-component-negative-fill-hover: #c61128; - --sds-color-semantic-component-negative-fill-pressed: #b70016; - --sds-color-semantic-component-negative-fill-on-fill: #ffffff; - --sds-color-semantic-component-negative-surface: #f8e8e8; - --sds-color-semantic-component-negative-border: #dc132c; - --sds-color-semantic-component-negative-icon: #dc132c; - --sds-color-semantic-component-neutral-fill: #999999; - --sds-color-semantic-component-neutral-fill-hover: #767676; - --sds-color-semantic-component-neutral-fill-pressed: #545454; - --sds-color-semantic-component-neutral-fill-on-fill: #ffffff; - --sds-color-semantic-component-neutral-surface: #eaeaea; - --sds-color-semantic-component-neutral-border: #999999; - --sds-color-semantic-component-neutral-icon: #999999; - --sds-color-semantic-component-notice-fill: #f5a623; - --sds-color-semantic-component-notice-fill-hover: #d8921f; - --sds-color-semantic-component-notice-fill-pressed: #946314; - --sds-color-semantic-component-notice-fill-on-fill: #ffffff; - --sds-color-semantic-component-notice-surface: #fff3e1; - --sds-color-semantic-component-notice-border: #f5a623; - --sds-color-semantic-component-notice-icon: #f5a623; - --sds-color-semantic-component-positive-fill: #3cb371; - --sds-color-semantic-component-positive-fill-hover: #349a61; - --sds-color-semantic-component-positive-fill-pressed: #1c7f48; - --sds-color-semantic-component-positive-fill-on-fill: #ffffff; - --sds-color-semantic-component-positive-surface: #e6f7ed; - --sds-color-semantic-component-positive-border: #3cb371; - --sds-color-semantic-component-positive-icon: #3cb371; - --sds-corner-l: 20px; - --sds-corner-m: 4px; - --sds-corner-s: 2px; - --sds-corner-none: 0px; - --sds-drop-shadow-l: 0px 2px 12px 0px rgba(0, 0, 0, 0.3); - --sds-drop-shadow-m: 0px 2px 10px 0px rgba(0, 0, 0, 0.15), - 0px 2px 4px 0px rgba(0, 0, 0, 0.15); - --sds-drop-shadow-s: 0px 2px 4px 0px rgba(0, 0, 0, 0.25); - --sds-drop-shadow-none: none; - --sds-font-color: black; - --sds-font-font-family-body: "Inter", sans-serif; - --sds-font-font-family-caps: "Inter", sans-serif; - --sds-font-font-family-code: "IBM Plex Mono", monospace; - --sds-font-font-family-header: "Inter", sans-serif; - --sds-font-font-family-tabular: "Inter", sans-serif; - --sds-font-body-xxxs-400-font: 400 11px/16px "Inter", sans-serif; - --sds-font-body-xxxs-400-letter-spacing: 0.1px; - --sds-font-body-xxxs-600-font: 600 11px/16px "Inter", sans-serif; - --sds-font-body-xxxs-600-letter-spacing: 0.1px; - --sds-font-body-xxs-400-font: 400 12px/18px "Inter", sans-serif; - --sds-font-body-xxs-400-letter-spacing: 0.1px; - --sds-font-body-xxs-600-font: 600 12px/18px "Inter", sans-serif; - --sds-font-body-xxs-600-letter-spacing: 0.1px; - --sds-font-body-xs-400-font: 400 13px/20px "Inter", sans-serif; - --sds-font-body-xs-400-letter-spacing: 0.08px; - --sds-font-body-xs-600-font: 600 13px/20px "Inter", sans-serif; - --sds-font-body-xs-600-letter-spacing: 0.08px; - --sds-font-body-s-400-font: 400 14px/24px "Inter", sans-serif; - --sds-font-body-s-400-letter-spacing: 0.08px; - --sds-font-body-s-600-font: 600 14px/24px "Inter", sans-serif; - --sds-font-body-s-600-letter-spacing: 0.08px; - --sds-font-body-m-400-font: 400 16px/26px "Inter", sans-serif; - --sds-font-body-m-400-letter-spacing: 0px; - --sds-font-body-m-600-font: 600 16px/26px "Inter", sans-serif; - --sds-font-body-m-600-letter-spacing: 0px; - --sds-font-body-l-400-font: 400 18px/28px "Inter", sans-serif; - --sds-font-body-l-400-letter-spacing: 0px; - --sds-font-body-l-600-font: 600 18px/28px "Inter", sans-serif; - --sds-font-body-l-600-letter-spacing: 0px; - --sds-font-caps-xxxxs-600-font: 600 10px/14px "Inter", sans-serif; - --sds-font-caps-xxxxs-600-letter-spacing: 0.5px; - --sds-font-caps-xxxxs-600-text-transform: uppercase; - --sds-font-caps-xxxs-600-font: 600 11px/16px "Inter", sans-serif; - --sds-font-caps-xxxs-600-letter-spacing: 0.5px; - --sds-font-caps-xxxs-600-text-transform: uppercase; - --sds-font-caps-xxs-600-font: 600 12px/18px "Inter", sans-serif; - --sds-font-caps-xxs-600-letter-spacing: 0.5px; - --sds-font-caps-xxs-600-text-transform: uppercase; - --sds-font-header-xxxs-600-font: 600 11px/16px "Inter", sans-serif; - --sds-font-header-xxxs-600-letter-spacing: 0.1px; - --sds-font-header-xxs-600-font: 600 12px/18px "Inter", sans-serif; - --sds-font-header-xxs-600-letter-spacing: 0.1px; - --sds-font-header-xs-600-font: 600 13px/18px "Inter", sans-serif; - --sds-font-header-xs-600-letter-spacing: 0.08px; - --sds-font-header-s-600-font: 600 14px/20px "Inter", sans-serif; - --sds-font-header-s-600-letter-spacing: 0.08px; - --sds-font-header-m-600-font: 600 16px/22px "Inter", sans-serif; - --sds-font-header-m-600-letter-spacing: 0px; - --sds-font-header-l-600-font: 600 18px/24px "Inter", sans-serif; - --sds-font-header-l-600-letter-spacing: 0px; - --sds-font-header-xl-600-font: 600 22px/30px "Inter", sans-serif; - --sds-font-header-xl-600-letter-spacing: 0px; - --sds-font-header-xxl-600-font: 600 26px/34px "Inter", sans-serif; - --sds-font-header-xxl-600-letter-spacing: 0px; - --sds-font-tabular-xs-400-font: 400 13px/20px "Inter", sans-serif; - --sds-font-tabular-xs-400-font-variant-numeric: tabular-nums; - --sds-font-tabular-xs-400-letter-spacing: 0px; - --sds-font-tabular-xs-600-font: 600 13px/20px "Inter", sans-serif; - --sds-font-tabular-xs-600-font-variant-numeric: tabular-nums; - --sds-font-tabular-xs-600-letter-spacing: 0px; - --sds-font-tabular-s-400-font: 400 14px/24px "Inter", sans-serif; - --sds-font-tabular-s-400-font-variant-numeric: tabular-nums; - --sds-font-tabular-s-400-letter-spacing: 0px; - --sds-font-tabular-s-600-font: 600 14px/24px "Inter", sans-serif; - --sds-font-tabular-s-600-font-variant-numeric: tabular-nums; - --sds-font-tabular-s-600-letter-spacing: 0px; - --sds-font-code-xs-400-font: 400 13px/20px "IBM Plex Mono", monospace; - --sds-font-code-xs-400-letter-spacing: 0px; - --sds-font-code-xs-600-font: 600 13px/20px "IBM Plex Mono", monospace; - --sds-font-code-xs-600-letter-spacing: 0px; - --sds-font-code-s-400-font: 400 14px/24px "IBM Plex Mono", monospace; - --sds-font-code-s-400-letter-spacing: 0px; - --sds-font-code-s-600-font: 600 14px/24px "IBM Plex Mono", monospace; - --sds-font-code-s-600-letter-spacing: 0px; - --sds-icon-size-input-height: 16px; - --sds-icon-size-input-width: 16px; - --sds-icon-size-xs-height: 12px; - --sds-icon-size-xs-width: 12px; - --sds-icon-size-s-height: 16px; - --sds-icon-size-s-width: 16px; - --sds-icon-size-l-height: 24px; - --sds-icon-size-l-width: 24px; - --sds-icon-size-xl-height: 32px; - --sds-icon-size-xl-width: 32px; - --sds-space-default: 12px; - --sds-space-xxxs: 2px; - --sds-space-xxs: 4px; - --sds-space-xs: 6px; - --sds-space-s: 8px; - --sds-space-m: 12px; - --sds-space-l: 16px; - --sds-space-xl: 24px; - --sds-space-xxl: 40px; -} diff --git a/packages/components/src/common/styles-dictionary/scss/_variables.scss b/packages/components/src/common/styles-dictionary/scss/_variables.scss deleted file mode 100644 index fa833dd73..000000000 --- a/packages/components/src/common/styles-dictionary/scss/_variables.scss +++ /dev/null @@ -1,247 +0,0 @@ -$sds-border-negative-default: 1px solid #DC132C; -$sds-border-base-divider: 1px solid #EAEAEA; -$sds-border-base-table: 1px solid #CCCCCC; -$sds-border-base-disabled: 1px solid #CCCCCC; -$sds-border-base-default: 1px solid #999999; -$sds-border-base-black: 1px dashed #000000; -$sds-border-base-hover: 1px dashed #000000; -$sds-border-base-dashed: 1px dashed #999999; -$sds-border-link-dashed: 1px dashed; -$sds-border-link-solid: 1px solid; -$sds-border-accent-disabled: 1px solid #A6C9FF; -$sds-border-accent-default: 1px solid #0B68F8; -$sds-border-accent-hover: 1px solid #0142A4; -$sds-border-accent-dashed: 2px dashed #0B68F8; -$sds-border-info-default: 1px solid #0B68F8; -$sds-border-beta-default: 1px solid #7A41CE; -$sds-border-positive-default: 1px solid #3CB371; -$sds-border-notice-default: 1px solid #F5A623; -$sds-border-neutral-default: 1px solid #999999; -$sds-border-none: none; -$sds-color-primitive-common-black: #000000; -$sds-color-primitive-common-white: #FFFFFF; -$sds-color-primitive-blue-100: #F5F9FF; -$sds-color-primitive-blue-200: #E9F1FF; -$sds-color-primitive-blue-300: #A6C9FF; -$sds-color-primitive-blue-400: #0B68F8; -$sds-color-primitive-blue-500: #0142A4; -$sds-color-primitive-blue-600: #002660; -$sds-color-primitive-gray-100: #F8F8F8; -$sds-color-primitive-gray-200: #EAEAEA; -$sds-color-primitive-gray-300: #CCCCCC; -$sds-color-primitive-gray-400: #999999; -$sds-color-primitive-gray-500: #767676; -$sds-color-primitive-gray-600: #545454; -$sds-color-primitive-green-100: #ECF5F0; -$sds-color-primitive-green-200: #E6F7ED; -$sds-color-primitive-green-400: #3CB371; -$sds-color-primitive-green-500: #349A61; -$sds-color-primitive-green-600: #1C7F48; -$sds-color-primitive-purple-100: #F4F0F9; -$sds-color-primitive-purple-200: #F0EBF6; -$sds-color-primitive-purple-400: #7A41CE; -$sds-color-primitive-purple-500: #703CBE; -$sds-color-primitive-purple-600: #693BAC; -$sds-color-primitive-red-100: #FEF2F2; -$sds-color-primitive-red-200: #F8E8E8; -$sds-color-primitive-red-400: #DC132C; -$sds-color-primitive-red-500: #C61128; -$sds-color-primitive-red-600: #B70016; -$sds-color-primitive-yellow-100: #FCF6EC; -$sds-color-primitive-yellow-200: #FFF3E1; -$sds-color-primitive-yellow-400: #F5A623; -$sds-color-primitive-yellow-500: #D8921F; -$sds-color-primitive-yellow-600: #946314; -$sds-color-primitive-overlay-100: rgba(0, 0, 0, 0.08); -$sds-color-primitive-overlay-200: rgba(0, 0, 0, 0.03); -$sds-color-semantic-text-base-primary: #000000; -$sds-color-semantic-text-base-secondary: #767676; -$sds-color-semantic-text-base-disabled: #CCCCCC; -$sds-color-semantic-text-base-on-fill: #FFFFFF; -$sds-color-semantic-text-base-on-fill-disabled: #999999; -$sds-color-semantic-text-base-accent: #002660; -$sds-color-semantic-text-action-default: #0B68F8; -$sds-color-semantic-text-action-hover: #0142A4; -$sds-color-semantic-text-action-pressed: #002660; -$sds-color-semantic-text-beta: #693BAC; -$sds-color-semantic-text-info: #002660; -$sds-color-semantic-text-negative: #B70016; -$sds-color-semantic-text-neutral: #545454; -$sds-color-semantic-text-notice: #946314; -$sds-color-semantic-text-positive: #1C7F48; -$sds-color-semantic-component-base-fill: #FFFFFF; -$sds-color-semantic-component-base-fill-hover: #F8F8F8; -$sds-color-semantic-component-base-fill-pressed: #F8F8F8; -$sds-color-semantic-component-base-fill-open: #F8F8F8; -$sds-color-semantic-component-base-fill-selected: #000000; -$sds-color-semantic-component-base-fill-disabled: #CCCCCC; -$sds-color-semantic-component-base-on-fill-disabled: #999999; -$sds-color-semantic-component-base-surface: #FFFFFF; -$sds-color-semantic-component-base-surface-primary: #FFFFFF; -$sds-color-semantic-component-base-surface-secondary: #F8F8F8; -$sds-color-semantic-component-base-surface-tertiary: #EAEAEA; -$sds-color-semantic-component-base-divider: #EAEAEA; -$sds-color-semantic-component-base-border: #999999; -$sds-color-semantic-component-base-border-hover: #000000; -$sds-color-semantic-component-base-border-disabled: #CCCCCC; -$sds-color-semantic-component-base-icon: #767676; -$sds-color-semantic-component-base-icon-hover: #000000; -$sds-color-semantic-component-base-icon-pressed: #000000; -$sds-color-semantic-component-base-icon-disabled: #CCCCCC; -$sds-color-semantic-component-accent-fill: #0B68F8; -$sds-color-semantic-component-accent-fill-hover: #0142A4; -$sds-color-semantic-component-accent-fill-pressed: #002660; -$sds-color-semantic-component-accent-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-accent-fill-disabled: #A6C9FF; -$sds-color-semantic-component-accent-surface: #E9F1FF; -$sds-color-semantic-component-accent-border: #0B68F8; -$sds-color-semantic-component-accent-border-hover: #0142A4; -$sds-color-semantic-component-accent-border-open: #0B68F8; -$sds-color-semantic-component-accent-border-focus: #0B68F8; -$sds-color-semantic-component-accent-border-selected: #0B68F8; -$sds-color-semantic-component-accent-border-disabled: #A6C9FF; -$sds-color-semantic-component-accent-icon: #0B68F8; -$sds-color-semantic-component-beta-fill: #7A41CE; -$sds-color-semantic-component-beta-fill-hover: #703CBE; -$sds-color-semantic-component-beta-fill-pressed: #693BAC; -$sds-color-semantic-component-beta-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-beta-surface: #F0EBF6; -$sds-color-semantic-component-beta-border: #7A41CE; -$sds-color-semantic-component-beta-icon: #7A41CE; -$sds-color-semantic-component-info-fill: #0B68F8; -$sds-color-semantic-component-info-fill-hover: #0142A4; -$sds-color-semantic-component-info-fill-pressed: #002660; -$sds-color-semantic-component-info-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-info-surface: #E9F1FF; -$sds-color-semantic-component-info-border: #0B68F8; -$sds-color-semantic-component-info-icon: #0B68F8; -$sds-color-semantic-component-negative-fill: #DC132C; -$sds-color-semantic-component-negative-fill-hover: #C61128; -$sds-color-semantic-component-negative-fill-pressed: #B70016; -$sds-color-semantic-component-negative-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-negative-surface: #F8E8E8; -$sds-color-semantic-component-negative-border: #DC132C; -$sds-color-semantic-component-negative-icon: #DC132C; -$sds-color-semantic-component-neutral-fill: #999999; -$sds-color-semantic-component-neutral-fill-hover: #767676; -$sds-color-semantic-component-neutral-fill-pressed: #545454; -$sds-color-semantic-component-neutral-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-neutral-surface: #EAEAEA; -$sds-color-semantic-component-neutral-border: #999999; -$sds-color-semantic-component-neutral-icon: #999999; -$sds-color-semantic-component-notice-fill: #F5A623; -$sds-color-semantic-component-notice-fill-hover: #D8921F; -$sds-color-semantic-component-notice-fill-pressed: #946314; -$sds-color-semantic-component-notice-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-notice-surface: #FFF3E1; -$sds-color-semantic-component-notice-border: #F5A623; -$sds-color-semantic-component-notice-icon: #F5A623; -$sds-color-semantic-component-positive-fill: #3CB371; -$sds-color-semantic-component-positive-fill-hover: #349A61; -$sds-color-semantic-component-positive-fill-pressed: #1C7F48; -$sds-color-semantic-component-positive-fill-on-fill: #FFFFFF; -$sds-color-semantic-component-positive-surface: #E6F7ED; -$sds-color-semantic-component-positive-border: #3CB371; -$sds-color-semantic-component-positive-icon: #3CB371; -$sds-corner-l: 20px; -$sds-corner-m: 4px; -$sds-corner-s: 2px; -$sds-corner-none: 0px; -$sds-drop-shadow-l: 0.0px 2.0px 12.0px 0px rgba(0, 0, 0, 0.3); -$sds-drop-shadow-m: 0.0px 2.0px 10.0px 0px rgba(0, 0, 0, 0.15), 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.15); -$sds-drop-shadow-s: 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.25); -$sds-drop-shadow-none: none; -$sds-font-color: black; -$sds-font-font-family-body: "Inter", sans-serif; -$sds-font-font-family-caps: "Inter", sans-serif; -$sds-font-font-family-code: "IBM Plex Mono", monospace; -$sds-font-font-family-header: "Inter", sans-serif; -$sds-font-font-family-tabular: "Inter", sans-serif; -$sds-font-body-xxxs-400-font: 400 11px/16px "Inter", sans-serif; -$sds-font-body-xxxs-400-letter-spacing: 0.1px; -$sds-font-body-xxxs-600-font: 600 11px/16px "Inter", sans-serif; -$sds-font-body-xxxs-600-letter-spacing: 0.1px; -$sds-font-body-xxs-400-font: 400 12px/18px "Inter", sans-serif; -$sds-font-body-xxs-400-letter-spacing: 0.1px; -$sds-font-body-xxs-600-font: 600 12px/18px "Inter", sans-serif; -$sds-font-body-xxs-600-letter-spacing: 0.1px; -$sds-font-body-xs-400-font: 400 13px/20px "Inter", sans-serif; -$sds-font-body-xs-400-letter-spacing: 0.08px; -$sds-font-body-xs-600-font: 600 13px/20px "Inter", sans-serif; -$sds-font-body-xs-600-letter-spacing: 0.08px; -$sds-font-body-s-400-font: 400 14px/24px "Inter", sans-serif; -$sds-font-body-s-400-letter-spacing: 0.08px; -$sds-font-body-s-600-font: 600 14px/24px "Inter", sans-serif; -$sds-font-body-s-600-letter-spacing: 0.08px; -$sds-font-body-m-400-font: 400 16px/26px "Inter", sans-serif; -$sds-font-body-m-400-letter-spacing: 0px; -$sds-font-body-m-600-font: 600 16px/26px "Inter", sans-serif; -$sds-font-body-m-600-letter-spacing: 0px; -$sds-font-body-l-400-font: 400 18px/28px "Inter", sans-serif; -$sds-font-body-l-400-letter-spacing: 0px; -$sds-font-body-l-600-font: 600 18px/28px "Inter", sans-serif; -$sds-font-body-l-600-letter-spacing: 0px; -$sds-font-caps-xxxxs-600-font: 600 10px/14px "Inter", sans-serif; -$sds-font-caps-xxxxs-600-letter-spacing: 0.5px; -$sds-font-caps-xxxxs-600-text-transform: uppercase; -$sds-font-caps-xxxs-600-font: 600 11px/16px "Inter", sans-serif; -$sds-font-caps-xxxs-600-letter-spacing: 0.5px; -$sds-font-caps-xxxs-600-text-transform: uppercase; -$sds-font-caps-xxs-600-font: 600 12px/18px "Inter", sans-serif; -$sds-font-caps-xxs-600-letter-spacing: 0.5px; -$sds-font-caps-xxs-600-text-transform: uppercase; -$sds-font-header-xxxs-600-font: 600 11px/16px "Inter", sans-serif; -$sds-font-header-xxxs-600-letter-spacing: 0.1px; -$sds-font-header-xxs-600-font: 600 12px/18px "Inter", sans-serif; -$sds-font-header-xxs-600-letter-spacing: 0.1px; -$sds-font-header-xs-600-font: 600 13px/18px "Inter", sans-serif; -$sds-font-header-xs-600-letter-spacing: 0.08px; -$sds-font-header-s-600-font: 600 14px/20px "Inter", sans-serif; -$sds-font-header-s-600-letter-spacing: 0.08px; -$sds-font-header-m-600-font: 600 16px/22px "Inter", sans-serif; -$sds-font-header-m-600-letter-spacing: 0px; -$sds-font-header-l-600-font: 600 18px/24px "Inter", sans-serif; -$sds-font-header-l-600-letter-spacing: 0px; -$sds-font-header-xl-600-font: 600 22px/30px "Inter", sans-serif; -$sds-font-header-xl-600-letter-spacing: 0px; -$sds-font-header-xxl-600-font: 600 26px/34px "Inter", sans-serif; -$sds-font-header-xxl-600-letter-spacing: 0px; -$sds-font-tabular-xs-400-font: 400 13px/20px "Inter", sans-serif; -$sds-font-tabular-xs-400-font-variant-numeric: tabular-nums; -$sds-font-tabular-xs-400-letter-spacing: 0px; -$sds-font-tabular-xs-600-font: 600 13px/20px "Inter", sans-serif; -$sds-font-tabular-xs-600-font-variant-numeric: tabular-nums; -$sds-font-tabular-xs-600-letter-spacing: 0px; -$sds-font-tabular-s-400-font: 400 14px/24px "Inter", sans-serif; -$sds-font-tabular-s-400-font-variant-numeric: tabular-nums; -$sds-font-tabular-s-400-letter-spacing: 0px; -$sds-font-tabular-s-600-font: 600 14px/24px "Inter", sans-serif; -$sds-font-tabular-s-600-font-variant-numeric: tabular-nums; -$sds-font-tabular-s-600-letter-spacing: 0px; -$sds-font-code-xs-400-font: 400 13px/20px "IBM Plex Mono", monospace; -$sds-font-code-xs-400-letter-spacing: 0px; -$sds-font-code-xs-600-font: 600 13px/20px "IBM Plex Mono", monospace; -$sds-font-code-xs-600-letter-spacing: 0px; -$sds-font-code-s-400-font: 400 14px/24px "IBM Plex Mono", monospace; -$sds-font-code-s-400-letter-spacing: 0px; -$sds-font-code-s-600-font: 600 14px/24px "IBM Plex Mono", monospace; -$sds-font-code-s-600-letter-spacing: 0px; -$sds-icon-size-input-height: 16px; -$sds-icon-size-input-width: 16px; -$sds-icon-size-xs-height: 12px; -$sds-icon-size-xs-width: 12px; -$sds-icon-size-s-height: 16px; -$sds-icon-size-s-width: 16px; -$sds-icon-size-l-height: 24px; -$sds-icon-size-l-width: 24px; -$sds-icon-size-xl-height: 32px; -$sds-icon-size-xl-width: 32px; -$sds-space-default: 12px; -$sds-space-xxxs: 2px; -$sds-space-xxs: 4px; -$sds-space-xs: 6px; -$sds-space-s: 8px; -$sds-space-m: 12px; -$sds-space-l: 16px; -$sds-space-xl: 24px; -$sds-space-xxl: 40px; From 1ae6fc16391dcd28caa8dffa2cc70ae46fddf567 Mon Sep 17 00:00:00 2001 From: masoudmanson Date: Wed, 1 May 2024 21:34:22 +0000 Subject: [PATCH 4/7] chore(release): publish - @czi-sds/components@20.1.0 - @czi-sds/data-viz@0.8.0 --- packages/components/CHANGELOG.md | 12 ++++++++++++ packages/components/package.json | 2 +- packages/data-viz/CHANGELOG.md | 6 ++++++ packages/data-viz/package.json | 2 +- 4 files changed, 20 insertions(+), 2 deletions(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 7afa0b2b1..befab77a9 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -3,6 +3,18 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [20.1.0](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.0.1...@czi-sds/components@20.1.0) (2024-05-01) + +### Bug Fixes + +- **build:** fix variables file ([364a774](https://github.com/chanzuckerberg/sci-components/commit/364a774131d14daf5fe603a983155373defde212)) +- **designtokens:** fix sds border design tokens ([0bb69bd](https://github.com/chanzuckerberg/sci-components/commit/0bb69bd91bae8ab5e0722b2cc25188ba6d5cda09)) +- **styles:** remove style-dictionary files ([129dcf1](https://github.com/chanzuckerberg/sci-components/commit/129dcf16507cdaf9da04190fbad1a1ae01e989a4)) + +### Features + +- **Button:** figma refactor button ([#761](https://github.com/chanzuckerberg/sci-components/issues/761)) ([199bc4c](https://github.com/chanzuckerberg/sci-components/commit/199bc4c03f7366e0e6bff79575bc727708f9ac57)) + ## [20.0.1](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.0.0...@czi-sds/components@20.0.1) (2024-04-15) ### Bug Fixes diff --git a/packages/components/package.json b/packages/components/package.json index 150eda2b6..4c2669c32 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@czi-sds/components", - "version": "20.0.1", + "version": "20.1.0", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "types": "dist/index.cjs.d.ts", diff --git a/packages/data-viz/CHANGELOG.md b/packages/data-viz/CHANGELOG.md index cce11c6d5..a9ce7e80b 100644 --- a/packages/data-viz/CHANGELOG.md +++ b/packages/data-viz/CHANGELOG.md @@ -3,6 +3,12 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [0.8.0](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/data-viz@0.7.0...@czi-sds/data-viz@0.8.0) (2024-05-01) + +### Features + +- **Button:** figma refactor button ([#761](https://github.com/chanzuckerberg/sci-components/issues/761)) ([199bc4c](https://github.com/chanzuckerberg/sci-components/commit/199bc4c03f7366e0e6bff79575bc727708f9ac57)) + # [0.7.0](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/data-viz@0.6.0...@czi-sds/data-viz@0.7.0) (2024-04-11) ### Features diff --git a/packages/data-viz/package.json b/packages/data-viz/package.json index 7fe7a53a0..b6b15c2ef 100644 --- a/packages/data-viz/package.json +++ b/packages/data-viz/package.json @@ -1,6 +1,6 @@ { "name": "@czi-sds/data-viz", - "version": "0.7.0", + "version": "0.8.0", "main": "dist/index.cjs.js", "types": "dist/index.cjs.d.ts", "module": "dist/index.esm.js", From a894fa4c95ecb7904df87c7bc69f2b9a66c71519 Mon Sep 17 00:00:00 2001 From: masoudmanson Date: Wed, 1 May 2024 21:34:24 +0000 Subject: [PATCH 5/7] chore(release): Publish --- .../styles-dictionary/css/variables.css | 249 ++++++++++++++++++ .../styles-dictionary/scss/_variables.scss | 247 +++++++++++++++++ 2 files changed, 496 insertions(+) create mode 100644 packages/components/src/common/styles-dictionary/css/variables.css create mode 100644 packages/components/src/common/styles-dictionary/scss/_variables.scss diff --git a/packages/components/src/common/styles-dictionary/css/variables.css b/packages/components/src/common/styles-dictionary/css/variables.css new file mode 100644 index 000000000..7ad2ee1ce --- /dev/null +++ b/packages/components/src/common/styles-dictionary/css/variables.css @@ -0,0 +1,249 @@ +:root { + --sds-border-negative-default: 1px solid #DC132C; + --sds-border-base-divider: 1px solid #EAEAEA; + --sds-border-base-table: 1px solid #CCCCCC; + --sds-border-base-disabled: 1px solid #CCCCCC; + --sds-border-base-default: 1px solid #999999; + --sds-border-base-black: 1px dashed #000000; + --sds-border-base-hover: 1px dashed #000000; + --sds-border-base-dashed: 1px dashed #999999; + --sds-border-link-dashed: 1px dashed; + --sds-border-link-solid: 1px solid; + --sds-border-accent-disabled: 1px solid #A6C9FF; + --sds-border-accent-default: 1px solid #0B68F8; + --sds-border-accent-hover: 1px solid #0142A4; + --sds-border-accent-dashed: 2px dashed #0B68F8; + --sds-border-info-default: 1px solid #0B68F8; + --sds-border-beta-default: 1px solid #7A41CE; + --sds-border-positive-default: 1px solid #3CB371; + --sds-border-notice-default: 1px solid #F5A623; + --sds-border-neutral-default: 1px solid #999999; + --sds-border-none: none; + --sds-color-primitive-common-black: #000000; + --sds-color-primitive-common-white: #FFFFFF; + --sds-color-primitive-blue-100: #F5F9FF; + --sds-color-primitive-blue-200: #E9F1FF; + --sds-color-primitive-blue-300: #A6C9FF; + --sds-color-primitive-blue-400: #0B68F8; + --sds-color-primitive-blue-500: #0142A4; + --sds-color-primitive-blue-600: #002660; + --sds-color-primitive-gray-100: #F8F8F8; + --sds-color-primitive-gray-200: #EAEAEA; + --sds-color-primitive-gray-300: #CCCCCC; + --sds-color-primitive-gray-400: #999999; + --sds-color-primitive-gray-500: #767676; + --sds-color-primitive-gray-600: #545454; + --sds-color-primitive-green-100: #ECF5F0; + --sds-color-primitive-green-200: #E6F7ED; + --sds-color-primitive-green-400: #3CB371; + --sds-color-primitive-green-500: #349A61; + --sds-color-primitive-green-600: #1C7F48; + --sds-color-primitive-purple-100: #F4F0F9; + --sds-color-primitive-purple-200: #F0EBF6; + --sds-color-primitive-purple-400: #7A41CE; + --sds-color-primitive-purple-500: #703CBE; + --sds-color-primitive-purple-600: #693BAC; + --sds-color-primitive-red-100: #FEF2F2; + --sds-color-primitive-red-200: #F8E8E8; + --sds-color-primitive-red-400: #DC132C; + --sds-color-primitive-red-500: #C61128; + --sds-color-primitive-red-600: #B70016; + --sds-color-primitive-yellow-100: #FCF6EC; + --sds-color-primitive-yellow-200: #FFF3E1; + --sds-color-primitive-yellow-400: #F5A623; + --sds-color-primitive-yellow-500: #D8921F; + --sds-color-primitive-yellow-600: #946314; + --sds-color-primitive-overlay-100: rgba(0, 0, 0, 0.08); + --sds-color-primitive-overlay-200: rgba(0, 0, 0, 0.03); + --sds-color-semantic-text-base-primary: #000000; + --sds-color-semantic-text-base-secondary: #767676; + --sds-color-semantic-text-base-disabled: #CCCCCC; + --sds-color-semantic-text-base-on-fill: #FFFFFF; + --sds-color-semantic-text-base-on-fill-disabled: #999999; + --sds-color-semantic-text-base-accent: #002660; + --sds-color-semantic-text-action-default: #0B68F8; + --sds-color-semantic-text-action-hover: #0142A4; + --sds-color-semantic-text-action-pressed: #002660; + --sds-color-semantic-text-beta: #693BAC; + --sds-color-semantic-text-info: #002660; + --sds-color-semantic-text-negative: #B70016; + --sds-color-semantic-text-neutral: #545454; + --sds-color-semantic-text-notice: #946314; + --sds-color-semantic-text-positive: #1C7F48; + --sds-color-semantic-component-base-fill: #FFFFFF; + --sds-color-semantic-component-base-fill-hover: #F8F8F8; + --sds-color-semantic-component-base-fill-pressed: #F8F8F8; + --sds-color-semantic-component-base-fill-open: #F8F8F8; + --sds-color-semantic-component-base-fill-selected: #000000; + --sds-color-semantic-component-base-fill-disabled: #CCCCCC; + --sds-color-semantic-component-base-on-fill-disabled: #999999; + --sds-color-semantic-component-base-surface: #FFFFFF; + --sds-color-semantic-component-base-surface-primary: #FFFFFF; + --sds-color-semantic-component-base-surface-secondary: #F8F8F8; + --sds-color-semantic-component-base-surface-tertiary: #EAEAEA; + --sds-color-semantic-component-base-divider: #EAEAEA; + --sds-color-semantic-component-base-border: #999999; + --sds-color-semantic-component-base-border-hover: #000000; + --sds-color-semantic-component-base-border-disabled: #CCCCCC; + --sds-color-semantic-component-base-icon: #767676; + --sds-color-semantic-component-base-icon-hover: #000000; + --sds-color-semantic-component-base-icon-pressed: #000000; + --sds-color-semantic-component-base-icon-disabled: #CCCCCC; + --sds-color-semantic-component-accent-fill: #0B68F8; + --sds-color-semantic-component-accent-fill-hover: #0142A4; + --sds-color-semantic-component-accent-fill-pressed: #002660; + --sds-color-semantic-component-accent-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-accent-fill-disabled: #A6C9FF; + --sds-color-semantic-component-accent-surface: #E9F1FF; + --sds-color-semantic-component-accent-border: #0B68F8; + --sds-color-semantic-component-accent-border-hover: #0142A4; + --sds-color-semantic-component-accent-border-open: #0B68F8; + --sds-color-semantic-component-accent-border-focus: #0B68F8; + --sds-color-semantic-component-accent-border-selected: #0B68F8; + --sds-color-semantic-component-accent-border-disabled: #A6C9FF; + --sds-color-semantic-component-accent-icon: #0B68F8; + --sds-color-semantic-component-beta-fill: #7A41CE; + --sds-color-semantic-component-beta-fill-hover: #703CBE; + --sds-color-semantic-component-beta-fill-pressed: #693BAC; + --sds-color-semantic-component-beta-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-beta-surface: #F0EBF6; + --sds-color-semantic-component-beta-border: #7A41CE; + --sds-color-semantic-component-beta-icon: #7A41CE; + --sds-color-semantic-component-info-fill: #0B68F8; + --sds-color-semantic-component-info-fill-hover: #0142A4; + --sds-color-semantic-component-info-fill-pressed: #002660; + --sds-color-semantic-component-info-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-info-surface: #E9F1FF; + --sds-color-semantic-component-info-border: #0B68F8; + --sds-color-semantic-component-info-icon: #0B68F8; + --sds-color-semantic-component-negative-fill: #DC132C; + --sds-color-semantic-component-negative-fill-hover: #C61128; + --sds-color-semantic-component-negative-fill-pressed: #B70016; + --sds-color-semantic-component-negative-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-negative-surface: #F8E8E8; + --sds-color-semantic-component-negative-border: #DC132C; + --sds-color-semantic-component-negative-icon: #DC132C; + --sds-color-semantic-component-neutral-fill: #999999; + --sds-color-semantic-component-neutral-fill-hover: #767676; + --sds-color-semantic-component-neutral-fill-pressed: #545454; + --sds-color-semantic-component-neutral-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-neutral-surface: #EAEAEA; + --sds-color-semantic-component-neutral-border: #999999; + --sds-color-semantic-component-neutral-icon: #999999; + --sds-color-semantic-component-notice-fill: #F5A623; + --sds-color-semantic-component-notice-fill-hover: #D8921F; + --sds-color-semantic-component-notice-fill-pressed: #946314; + --sds-color-semantic-component-notice-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-notice-surface: #FFF3E1; + --sds-color-semantic-component-notice-border: #F5A623; + --sds-color-semantic-component-notice-icon: #F5A623; + --sds-color-semantic-component-positive-fill: #3CB371; + --sds-color-semantic-component-positive-fill-hover: #349A61; + --sds-color-semantic-component-positive-fill-pressed: #1C7F48; + --sds-color-semantic-component-positive-fill-on-fill: #FFFFFF; + --sds-color-semantic-component-positive-surface: #E6F7ED; + --sds-color-semantic-component-positive-border: #3CB371; + --sds-color-semantic-component-positive-icon: #3CB371; + --sds-corner-l: 20px; + --sds-corner-m: 4px; + --sds-corner-s: 2px; + --sds-corner-none: 0px; + --sds-drop-shadow-l: 0.0px 2.0px 12.0px 0px rgba(0, 0, 0, 0.3); + --sds-drop-shadow-m: 0.0px 2.0px 10.0px 0px rgba(0, 0, 0, 0.15), 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.15); + --sds-drop-shadow-s: 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.25); + --sds-drop-shadow-none: none; + --sds-font-color: black; + --sds-font-font-family-body: "Inter", sans-serif; + --sds-font-font-family-caps: "Inter", sans-serif; + --sds-font-font-family-code: "IBM Plex Mono", monospace; + --sds-font-font-family-header: "Inter", sans-serif; + --sds-font-font-family-tabular: "Inter", sans-serif; + --sds-font-body-xxxs-400-font: 400 11px/16px "Inter", sans-serif; + --sds-font-body-xxxs-400-letter-spacing: 0.1px; + --sds-font-body-xxxs-600-font: 600 11px/16px "Inter", sans-serif; + --sds-font-body-xxxs-600-letter-spacing: 0.1px; + --sds-font-body-xxs-400-font: 400 12px/18px "Inter", sans-serif; + --sds-font-body-xxs-400-letter-spacing: 0.1px; + --sds-font-body-xxs-600-font: 600 12px/18px "Inter", sans-serif; + --sds-font-body-xxs-600-letter-spacing: 0.1px; + --sds-font-body-xs-400-font: 400 13px/20px "Inter", sans-serif; + --sds-font-body-xs-400-letter-spacing: 0.08px; + --sds-font-body-xs-600-font: 600 13px/20px "Inter", sans-serif; + --sds-font-body-xs-600-letter-spacing: 0.08px; + --sds-font-body-s-400-font: 400 14px/24px "Inter", sans-serif; + --sds-font-body-s-400-letter-spacing: 0.08px; + --sds-font-body-s-600-font: 600 14px/24px "Inter", sans-serif; + --sds-font-body-s-600-letter-spacing: 0.08px; + --sds-font-body-m-400-font: 400 16px/26px "Inter", sans-serif; + --sds-font-body-m-400-letter-spacing: 0px; + --sds-font-body-m-600-font: 600 16px/26px "Inter", sans-serif; + --sds-font-body-m-600-letter-spacing: 0px; + --sds-font-body-l-400-font: 400 18px/28px "Inter", sans-serif; + --sds-font-body-l-400-letter-spacing: 0px; + --sds-font-body-l-600-font: 600 18px/28px "Inter", sans-serif; + --sds-font-body-l-600-letter-spacing: 0px; + --sds-font-caps-xxxxs-600-font: 600 10px/14px "Inter", sans-serif; + --sds-font-caps-xxxxs-600-letter-spacing: 0.5px; + --sds-font-caps-xxxxs-600-text-transform: uppercase; + --sds-font-caps-xxxs-600-font: 600 11px/16px "Inter", sans-serif; + --sds-font-caps-xxxs-600-letter-spacing: 0.5px; + --sds-font-caps-xxxs-600-text-transform: uppercase; + --sds-font-caps-xxs-600-font: 600 12px/18px "Inter", sans-serif; + --sds-font-caps-xxs-600-letter-spacing: 0.5px; + --sds-font-caps-xxs-600-text-transform: uppercase; + --sds-font-header-xxxs-600-font: 600 11px/16px "Inter", sans-serif; + --sds-font-header-xxxs-600-letter-spacing: 0.1px; + --sds-font-header-xxs-600-font: 600 12px/18px "Inter", sans-serif; + --sds-font-header-xxs-600-letter-spacing: 0.1px; + --sds-font-header-xs-600-font: 600 13px/18px "Inter", sans-serif; + --sds-font-header-xs-600-letter-spacing: 0.08px; + --sds-font-header-s-600-font: 600 14px/20px "Inter", sans-serif; + --sds-font-header-s-600-letter-spacing: 0.08px; + --sds-font-header-m-600-font: 600 16px/22px "Inter", sans-serif; + --sds-font-header-m-600-letter-spacing: 0px; + --sds-font-header-l-600-font: 600 18px/24px "Inter", sans-serif; + --sds-font-header-l-600-letter-spacing: 0px; + --sds-font-header-xl-600-font: 600 22px/30px "Inter", sans-serif; + --sds-font-header-xl-600-letter-spacing: 0px; + --sds-font-header-xxl-600-font: 600 26px/34px "Inter", sans-serif; + --sds-font-header-xxl-600-letter-spacing: 0px; + --sds-font-tabular-xs-400-font: 400 13px/20px "Inter", sans-serif; + --sds-font-tabular-xs-400-font-variant-numeric: tabular-nums; + --sds-font-tabular-xs-400-letter-spacing: 0px; + --sds-font-tabular-xs-600-font: 600 13px/20px "Inter", sans-serif; + --sds-font-tabular-xs-600-font-variant-numeric: tabular-nums; + --sds-font-tabular-xs-600-letter-spacing: 0px; + --sds-font-tabular-s-400-font: 400 14px/24px "Inter", sans-serif; + --sds-font-tabular-s-400-font-variant-numeric: tabular-nums; + --sds-font-tabular-s-400-letter-spacing: 0px; + --sds-font-tabular-s-600-font: 600 14px/24px "Inter", sans-serif; + --sds-font-tabular-s-600-font-variant-numeric: tabular-nums; + --sds-font-tabular-s-600-letter-spacing: 0px; + --sds-font-code-xs-400-font: 400 13px/20px "IBM Plex Mono", monospace; + --sds-font-code-xs-400-letter-spacing: 0px; + --sds-font-code-xs-600-font: 600 13px/20px "IBM Plex Mono", monospace; + --sds-font-code-xs-600-letter-spacing: 0px; + --sds-font-code-s-400-font: 400 14px/24px "IBM Plex Mono", monospace; + --sds-font-code-s-400-letter-spacing: 0px; + --sds-font-code-s-600-font: 600 14px/24px "IBM Plex Mono", monospace; + --sds-font-code-s-600-letter-spacing: 0px; + --sds-icon-size-input-height: 16px; + --sds-icon-size-input-width: 16px; + --sds-icon-size-xs-height: 12px; + --sds-icon-size-xs-width: 12px; + --sds-icon-size-s-height: 16px; + --sds-icon-size-s-width: 16px; + --sds-icon-size-l-height: 24px; + --sds-icon-size-l-width: 24px; + --sds-icon-size-xl-height: 32px; + --sds-icon-size-xl-width: 32px; + --sds-space-default: 12px; + --sds-space-xxxs: 2px; + --sds-space-xxs: 4px; + --sds-space-xs: 6px; + --sds-space-s: 8px; + --sds-space-m: 12px; + --sds-space-l: 16px; + --sds-space-xl: 24px; + --sds-space-xxl: 40px; +} diff --git a/packages/components/src/common/styles-dictionary/scss/_variables.scss b/packages/components/src/common/styles-dictionary/scss/_variables.scss new file mode 100644 index 000000000..fa833dd73 --- /dev/null +++ b/packages/components/src/common/styles-dictionary/scss/_variables.scss @@ -0,0 +1,247 @@ +$sds-border-negative-default: 1px solid #DC132C; +$sds-border-base-divider: 1px solid #EAEAEA; +$sds-border-base-table: 1px solid #CCCCCC; +$sds-border-base-disabled: 1px solid #CCCCCC; +$sds-border-base-default: 1px solid #999999; +$sds-border-base-black: 1px dashed #000000; +$sds-border-base-hover: 1px dashed #000000; +$sds-border-base-dashed: 1px dashed #999999; +$sds-border-link-dashed: 1px dashed; +$sds-border-link-solid: 1px solid; +$sds-border-accent-disabled: 1px solid #A6C9FF; +$sds-border-accent-default: 1px solid #0B68F8; +$sds-border-accent-hover: 1px solid #0142A4; +$sds-border-accent-dashed: 2px dashed #0B68F8; +$sds-border-info-default: 1px solid #0B68F8; +$sds-border-beta-default: 1px solid #7A41CE; +$sds-border-positive-default: 1px solid #3CB371; +$sds-border-notice-default: 1px solid #F5A623; +$sds-border-neutral-default: 1px solid #999999; +$sds-border-none: none; +$sds-color-primitive-common-black: #000000; +$sds-color-primitive-common-white: #FFFFFF; +$sds-color-primitive-blue-100: #F5F9FF; +$sds-color-primitive-blue-200: #E9F1FF; +$sds-color-primitive-blue-300: #A6C9FF; +$sds-color-primitive-blue-400: #0B68F8; +$sds-color-primitive-blue-500: #0142A4; +$sds-color-primitive-blue-600: #002660; +$sds-color-primitive-gray-100: #F8F8F8; +$sds-color-primitive-gray-200: #EAEAEA; +$sds-color-primitive-gray-300: #CCCCCC; +$sds-color-primitive-gray-400: #999999; +$sds-color-primitive-gray-500: #767676; +$sds-color-primitive-gray-600: #545454; +$sds-color-primitive-green-100: #ECF5F0; +$sds-color-primitive-green-200: #E6F7ED; +$sds-color-primitive-green-400: #3CB371; +$sds-color-primitive-green-500: #349A61; +$sds-color-primitive-green-600: #1C7F48; +$sds-color-primitive-purple-100: #F4F0F9; +$sds-color-primitive-purple-200: #F0EBF6; +$sds-color-primitive-purple-400: #7A41CE; +$sds-color-primitive-purple-500: #703CBE; +$sds-color-primitive-purple-600: #693BAC; +$sds-color-primitive-red-100: #FEF2F2; +$sds-color-primitive-red-200: #F8E8E8; +$sds-color-primitive-red-400: #DC132C; +$sds-color-primitive-red-500: #C61128; +$sds-color-primitive-red-600: #B70016; +$sds-color-primitive-yellow-100: #FCF6EC; +$sds-color-primitive-yellow-200: #FFF3E1; +$sds-color-primitive-yellow-400: #F5A623; +$sds-color-primitive-yellow-500: #D8921F; +$sds-color-primitive-yellow-600: #946314; +$sds-color-primitive-overlay-100: rgba(0, 0, 0, 0.08); +$sds-color-primitive-overlay-200: rgba(0, 0, 0, 0.03); +$sds-color-semantic-text-base-primary: #000000; +$sds-color-semantic-text-base-secondary: #767676; +$sds-color-semantic-text-base-disabled: #CCCCCC; +$sds-color-semantic-text-base-on-fill: #FFFFFF; +$sds-color-semantic-text-base-on-fill-disabled: #999999; +$sds-color-semantic-text-base-accent: #002660; +$sds-color-semantic-text-action-default: #0B68F8; +$sds-color-semantic-text-action-hover: #0142A4; +$sds-color-semantic-text-action-pressed: #002660; +$sds-color-semantic-text-beta: #693BAC; +$sds-color-semantic-text-info: #002660; +$sds-color-semantic-text-negative: #B70016; +$sds-color-semantic-text-neutral: #545454; +$sds-color-semantic-text-notice: #946314; +$sds-color-semantic-text-positive: #1C7F48; +$sds-color-semantic-component-base-fill: #FFFFFF; +$sds-color-semantic-component-base-fill-hover: #F8F8F8; +$sds-color-semantic-component-base-fill-pressed: #F8F8F8; +$sds-color-semantic-component-base-fill-open: #F8F8F8; +$sds-color-semantic-component-base-fill-selected: #000000; +$sds-color-semantic-component-base-fill-disabled: #CCCCCC; +$sds-color-semantic-component-base-on-fill-disabled: #999999; +$sds-color-semantic-component-base-surface: #FFFFFF; +$sds-color-semantic-component-base-surface-primary: #FFFFFF; +$sds-color-semantic-component-base-surface-secondary: #F8F8F8; +$sds-color-semantic-component-base-surface-tertiary: #EAEAEA; +$sds-color-semantic-component-base-divider: #EAEAEA; +$sds-color-semantic-component-base-border: #999999; +$sds-color-semantic-component-base-border-hover: #000000; +$sds-color-semantic-component-base-border-disabled: #CCCCCC; +$sds-color-semantic-component-base-icon: #767676; +$sds-color-semantic-component-base-icon-hover: #000000; +$sds-color-semantic-component-base-icon-pressed: #000000; +$sds-color-semantic-component-base-icon-disabled: #CCCCCC; +$sds-color-semantic-component-accent-fill: #0B68F8; +$sds-color-semantic-component-accent-fill-hover: #0142A4; +$sds-color-semantic-component-accent-fill-pressed: #002660; +$sds-color-semantic-component-accent-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-accent-fill-disabled: #A6C9FF; +$sds-color-semantic-component-accent-surface: #E9F1FF; +$sds-color-semantic-component-accent-border: #0B68F8; +$sds-color-semantic-component-accent-border-hover: #0142A4; +$sds-color-semantic-component-accent-border-open: #0B68F8; +$sds-color-semantic-component-accent-border-focus: #0B68F8; +$sds-color-semantic-component-accent-border-selected: #0B68F8; +$sds-color-semantic-component-accent-border-disabled: #A6C9FF; +$sds-color-semantic-component-accent-icon: #0B68F8; +$sds-color-semantic-component-beta-fill: #7A41CE; +$sds-color-semantic-component-beta-fill-hover: #703CBE; +$sds-color-semantic-component-beta-fill-pressed: #693BAC; +$sds-color-semantic-component-beta-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-beta-surface: #F0EBF6; +$sds-color-semantic-component-beta-border: #7A41CE; +$sds-color-semantic-component-beta-icon: #7A41CE; +$sds-color-semantic-component-info-fill: #0B68F8; +$sds-color-semantic-component-info-fill-hover: #0142A4; +$sds-color-semantic-component-info-fill-pressed: #002660; +$sds-color-semantic-component-info-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-info-surface: #E9F1FF; +$sds-color-semantic-component-info-border: #0B68F8; +$sds-color-semantic-component-info-icon: #0B68F8; +$sds-color-semantic-component-negative-fill: #DC132C; +$sds-color-semantic-component-negative-fill-hover: #C61128; +$sds-color-semantic-component-negative-fill-pressed: #B70016; +$sds-color-semantic-component-negative-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-negative-surface: #F8E8E8; +$sds-color-semantic-component-negative-border: #DC132C; +$sds-color-semantic-component-negative-icon: #DC132C; +$sds-color-semantic-component-neutral-fill: #999999; +$sds-color-semantic-component-neutral-fill-hover: #767676; +$sds-color-semantic-component-neutral-fill-pressed: #545454; +$sds-color-semantic-component-neutral-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-neutral-surface: #EAEAEA; +$sds-color-semantic-component-neutral-border: #999999; +$sds-color-semantic-component-neutral-icon: #999999; +$sds-color-semantic-component-notice-fill: #F5A623; +$sds-color-semantic-component-notice-fill-hover: #D8921F; +$sds-color-semantic-component-notice-fill-pressed: #946314; +$sds-color-semantic-component-notice-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-notice-surface: #FFF3E1; +$sds-color-semantic-component-notice-border: #F5A623; +$sds-color-semantic-component-notice-icon: #F5A623; +$sds-color-semantic-component-positive-fill: #3CB371; +$sds-color-semantic-component-positive-fill-hover: #349A61; +$sds-color-semantic-component-positive-fill-pressed: #1C7F48; +$sds-color-semantic-component-positive-fill-on-fill: #FFFFFF; +$sds-color-semantic-component-positive-surface: #E6F7ED; +$sds-color-semantic-component-positive-border: #3CB371; +$sds-color-semantic-component-positive-icon: #3CB371; +$sds-corner-l: 20px; +$sds-corner-m: 4px; +$sds-corner-s: 2px; +$sds-corner-none: 0px; +$sds-drop-shadow-l: 0.0px 2.0px 12.0px 0px rgba(0, 0, 0, 0.3); +$sds-drop-shadow-m: 0.0px 2.0px 10.0px 0px rgba(0, 0, 0, 0.15), 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.15); +$sds-drop-shadow-s: 0.0px 2.0px 4.0px 0px rgba(0, 0, 0, 0.25); +$sds-drop-shadow-none: none; +$sds-font-color: black; +$sds-font-font-family-body: "Inter", sans-serif; +$sds-font-font-family-caps: "Inter", sans-serif; +$sds-font-font-family-code: "IBM Plex Mono", monospace; +$sds-font-font-family-header: "Inter", sans-serif; +$sds-font-font-family-tabular: "Inter", sans-serif; +$sds-font-body-xxxs-400-font: 400 11px/16px "Inter", sans-serif; +$sds-font-body-xxxs-400-letter-spacing: 0.1px; +$sds-font-body-xxxs-600-font: 600 11px/16px "Inter", sans-serif; +$sds-font-body-xxxs-600-letter-spacing: 0.1px; +$sds-font-body-xxs-400-font: 400 12px/18px "Inter", sans-serif; +$sds-font-body-xxs-400-letter-spacing: 0.1px; +$sds-font-body-xxs-600-font: 600 12px/18px "Inter", sans-serif; +$sds-font-body-xxs-600-letter-spacing: 0.1px; +$sds-font-body-xs-400-font: 400 13px/20px "Inter", sans-serif; +$sds-font-body-xs-400-letter-spacing: 0.08px; +$sds-font-body-xs-600-font: 600 13px/20px "Inter", sans-serif; +$sds-font-body-xs-600-letter-spacing: 0.08px; +$sds-font-body-s-400-font: 400 14px/24px "Inter", sans-serif; +$sds-font-body-s-400-letter-spacing: 0.08px; +$sds-font-body-s-600-font: 600 14px/24px "Inter", sans-serif; +$sds-font-body-s-600-letter-spacing: 0.08px; +$sds-font-body-m-400-font: 400 16px/26px "Inter", sans-serif; +$sds-font-body-m-400-letter-spacing: 0px; +$sds-font-body-m-600-font: 600 16px/26px "Inter", sans-serif; +$sds-font-body-m-600-letter-spacing: 0px; +$sds-font-body-l-400-font: 400 18px/28px "Inter", sans-serif; +$sds-font-body-l-400-letter-spacing: 0px; +$sds-font-body-l-600-font: 600 18px/28px "Inter", sans-serif; +$sds-font-body-l-600-letter-spacing: 0px; +$sds-font-caps-xxxxs-600-font: 600 10px/14px "Inter", sans-serif; +$sds-font-caps-xxxxs-600-letter-spacing: 0.5px; +$sds-font-caps-xxxxs-600-text-transform: uppercase; +$sds-font-caps-xxxs-600-font: 600 11px/16px "Inter", sans-serif; +$sds-font-caps-xxxs-600-letter-spacing: 0.5px; +$sds-font-caps-xxxs-600-text-transform: uppercase; +$sds-font-caps-xxs-600-font: 600 12px/18px "Inter", sans-serif; +$sds-font-caps-xxs-600-letter-spacing: 0.5px; +$sds-font-caps-xxs-600-text-transform: uppercase; +$sds-font-header-xxxs-600-font: 600 11px/16px "Inter", sans-serif; +$sds-font-header-xxxs-600-letter-spacing: 0.1px; +$sds-font-header-xxs-600-font: 600 12px/18px "Inter", sans-serif; +$sds-font-header-xxs-600-letter-spacing: 0.1px; +$sds-font-header-xs-600-font: 600 13px/18px "Inter", sans-serif; +$sds-font-header-xs-600-letter-spacing: 0.08px; +$sds-font-header-s-600-font: 600 14px/20px "Inter", sans-serif; +$sds-font-header-s-600-letter-spacing: 0.08px; +$sds-font-header-m-600-font: 600 16px/22px "Inter", sans-serif; +$sds-font-header-m-600-letter-spacing: 0px; +$sds-font-header-l-600-font: 600 18px/24px "Inter", sans-serif; +$sds-font-header-l-600-letter-spacing: 0px; +$sds-font-header-xl-600-font: 600 22px/30px "Inter", sans-serif; +$sds-font-header-xl-600-letter-spacing: 0px; +$sds-font-header-xxl-600-font: 600 26px/34px "Inter", sans-serif; +$sds-font-header-xxl-600-letter-spacing: 0px; +$sds-font-tabular-xs-400-font: 400 13px/20px "Inter", sans-serif; +$sds-font-tabular-xs-400-font-variant-numeric: tabular-nums; +$sds-font-tabular-xs-400-letter-spacing: 0px; +$sds-font-tabular-xs-600-font: 600 13px/20px "Inter", sans-serif; +$sds-font-tabular-xs-600-font-variant-numeric: tabular-nums; +$sds-font-tabular-xs-600-letter-spacing: 0px; +$sds-font-tabular-s-400-font: 400 14px/24px "Inter", sans-serif; +$sds-font-tabular-s-400-font-variant-numeric: tabular-nums; +$sds-font-tabular-s-400-letter-spacing: 0px; +$sds-font-tabular-s-600-font: 600 14px/24px "Inter", sans-serif; +$sds-font-tabular-s-600-font-variant-numeric: tabular-nums; +$sds-font-tabular-s-600-letter-spacing: 0px; +$sds-font-code-xs-400-font: 400 13px/20px "IBM Plex Mono", monospace; +$sds-font-code-xs-400-letter-spacing: 0px; +$sds-font-code-xs-600-font: 600 13px/20px "IBM Plex Mono", monospace; +$sds-font-code-xs-600-letter-spacing: 0px; +$sds-font-code-s-400-font: 400 14px/24px "IBM Plex Mono", monospace; +$sds-font-code-s-400-letter-spacing: 0px; +$sds-font-code-s-600-font: 600 14px/24px "IBM Plex Mono", monospace; +$sds-font-code-s-600-letter-spacing: 0px; +$sds-icon-size-input-height: 16px; +$sds-icon-size-input-width: 16px; +$sds-icon-size-xs-height: 12px; +$sds-icon-size-xs-width: 12px; +$sds-icon-size-s-height: 16px; +$sds-icon-size-s-width: 16px; +$sds-icon-size-l-height: 24px; +$sds-icon-size-l-width: 24px; +$sds-icon-size-xl-height: 32px; +$sds-icon-size-xl-width: 32px; +$sds-space-default: 12px; +$sds-space-xxxs: 2px; +$sds-space-xxs: 4px; +$sds-space-xs: 6px; +$sds-space-s: 8px; +$sds-space-m: 12px; +$sds-space-l: 16px; +$sds-space-xl: 24px; +$sds-space-xxl: 40px; From 8ad7f37d373aae19c9ef02559bc511b09c335459 Mon Sep 17 00:00:00 2001 From: masoudmanson Date: Fri, 3 May 2024 02:44:51 +0000 Subject: [PATCH 6/7] chore(release): publish - @czi-sds/components@20.1.2 --- packages/components/CHANGELOG.md | 7 +++++++ packages/components/package.json | 2 +- 2 files changed, 8 insertions(+), 1 deletion(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index e88bc3ecf..39c36a688 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -3,6 +3,13 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +## [20.1.2](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.1.0...@czi-sds/components@20.1.2) (2024-05-03) + +### Bug Fixes + +- **autocomplete:** fix controlled open state ([#767](https://github.com/chanzuckerberg/sci-components/issues/767)) ([6a77a3d](https://github.com/chanzuckerberg/sci-components/commit/6a77a3d49f2313ed569d1916ad58b1abfa68b935)) +- **sdstheme:** fix SDS Theme backward compatibility ([#770](https://github.com/chanzuckerberg/sci-components/issues/770)) ([860283f](https://github.com/chanzuckerberg/sci-components/commit/860283fefda3664b34685c5d0e52e9c87d3f069d)) + ## [20.1.1](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.1.0...@czi-sds/components@20.1.1) (2024-05-02) ### Bug Fixes diff --git a/packages/components/package.json b/packages/components/package.json index 8b121fd01..07d688c99 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@czi-sds/components", - "version": "20.1.1", + "version": "20.1.2", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "types": "dist/index.cjs.d.ts", From d780203eb3e4ac888966ad503c92d421bfad7fc5 Mon Sep 17 00:00:00 2001 From: masoudmanson Date: Fri, 10 May 2024 17:36:58 +0000 Subject: [PATCH 7/7] chore(release): publish - @czi-sds/components@20.3.0 --- packages/components/CHANGELOG.md | 10 ++++++++++ packages/components/package.json | 2 +- 2 files changed, 11 insertions(+), 1 deletion(-) diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md index 899965781..a6c05bcae 100644 --- a/packages/components/CHANGELOG.md +++ b/packages/components/CHANGELOG.md @@ -3,6 +3,16 @@ All notable changes to this project will be documented in this file. See [Conventional Commits](https://conventionalcommits.org) for commit guidelines. +# [20.3.0](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.1.2...@czi-sds/components@20.3.0) (2024-05-10) + +### Bug Fixes + +- **dropdown:** fix props propagating ([#774](https://github.com/chanzuckerberg/sci-components/issues/774)) ([c42970a](https://github.com/chanzuckerberg/sci-components/commit/c42970a2270c5c6c1dda40422cb7eeee9b4b2f5e)) + +### Features + +- **complexfilter:** add shouldisTriggerChangeOnOptionClick to complexFilter and ([#772](https://github.com/chanzuckerberg/sci-components/issues/772)) ([038ad54](https://github.com/chanzuckerberg/sci-components/commit/038ad542a91b05b06af5b77dff0a644a509f0cc0)) + # [20.2.0](https://github.com/chanzuckerberg/sci-components/compare/@czi-sds/components@20.1.2...@czi-sds/components@20.2.0) (2024-05-09) ### Features diff --git a/packages/components/package.json b/packages/components/package.json index 2e6d6d118..e39c93d4c 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@czi-sds/components", - "version": "20.2.0", + "version": "20.3.0", "main": "dist/index.cjs.js", "module": "dist/index.esm.js", "types": "dist/index.cjs.d.ts",