@wordpress/components
Version:
UI components for WordPress.
8 lines (7 loc) • 4.61 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../src/utils/colors-values.js"],
"sourcesContent": ["/**\n * Internal dependencies\n */\nconst white = '#fff';\n\n// Matches the grays in @wordpress/base-styles\nconst GRAY = {\n 900: '#1e1e1e',\n 800: '#2f2f2f',\n /** Meets 4.6:1 text contrast against white. */\n 700: '#757575',\n /** Meets 3:1 UI or large text contrast against white. */\n 600: '#949494',\n 400: '#ccc',\n /** Used for most borders. */\n 300: '#ddd',\n /** Used sparingly for light borders. */\n 200: '#e0e0e0',\n /** Used for light gray backgrounds. */\n 100: '#f0f0f0'\n};\n\n// Matches @wordpress/base-styles\nconst ALERT = {\n yellow: '#f0b849',\n red: '#d94f4f',\n green: '#4ab866'\n};\n\n// Should match packages/components/src/utils/theme-variables.scss\nconst THEME = {\n accent: `var(--wp-components-color-accent, var(--wp-admin-theme-color, #3858e9))`,\n accentDarker10: `var(--wp-components-color-accent-darker-10, var(--wp-admin-theme-color-darker-10, #2145e6))`,\n accentDarker20: `var(--wp-components-color-accent-darker-20, var(--wp-admin-theme-color-darker-20, #183ad6))`,\n /** Used when placing text on the accent color. */\n accentInverted: `var(--wp-components-color-accent-inverted, ${white})`,\n background: `var(--wp-components-color-background, ${white})`,\n foreground: `var(--wp-components-color-foreground, ${GRAY[900]})`,\n /** Used when placing text on the foreground color. */\n foregroundInverted: `var(--wp-components-color-foreground-inverted, ${white})`,\n gray: {\n /** @deprecated Use `COLORS.theme.foreground` instead. */\n 900: `var(--wp-components-color-foreground, ${GRAY[900]})`,\n 800: `var(--wp-components-color-gray-800, ${GRAY[800]})`,\n 700: `var(--wp-components-color-gray-700, ${GRAY[700]})`,\n 600: `var(--wp-components-color-gray-600, ${GRAY[600]})`,\n 400: `var(--wp-components-color-gray-400, ${GRAY[400]})`,\n 300: `var(--wp-components-color-gray-300, ${GRAY[300]})`,\n 200: `var(--wp-components-color-gray-200, ${GRAY[200]})`,\n 100: `var(--wp-components-color-gray-100, ${GRAY[100]})`\n }\n};\nconst UI = {\n background: THEME.background,\n backgroundDisabled: THEME.gray[100],\n border: THEME.gray[600],\n borderHover: THEME.gray[700],\n borderFocus: THEME.accent,\n borderDisabled: THEME.gray[400],\n textDisabled: THEME.gray[600],\n // Matches @wordpress/base-styles\n darkGrayPlaceholder: `color-mix(in srgb, ${THEME.foreground}, transparent 38%)`,\n lightGrayPlaceholder: `color-mix(in srgb, ${THEME.background}, transparent 35%)`\n};\nexport const COLORS = Object.freeze({\n /**\n * The main gray color object.\n *\n * @deprecated Use semantic aliases in `COLORS.ui` or theme-ready variables in `COLORS.theme.gray`.\n */\n gray: GRAY,\n // TODO: Stop exporting this when everything is migrated to `theme` or `ui`\n /**\n * @deprecated Prefer theme-ready variables in `COLORS.theme`.\n */\n white,\n alert: ALERT,\n /**\n * Theme-ready variables with fallbacks.\n *\n * Prefer semantic aliases in `COLORS.ui` when applicable.\n */\n theme: THEME,\n /**\n * Semantic aliases (prefer these over raw variables when applicable).\n */\n ui: UI\n});\nexport default COLORS;"],
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,IAAM,QAAQ;AAGd,IAAM,OAAO;AAAA,EACX,KAAK;AAAA,EACL,KAAK;AAAA;AAAA,EAEL,KAAK;AAAA;AAAA,EAEL,KAAK;AAAA,EACL,KAAK;AAAA;AAAA,EAEL,KAAK;AAAA;AAAA,EAEL,KAAK;AAAA;AAAA,EAEL,KAAK;AACP;AAGA,IAAM,QAAQ;AAAA,EACZ,QAAQ;AAAA,EACR,KAAK;AAAA,EACL,OAAO;AACT;AAGA,IAAM,QAAQ;AAAA,EACZ,QAAQ;AAAA,EACR,gBAAgB;AAAA,EAChB,gBAAgB;AAAA;AAAA,EAEhB,gBAAgB,8CAA8C,KAAK;AAAA,EACnE,YAAY,yCAAyC,KAAK;AAAA,EAC1D,YAAY,yCAAyC,KAAK,GAAG,CAAC;AAAA;AAAA,EAE9D,oBAAoB,kDAAkD,KAAK;AAAA,EAC3E,MAAM;AAAA;AAAA,IAEJ,KAAK,yCAAyC,KAAK,GAAG,CAAC;AAAA,IACvD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,IACrD,KAAK,uCAAuC,KAAK,GAAG,CAAC;AAAA,EACvD;AACF;AACA,IAAM,KAAK;AAAA,EACT,YAAY,MAAM;AAAA,EAClB,oBAAoB,MAAM,KAAK,GAAG;AAAA,EAClC,QAAQ,MAAM,KAAK,GAAG;AAAA,EACtB,aAAa,MAAM,KAAK,GAAG;AAAA,EAC3B,aAAa,MAAM;AAAA,EACnB,gBAAgB,MAAM,KAAK,GAAG;AAAA,EAC9B,cAAc,MAAM,KAAK,GAAG;AAAA;AAAA,EAE5B,qBAAqB,sBAAsB,MAAM,UAAU;AAAA,EAC3D,sBAAsB,sBAAsB,MAAM,UAAU;AAC9D;AACO,IAAM,SAAS,OAAO,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMlC,MAAM;AAAA;AAAA;AAAA;AAAA;AAAA,EAKN;AAAA,EACA,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAMP,OAAO;AAAA;AAAA;AAAA;AAAA,EAIP,IAAI;AACN,CAAC;AACD,IAAO,wBAAQ;",
"names": []
}