@apify/ui-library 0.71.1-featcolortokens-178953.58 → 0.71.1-featcolortokens-178953.67

package/src/design_system/colors/generated/colors_theme.dark.ts

@@ -0,0 +1,110 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+export const darkTheme = {
+    roseLight: '#e88bb3',
+    roseBase: '#b8487b',
+    roseDark: '#6f234f',
+    roseText: '#ed8bb5',
+    buttercupLight: '#f9deaa',
+    buttercupBase: '#e5b557',
+    buttercupDark: '#b87939',
+    buttercupText: '#ebbf6c',
+    paprikaLight: '#e26c7d',
+    paprikaBase: '#9e384b',
+    paprikaDark: '#511d27',
+    paprikaText: '#f67c8d',
+    tealLight: '#aef0f5',
+    tealBase: '#58bcc4',
+    tealDark: '#408288',
+    tealText: '#62c1c8',
+    indigoLight: '#a8b7ed',
+    indigoBase: '#6d85ca',
+    indigoDark: '#425484',
+    indigoText: '#a2b2eb',
+    slateLight: '#c2c5dc',
+    slateBase: '#8690bf',
+    slateDark: '#535c81',
+    slateText: '#afb2c9',
+    coralLight: '#f3ccb0',
+    coralBase: '#f08848',
+    coralDark: '#9a4e2d',
+    coralText: '#f9b27b',
+    lavenderLight: '#b482ed',
+    lavenderBase: '#8148c9',
+    lavenderDark: '#48296f',
+    lavenderText: '#be8af9',
+    bambooLight: '#7acaa9',
+    bambooBase: '#439274',
+    bambooDark: '#305b4a',
+    bambooText: '#65bc99',
+    neutral0: '#ffffff',
+    neutral25: '#f8f9fc',
+    neutral50: '#f3f4fa',
+    neutral75: '#eef0f8',
+    neutral100: '#e1e3ed',
+    neutral150: '#d1d5e4',
+    neutral200: '#c1c6d9',
+    neutral250: '#b2b8cc',
+    neutral300: '#a5abc0',
+    neutral350: '#989eb3',
+    neutral400: '#8c93a8',
+    neutral450: '#7d8499',
+    neutral500: '#6e758a',
+    neutral550: '#646a7f',
+    neutral600: '#575d71',
+    neutral650: '#4d5265',
+    neutral700: '#414758',
+    neutral750: '#343847',
+    neutral775: '#2d313e',
+    neutral800: '#2a2d39',
+    neutral850: '#252832',
+    neutral875: '#1e2027',
+    neutral900: '#1a1b21',
+    neutral950: '#101114',
+    yellow25: '#fcdc73',
+    yellow50: '#ffd761',
+    yellow75: '#f9ce4b',
+    yellow100: '#f5bc38',
+    yellow200: '#cf9117',
+    yellow300: '#a56909',
+    yellow350: '#8a4f05',
+    yellow400: '#6d3806',
+    yellow500: '#5d2e0e',
+    yellow600: '#3f1b07',
+    yellow700: '#301806',
+    red25: '#f5a790',
+    red50: '#fe9e8a',
+    red75: '#ff8770',
+    red100: '#ff7157',
+    red200: '#ef6045',
+    red300: '#cf4436',
+    red350: '#aa3229',
+    red400: '#812420',
+    red500: '#672523',
+    red600: '#40191b',
+    red700: '#381719',
+    green25: '#74d584',
+    green50: '#6ccd7c',
+    green75: '#55c06a',
+    green100: '#3bb358',
+    green200: '#23a64a',
+    green300: '#068a35',
+    green350: '#006e29',
+    green400: '#00531e',
+    green500: '#14441f',
+    green600: '#0f2b14',
+    green700: '#09260f',
+    blue25: '#92c0ff',
+    blue50: '#8ebcff',
+    blue75: '#80a9ff',
+    blue100: '#6f9dff',
+    blue200: '#5990ff',
+    blue300: '#3970d7',
+    blue350: '#295cbb',
+    blue400: '#194594',
+    blue500: '#1a3a78',
+    blue600: '#0d2550',
+    blue700: '#151d34',
+} as const;

package/src/design_system/colors/generated/colors_theme.light.ts

@@ -0,0 +1,110 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
+export const lightTheme = {
+    roseLight: '#f483b5',
+    roseBase: '#c6387d',
+    roseDark: '#781552',
+    roseText: '#b6006b',
+    buttercupLight: '#ffdd96',
+    buttercupBase: '#f0b21b',
+    buttercupDark: '#c37319',
+    buttercupText: '#a65d00',
+    paprikaLight: '#e44467',
+    paprikaBase: '#9b0238',
+    paprikaDark: '#4a0018',
+    paprikaText: '#ba0044',
+    tealLight: '#a7f2ed',
+    tealBase: '#30c0bb',
+    tealDark: '#297774',
+    tealText: '#018181',
+    indigoLight: '#a1b7ff',
+    indigoBase: '#5d85e1',
+    indigoDark: '#365494',
+    indigoText: '#2563c1',
+    slateLight: '#c1c5e1',
+    slateBase: '#8490c4',
+    slateDark: '#525c85',
+    slateText: '#566087',
+    coralLight: '#ffc89f',
+    coralBase: '#fa8136',
+    coralDark: '#bb4511',
+    coralText: '#c74000',
+    lavenderLight: '#bf97ed',
+    lavenderBase: '#6a14de',
+    lavenderDark: '#330276',
+    lavenderText: '#6e00f4',
+    bambooLight: '#64cda5',
+    bambooBase: '#12966f',
+    bambooDark: '#195d46',
+    bambooText: '#007455',
+    neutral0: '#ffffff',
+    neutral25: '#f8f9fc',
+    neutral50: '#f3f4fa',
+    neutral75: '#eef0f8',
+    neutral100: '#e0e3f2',
+    neutral150: '#d0d5e9',
+    neutral200: '#c0c6de',
+    neutral250: '#b0b8d1',
+    neutral300: '#a3abc5',
+    neutral350: '#969eb8',
+    neutral400: '#8a93ae',
+    neutral450: '#7b84a0',
+    neutral500: '#6c7590',
+    neutral550: '#626a85',
+    neutral600: '#555d76',
+    neutral650: '#4b526b',
+    neutral700: '#3f475d',
+    neutral750: '#31384d',
+    neutral775: '#2b3143',
+    neutral800: '#272d3e',
+    neutral850: '#242836',
+    neutral875: '#1d202a',
+    neutral900: '#191b22',
+    neutral950: '#0a0b0f',
+    yellow25: '#f9f6ea',
+    yellow50: '#f9f0db',
+    yellow75: '#f7e8c4',
+    yellow100: '#f7dfb1',
+    yellow200: '#f5b315',
+    yellow300: '#e39c04',
+    yellow350: '#d58e00',
+    yellow400: '#ca8200',
+    yellow500: '#a96600',
+    yellow600: '#8c4e02',
+    yellow700: '#864906',
+    red25: '#fcf2ef',
+    red50: '#fff0ec',
+    red75: '#ffe3dc',
+    red100: '#fedad1',
+    red200: '#ffb39f',
+    red300: '#ff886e',
+    red350: '#fc7156',
+    red400: '#fa4d37',
+    red500: '#e3231d',
+    red600: '#bb0401',
+    red700: '#af0600',
+    green25: '#e8f9ef',
+    green50: '#e4f5e5',
+    green75: '#daefdc',
+    green100: '#cfe9d1',
+    green200: '#80da8d',
+    green300: '#46c263',
+    green350: '#22b551',
+    green400: '#00ab46',
+    green500: '#008a27',
+    green600: '#086e08',
+    green700: '#176b08',
+    blue25: '#f0f8ff',
+    blue50: '#ecf1ff',
+    blue75: '#e1eaff',
+    blue100: '#d8e2ff',
+    blue200: '#b2c6ff',
+    blue300: '#88abfe',
+    blue350: '#709efd',
+    blue400: '#5290f9',
+    blue500: '#1672eb',
+    blue600: '#1a57da',
+    blue700: '#224ed5',
+} as const;

package/{dist/src/design_system/colors/generated/dark.js → src/design_system/colors/generated/css_variables.dark.ts}

@@ -1,6 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
+
 export const tokens = `
   --color-neutral-text: #f3f4fa;
   --color-neutral-text-muted: #b2b8cc;
@@ -144,4 +145,3 @@ export const tokens = `
   --color-bamboo-dark: #305b4a;
   --color-bamboo-text: #65bc99;
 `;
-//# sourceMappingURL=dark.js.map

package/{dist/src/design_system/colors/generated/light.js → src/design_system/colors/generated/css_variables.light.ts}

@@ -1,6 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
+
 export const tokens = `
   --color-neutral-text: #242836;
   --color-neutral-text-muted: #3f475d;
@@ -144,4 +145,3 @@ export const tokens = `
   --color-bamboo-dark: #195d46;
   --color-bamboo-text: #007455;
 `;
-//# sourceMappingURL=light.js.map

package/{dist/src/design_system/colors/generated/palette.dark.js → src/design_system/colors/generated/css_variables_palette.dark.ts}

@@ -1,6 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
+
 export const tokens = `
   --palette-neutral-0: #ffffff;
   --palette-neutral-25: #f8f9fc;
@@ -71,4 +72,3 @@ export const tokens = `
   --palette-blue-600: #0d2550;
   --palette-blue-700: #151d34;
 `;
-//# sourceMappingURL=palette.dark.js.map

package/{dist/src/design_system/colors/generated/palette.light.js → src/design_system/colors/generated/css_variables_palette.light.ts}

@@ -1,6 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
+
 export const tokens = `
   --palette-neutral-0: #ffffff;
   --palette-neutral-25: #f8f9fc;
@@ -71,4 +72,3 @@ export const tokens = `
   --palette-blue-600: #1a57da;
   --palette-blue-700: #224ed5;
 `;
-//# sourceMappingURL=palette.light.js.map

package/{dist/src/design_system/properties_theme.js → src/design_system/colors/generated/properties_theme.ts}

@@ -1,315 +1,179 @@
+/**
+ * Do not edit directly, this file was auto-generated.
+ */
+
 export const colorProperties = {
     neutral: {
-        /* #242836 */
         text: 'var(--color-neutral-text)',
-        /* #3f475d */
         textMuted: 'var(--color-neutral-text-muted)',
-        /* #6c7590 */
         textSubtle: 'var(--color-neutral-text-subtle)',
-        /* #c0c6de */
         textDisabled: 'var(--color-neutral-text-disabled)',
-        /* #ffffff */
         textOnPrimary: 'var(--color-neutral-text-on-primary)',
-        /* #ffffff */
         iconOnPrimary: 'var(--color-neutral-icon-on-primary)',
-        /* #ffffff */
         background: 'var(--color-neutral-background)',
-        /* #f8f9fc */
         backgroundMuted: 'var(--color-neutral-background-muted)',
-        /* #f3f4fa */
         backgroundSubtle: 'var(--color-neutral-background-subtle)',
-        /* #ffffff */
         backgroundWhite: 'var(--color-neutral-background-white)',
-        /* #ffffff */
         cardBackground: 'var(--color-neutral-card-background)',
-        /* #ffffff */
         cardBackgroundHover: 'var(--color-neutral-card-background-hover)',
-        /* #d0d5e9 */
         border: 'var(--color-neutral-border)',
-        /* #e0e3f2 */
         separatorSubtle: 'var(--color-neutral-separator-subtle)',
-        /* #eef0f8 */
         hover: 'var(--color-neutral-hover)',
-        /* #f3f4fa */
         disabled: 'var(--color-neutral-disabled)',
-        /* #e0e3f2 */
         overflow: 'var(--color-neutral-overflow)',
-        /* #555d76 */
         icon: 'var(--color-neutral-icon)',
-        /* #8a93ae */
         iconSubtle: 'var(--color-neutral-icon-subtle)',
-        /* #b0b8d1 */
         iconDisabled: 'var(--color-neutral-icon-disabled)',
-        /* #c0c6de */
         fieldBorder: 'var(--color-neutral-field-border)',
-        /* #d0d5e9 */
         actionSecondary: 'var(--color-neutral-action-secondary)',
-        /* #e0e3f2 */
         actionSecondaryHover: 'var(--color-neutral-action-secondary-hover)',
-        /* #c0c6de */
         actionSecondaryActive: 'var(--color-neutral-action-secondary-active)',
-        /* #e0e3f2 */
         chipBackground: 'var(--color-neutral-chip-background)',
-        /* #d0d5e9 */
         chipBackgroundHover: 'var(--color-neutral-chip-background-hover)',
-        /* #c0c6de */
         chipBackgroundActive: 'var(--color-neutral-chip-background-active)',
-        /* #d0d5e9 */
         chipBackgroundDisabled: 'var(--color-neutral-chip-background-disabled)',
-        /* #ffffff */
         largeTooltipBackground: 'var(--color-neutral-large-tooltip-background)',
-        /* #e0e3f2 */
         largeTooltipBorder: 'var(--color-neutral-large-tooltip-border)',
-        /* #ffffff */
         smallTooltipText: 'var(--color-neutral-small-tooltip-text)',
-        /* #191b22 */
         smallTooltipBackground: 'var(--color-neutral-small-tooltip-background)',
-        /* #242836 */
         smallTooltipBorder: 'var(--color-neutral-small-tooltip-border)',
-        /* #191b22cc */
         overlay: 'var(--color-neutral-overlay)',
-        /* #f8f9fc */
         fieldBackground: 'var(--color-neutral-field-background)',
-        /* #969eb8 */
         textPlaceholder: 'var(--color-neutral-text-placeholder)',
     },
     primary: {
-        /* #1672eb */
         text: 'var(--color-primary-text)',
-        /* #1672eb */
         textInteractive: 'var(--color-primary-text-interactive)',
-        /* #1672eb */
         icon: 'var(--color-primary-icon)',
-        /* #1672eb */
         action: 'var(--color-primary-action)',
-        /* #5290f9 */
         actionHover: 'var(--color-primary-action-hover)',
-        /* #1a57da */
         actionActive: 'var(--color-primary-action-active)',
-        /* #1672eb */
         fieldBorderActive: 'var(--color-primary-field-border-active)',
-        /* #ecf1ff */
+        borderSubtle: 'var(--color-primary-border-subtle)',
         background: 'var(--color-primary-background)',
-        /* #d8e2ff */
-        backgroundHover: 'var(--color-primary-background-hover)',
-        /* #f0f8ff */
         backgroundSubtle: 'var(--color-primary-background-subtle)',
-        /* #ecf1ff */
+        backgroundHover: 'var(--color-primary-background-hover)',
         chipBackground: 'var(--color-primary-chip-background)',
-        /* #f0f8ff */
         chipBackgroundSubtle: 'var(--color-primary-chip-background-subtle)',
-        /* #d8e2ff */
         chipBackgroundHover: 'var(--color-primary-chip-background-hover)',
-        /* #1a57da */
         chipText: 'var(--color-primary-chip-text)',
-        /* #b2c6ff */
         shadowActive: 'var(--color-primary-shadow-active)',
-        /* #b2c6ff */
-        borderSubtle: 'var(--color-primary-border-subtle)',
     },
     primaryBlack: {
-        /* #272d3e */
         action: 'var(--color-primary-black-action)',
-        /* #2b3143 */
         actionHover: 'var(--color-primary-black-action-hover)',
-        /* #0a0b0f */
         actionActive: 'var(--color-primary-black-action-active)',
-        /* #1d202a */
         background: 'var(--color-primary-black-background)',
-        /* #3f475d */
         backgroundHover: 'var(--color-primary-black-background-hover)',
-        /* #ffffff */
         chipText: 'var(--color-primary-black-chip-text)',
     },
     success: {
-        /* #008a27 */
         text: 'var(--color-success-text)',
-        /* #008a27 */
         icon: 'var(--color-success-icon)',
-        /* #e4f5e5 */
         background: 'var(--color-success-background)',
-        /* #cfe9d1 */
         backgroundHover: 'var(--color-success-background-hover)',
-        /* #e8f9ef */
         backgroundSubtle: 'var(--color-success-background-subtle)',
-        /* #cfe9d1 */
         backgroundSubtleHover: 'var(--color-success-background-subtle-hover)',
-        /* #80da8d */
         backgroundSubtleActive: 'var(--color-success-background-subtle-active)',
-        /* #00ab46 */
-        border: 'var(--color-success-border)',
-        /* #008a27 */
-        action: 'var(--color-success-action)',
-        /* #00ab46 */
-        actionHover: 'var(--color-success-action-hover)',
-        /* #086e08 */
-        actionActive: 'var(--color-success-action-active)',
-        /* #daefdc */
         chipBackground: 'var(--color-success-chip-background)',
-        /* #cfe9d1 */
         chipBackgroundHover: 'var(--color-success-chip-background-hover)',
-        /* #086e08 */
         chipText: 'var(--color-success-chip-text)',
-        /* #80da8d */
+        border: 'var(--color-success-border)',
         borderSubtle: 'var(--color-success-border-subtle)',
+        action: 'var(--color-success-action)',
+        actionHover: 'var(--color-success-action-hover)',
+        actionActive: 'var(--color-success-action-active)',
     },
     warning: {
-        /* #a96600 */
         text: 'var(--color-warning-text)',
-        /* #f5b315 */
         icon: 'var(--color-warning-icon)',
-        /* #f9f0db */
         background: 'var(--color-warning-background)',
-        /* #f7dfb1 */
         backgroundHover: 'var(--color-warning-background-hover)',
-        /* #f9f6ea */
         backgroundSubtle: 'var(--color-warning-background-subtle)',
-        /* #f5b315 */
-        fieldborder: 'var(--color-warning-field-border)',
-        /* #f7e8c4 */
         chipBackground: 'var(--color-warning-chip-background)',
-        /* #f7dfb1 */
         chipBackgroundHover: 'var(--color-warning-chip-background-hover)',
-        /* #8c4e02 */
         chipText: 'var(--color-warning-chip-text)',
-        /* #f5b315 */
+        border: 'var(--color-warning-border)',
         borderSubtle: 'var(--color-warning-border-subtle)',
+        fieldBorder: 'var(--color-warning-field-border)',
     },
     danger: {
-        /* #e3231d */
         text: 'var(--color-danger-text)',
-        /* #e3231d */
         icon: 'var(--color-danger-icon)',
-        /* #fff0ec */
         background: 'var(--color-danger-background)',
-        /* #fedad1 */
         backgroundHover: 'var(--color-danger-background-hover)',
-        /* #fcf2ef */
         backgroundSubtle: 'var(--color-danger-background-subtle)',
-        /* #fedad1 */
         backgroundSubtleHover: 'var(--color-danger-background-subtle-hover)',
-        /* #ffb39f */
         backgroundSubtleActive: 'var(--color-danger-background-subtle-active)',
-        /* #fa4d37 */
+        chipBackground: 'var(--color-danger-chip-background)',
+        chipBackgroundHover: 'var(--color-danger-chip-background-hover)',
+        chipText: 'var(--color-danger-chip-text)',
         border: 'var(--color-danger-border)',
-        /* #fa4d37 */
+        borderSubtle: 'var(--color-danger-border-subtle)',
         fieldBorder: 'var(--color-danger-field-border)',
-        /* #e3231d */
         action: 'var(--color-danger-action)',
-        /* #fa4d37 */
         actionHover: 'var(--color-danger-action-hover)',
-        /* #bb0401 */
         actionActive: 'var(--color-danger-action-active)',
-        /* #ffe3dc */
-        chipBackground: 'var(--color-danger-chip-background)',
-        /* #fedad1 */
-        chipBackgroundHover: 'var(--color-danger-chip-background-hover)',
-        /* #bb0401 */
-        chipText: 'var(--color-danger-chip-text)',
-        /* #ffb39f */
-        borderSubtle: 'var(--color-danger-border-subtle)',
     },
     special: {
-        /* #ffdd96 */
+        freePlanBackground: 'var(--color-special-free-plan-background)',
         starterPlanBackground: 'var(--color-special-starter-plan-background)',
-        /* #bf97ed */
-        enterprisePlanBackground: 'var(--color-special-enterprise-plan-background)',
-        /* #a7f2ed */
-        businessPlanBackground: 'var(--color-special-business-plan-background)',
-        /* #a1b7ff */
         scalePlanBackground: 'var(--color-special-scale-plan-background)',
-        /* #ffc89f */
-        freePlanBackground: 'var(--color-special-free-plan-background)',
+        businessPlanBackground: 'var(--color-special-business-plan-background)',
+        enterprisePlanBackground: 'var(--color-special-enterprise-plan-background)',
     },
     rose: {
-        /* #f483b5 */
         light: 'var(--color-rose-light)',
-        /* #c6387d */
         base: 'var(--color-rose-base)',
-        /* #781552 */
         dark: 'var(--color-rose-dark)',
-        /* #b6006b */
         text: 'var(--color-rose-text)',
     },
     buttercup: {
-        /* #ffdd96 */
         light: 'var(--color-buttercup-light)',
-        /* #f0b21b */
         base: 'var(--color-buttercup-base)',
-        /* #c37319 */
         dark: 'var(--color-buttercup-dark)',
-        /* #a65d00 */
         text: 'var(--color-buttercup-text)',
     },
     paprika: {
-        /* #e44467 */
         light: 'var(--color-paprika-light)',
-        /* #9b0238 */
         base: 'var(--color-paprika-base)',
-        /* #4a0018 */
         dark: 'var(--color-paprika-dark)',
-        /* #ba0044 */
         text: 'var(--color-paprika-text)',
     },
     teal: {
-        /* #a7f2ed */
         light: 'var(--color-teal-light)',
-        /* #30c0bb */
         base: 'var(--color-teal-base)',
-        /* #297774 */
         dark: 'var(--color-teal-dark)',
-        /* #018181 */
         text: 'var(--color-teal-text)',
     },
     indigo: {
-        /* #a1b7ff */
         light: 'var(--color-indigo-light)',
-        /* #5d85e1 */
         base: 'var(--color-indigo-base)',
-        /* #365494 */
         dark: 'var(--color-indigo-dark)',
-        /* #2563c1 */
         text: 'var(--color-indigo-text)',
     },
     slate: {
-        /* #c1c5e1 */
         light: 'var(--color-slate-light)',
-        /* #8490c4 */
         base: 'var(--color-slate-base)',
-        /* #525c85 */
         dark: 'var(--color-slate-dark)',
-        /* #566087 */
         text: 'var(--color-slate-text)',
     },
     coral: {
-        /* #ffc89f */
         light: 'var(--color-coral-light)',
-        /* #fa8136 */
         base: 'var(--color-coral-base)',
-        /* #bb4511 */
         dark: 'var(--color-coral-dark)',
-        /* #c74000 */
         text: 'var(--color-coral-text)',
     },
     lavender: {
-        /* #bf97ed */
         light: 'var(--color-lavender-light)',
-        /* #6a14de */
         base: 'var(--color-lavender-base)',
-        /* #330276 */
         dark: 'var(--color-lavender-dark)',
-        /* #6e00f4 */
         text: 'var(--color-lavender-text)',
     },
     bamboo: {
-        /* #64cda5 */
         light: 'var(--color-bamboo-light)',
-        /* #12966f */
         base: 'var(--color-bamboo-base)',
-        /* #195d46 */
         dark: 'var(--color-bamboo-dark)',
-        /* #007455 */
         text: 'var(--color-bamboo-text)',
     },
-};
-//# sourceMappingURL=properties_theme.js.map
+} as const;

package/src/design_system/colors/index.ts

@@ -0,0 +1,7 @@
+export { tokens as cssColorsVariablesLight } from './generated/css_variables.light.js';
+export { tokens as cssColorsVariablesDark } from './generated/css_variables.dark.js';
+export { tokens as cssColorsVariablesPaletteLight } from './generated/css_variables_palette.light.js';
+export { tokens as cssColorsVariablesPaletteDark } from './generated/css_variables_palette.dark.js';
+export { darkTheme } from './generated/colors_theme.dark.js';
+export { lightTheme } from './generated/colors_theme.light.js';
+export { colorProperties } from './generated/properties_theme.js';