@atlaskit/tokens 13.4.0 → 15.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +44 -0
- package/artifacts/theme-import-map/package.json +1 -8
- package/artifacts/types/package.json +1 -8
- package/babel-plugin/package.json +1 -8
- package/constants/package.json +1 -8
- package/css-type-schema/package.json +1 -8
- package/custom-themes/package.json +1 -8
- package/dist/cjs/theme-state-defaults.js +1 -4
- package/dist/es2019/theme-state-defaults.js +1 -4
- package/dist/esm/theme-state-defaults.js +1 -4
- package/enable-global-theme/package.json +1 -8
- package/get-global-theme/package.json +1 -8
- package/get-ssr-auto-script/package.json +1 -8
- package/get-theme-html-attrs/package.json +1 -8
- package/get-theme-styles/package.json +1 -8
- package/get-token/package.json +1 -8
- package/get-token-value/package.json +1 -8
- package/package.json +29 -40
- package/palettes-raw/package.json +1 -8
- package/rename-mapping/package.json +1 -8
- package/set-global-theme/package.json +1 -8
- package/theme-config/package.json +1 -8
- package/theme-mutation-observer/package.json +1 -8
- package/theme-state-transformer/package.json +1 -8
- package/token-default-values/package.json +1 -8
- package/token-ids/package.json +1 -8
- package/token-metadata/package.json +1 -8
- package/token-names/package.json +1 -8
- package/token-order/package.json +1 -8
- package/tokens-raw/package.json +1 -8
- package/types/package.json +1 -8
- package/use-theme-observer/package.json +1 -8
- package/dist/cjs/artifacts/themes/atlassian-shape-rounder.js +0 -12
- package/dist/cjs/artifacts/themes/atlassian-shape-roundest.js +0 -12
- package/dist/es2019/artifacts/themes/atlassian-shape-rounder.js +0 -19
- package/dist/es2019/artifacts/themes/atlassian-shape-roundest.js +0 -19
- package/dist/esm/artifacts/themes/atlassian-shape-rounder.js +0 -6
- package/dist/esm/artifacts/themes/atlassian-shape-roundest.js +0 -6
- package/dist/types/artifacts/themes/atlassian-shape-rounder.d.ts +0 -7
- package/dist/types/artifacts/themes/atlassian-shape-roundest.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/atlassian-dark-token-value-for-contrast-check.d.ts +0 -18
- package/dist/types-ts4.5/artifacts/atlassian-light-token-value-for-contrast-check.d.ts +0 -18
- package/dist/types-ts4.5/artifacts/generated-pairs.d.ts +0 -16
- package/dist/types-ts4.5/artifacts/palettes-raw/legacy-palette.d.ts +0 -25
- package/dist/types-ts4.5/artifacts/palettes-raw/motion-palette.d.ts +0 -24
- package/dist/types-ts4.5/artifacts/palettes-raw/palette-brand-refresh.d.ts +0 -25
- package/dist/types-ts4.5/artifacts/palettes-raw/palette.d.ts +0 -25
- package/dist/types-ts4.5/artifacts/palettes-raw/shape-palette.d.ts +0 -24
- package/dist/types-ts4.5/artifacts/palettes-raw/spacing-scale.d.ts +0 -24
- package/dist/types-ts4.5/artifacts/palettes-raw/typography-palette.d.ts +0 -24
- package/dist/types-ts4.5/artifacts/replacement-mapping.d.ts +0 -26
- package/dist/types-ts4.5/artifacts/theme-import-map.d.ts +0 -16
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-future.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-increased-contrast.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark-new-input-border.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-dark.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-legacy-dark.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-legacy-light.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-future.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-increased-contrast.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-light-new-input-border.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-light.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-motion.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-shape-rounder.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-shape-roundest.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-shape.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-spacing.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/themes/atlassian-typography.d.ts +0 -7
- package/dist/types-ts4.5/artifacts/token-default-values.d.ts +0 -566
- package/dist/types-ts4.5/artifacts/token-names.d.ts +0 -1113
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-brand-refresh.d.ts +0 -50
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-future.d.ts +0 -31
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark-increased-contrast.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-dark.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-legacy-dark.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-legacy-light.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-brand-refresh.d.ts +0 -50
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-future.d.ts +0 -31
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light-increased-contrast.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-light.d.ts +0 -51
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-motion.d.ts +0 -43
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-shape.d.ts +0 -31
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-spacing.d.ts +0 -31
- package/dist/types-ts4.5/artifacts/tokens-raw/atlassian-typography.d.ts +0 -38
- package/dist/types-ts4.5/artifacts/types-internal.d.ts +0 -6
- package/dist/types-ts4.5/artifacts/types.d.ts +0 -6
- package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-token-names.d.ts +0 -784
- package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-types-internal.d.ts +0 -6
- package/dist/types-ts4.5/artifacts/typescript/atlassian-dark-types.d.ts +0 -6
- package/dist/types-ts4.5/artifacts/typescript/atlassian-light-token-names.d.ts +0 -784
- package/dist/types-ts4.5/artifacts/typescript/atlassian-light-types-internal.d.ts +0 -6
- package/dist/types-ts4.5/artifacts/typescript/atlassian-light-types.d.ts +0 -6
- package/dist/types-ts4.5/babel-plugin/index.d.ts +0 -1
- package/dist/types-ts4.5/babel-plugin/plugin.d.ts +0 -29
- package/dist/types-ts4.5/constants.d.ts +0 -9
- package/dist/types-ts4.5/custom-theme.d.ts +0 -6
- package/dist/types-ts4.5/enable-global-theme.d.ts +0 -26
- package/dist/types-ts4.5/entry-points/artifacts-theme-import-map.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/artifacts-types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/babel-plugin.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/constants.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/css-type-schema.codegen.d.ts +0 -165
- package/dist/types-ts4.5/entry-points/custom-themes.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/enable-global-theme.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-global-theme.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-ssr-auto-script.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-theme-html-attrs.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-theme-styles.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-token-value.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/get-token.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/palettes-raw.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/rename-mapping.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/set-global-theme.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/theme-config.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/theme-mutation-observer.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/theme-state-transformer.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/token-default-values.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/token-ids.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/token-metadata.codegen.d.ts +0 -19
- package/dist/types-ts4.5/entry-points/token-names.d.ts +0 -2
- package/dist/types-ts4.5/entry-points/token-order.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/tokens-raw.d.ts +0 -6
- package/dist/types-ts4.5/entry-points/types.d.ts +0 -1
- package/dist/types-ts4.5/entry-points/use-theme-observer.d.ts +0 -1
- package/dist/types-ts4.5/get-custom-theme-styles.d.ts +0 -16
- package/dist/types-ts4.5/get-global-theme.d.ts +0 -3
- package/dist/types-ts4.5/get-ssr-auto-script.d.ts +0 -11
- package/dist/types-ts4.5/get-theme-html-attrs.d.ts +0 -18
- package/dist/types-ts4.5/get-theme-styles.d.ts +0 -25
- package/dist/types-ts4.5/get-token-value.d.ts +0 -25
- package/dist/types-ts4.5/get-token.d.ts +0 -26
- package/dist/types-ts4.5/index.d.ts +0 -19
- package/dist/types-ts4.5/is-color-mode.d.ts +0 -2
- package/dist/types-ts4.5/is-theme-ids.d.ts +0 -2
- package/dist/types-ts4.5/is-theme-kind.d.ts +0 -11
- package/dist/types-ts4.5/load-custom-theme-styles.d.ts +0 -17
- package/dist/types-ts4.5/set-global-theme.d.ts +0 -26
- package/dist/types-ts4.5/theme-color-modes.d.ts +0 -12
- package/dist/types-ts4.5/theme-config.d.ts +0 -121
- package/dist/types-ts4.5/theme-ids.d.ts +0 -19
- package/dist/types-ts4.5/theme-mutation-observer.d.ts +0 -25
- package/dist/types-ts4.5/theme-object-to-string.d.ts +0 -13
- package/dist/types-ts4.5/theme-options-schema.d.ts +0 -7
- package/dist/types-ts4.5/theme-state-defaults.d.ts +0 -14
- package/dist/types-ts4.5/theme-state.d.ts +0 -17
- package/dist/types-ts4.5/theme-string-to-object.d.ts +0 -14
- package/dist/types-ts4.5/types.d.ts +0 -1356
- package/dist/types-ts4.5/use-theme-observer.d.ts +0 -16
- package/dist/types-ts4.5/utils/additional-contrast-checker.d.ts +0 -9
- package/dist/types-ts4.5/utils/color-detection.d.ts +0 -8
- package/dist/types-ts4.5/utils/color-mode-listeners.d.ts +0 -13
- package/dist/types-ts4.5/utils/configure-page.d.ts +0 -6
- package/dist/types-ts4.5/utils/contrast-mode-listeners.d.ts +0 -13
- package/dist/types-ts4.5/utils/custom-theme-loading-utils.d.ts +0 -4
- package/dist/types-ts4.5/utils/custom-theme-token-contrast-check.d.ts +0 -11
- package/dist/types-ts4.5/utils/delta-e.d.ts +0 -1
- package/dist/types-ts4.5/utils/generate-colors.d.ts +0 -5
- package/dist/types-ts4.5/utils/generate-token-map-with-contrast-check.d.ts +0 -11
- package/dist/types-ts4.5/utils/generate-token-map.d.ts +0 -11
- package/dist/types-ts4.5/utils/get-alpha.d.ts +0 -1
- package/dist/types-ts4.5/utils/get-closest-color-index.d.ts +0 -2
- package/dist/types-ts4.5/utils/get-contrast-ratio.d.ts +0 -1
- package/dist/types-ts4.5/utils/get-css-custom-property.d.ts +0 -15
- package/dist/types-ts4.5/utils/get-fully-qualified-token-id.d.ts +0 -11
- package/dist/types-ts4.5/utils/get-increased-contrast-theme.d.ts +0 -5
- package/dist/types-ts4.5/utils/get-theme-override-preferences.d.ts +0 -2
- package/dist/types-ts4.5/utils/get-theme-preferences.d.ts +0 -3
- package/dist/types-ts4.5/utils/get-token-id.d.ts +0 -15
- package/dist/types-ts4.5/utils/hash.d.ts +0 -1
- package/dist/types-ts4.5/utils/hct-color-utils/alpha-from-argb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-linrgb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-lstar.d.ts +0 -8
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-rgba.d.ts +0 -8
- package/dist/types-ts4.5/utils/hct-color-utils/argb-from-xyz.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/blue-from-argb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-component.d.ts +0 -1
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-double.d.ts +0 -7
- package/dist/types-ts4.5/utils/hct-color-utils/clamp-int.d.ts +0 -7
- package/dist/types-ts4.5/utils/hct-color-utils/contrast.d.ts +0 -78
- package/dist/types-ts4.5/utils/hct-color-utils/delinearized.d.ts +0 -9
- package/dist/types-ts4.5/utils/hct-color-utils/green-from-argb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/hct.d.ts +0 -92
- package/dist/types-ts4.5/utils/hct-color-utils/index.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/lab-f.d.ts +0 -1
- package/dist/types-ts4.5/utils/hct-color-utils/lab-invf.d.ts +0 -1
- package/dist/types-ts4.5/utils/hct-color-utils/lerp.d.ts +0 -6
- package/dist/types-ts4.5/utils/hct-color-utils/linearized.d.ts +0 -9
- package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-argb.d.ts +0 -7
- package/dist/types-ts4.5/utils/hct-color-utils/lstar-from-y.d.ts +0 -12
- package/dist/types-ts4.5/utils/hct-color-utils/math-utils.d.ts +0 -6
- package/dist/types-ts4.5/utils/hct-color-utils/matrix-multiply.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/red-from-argb.d.ts +0 -4
- package/dist/types-ts4.5/utils/hct-color-utils/rgba-from-argb.d.ts +0 -8
- package/dist/types-ts4.5/utils/hct-color-utils/rgba.d.ts +0 -14
- package/dist/types-ts4.5/utils/hct-color-utils/sanitize-degrees-double.d.ts +0 -7
- package/dist/types-ts4.5/utils/hct-color-utils/signum.d.ts +0 -6
- package/dist/types-ts4.5/utils/hct-color-utils/viewing-conditions.d.ts +0 -47
- package/dist/types-ts4.5/utils/hct-color-utils/white-point-d65.d.ts +0 -6
- package/dist/types-ts4.5/utils/hct-color-utils/y-from-lstar.d.ts +0 -12
- package/dist/types-ts4.5/utils/hex-to-hsl.d.ts +0 -5
- package/dist/types-ts4.5/utils/hex-to-rgb-a.d.ts +0 -6
- package/dist/types-ts4.5/utils/hex-to-rgb.d.ts +0 -5
- package/dist/types-ts4.5/utils/hex-to-rgba-values.d.ts +0 -6
- package/dist/types-ts4.5/utils/hsl-to-rgb.d.ts +0 -5
- package/dist/types-ts4.5/utils/is-valid-brand-hex.d.ts +0 -1
- package/dist/types-ts4.5/utils/is-valid-hex.d.ts +0 -1
- package/dist/types-ts4.5/utils/limit-size-of-custom-style-elements.d.ts +0 -1
- package/dist/types-ts4.5/utils/load-theme-css.d.ts +0 -2
- package/dist/types-ts4.5/utils/reduce-token-map.d.ts +0 -6
- package/dist/types-ts4.5/utils/relative-luminance-w3-c.d.ts +0 -1
- package/dist/types-ts4.5/utils/rgb-to-hex.d.ts +0 -1
- package/dist/types-ts4.5/utils/rgb-to-lab.d.ts +0 -5
- package/dist/types-ts4.5/utils/theme-loading.d.ts +0 -5
- package/dist/types-ts4.5/utils/token-ids.d.ts +0 -3
- package/dist/types-ts4.5/utils/token-order.d.ts +0 -7
- package/dist/types-ts4.5/utils/token-usage-guidelines.d.ts +0 -8
- package/figma/atlassian-shape-rounder.json +0 -123
- package/figma/atlassian-shape-roundest.json +0 -123
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import { type ActiveThemeState } from './theme-config';
|
|
2
|
-
/**
|
|
3
|
-
* A React hook which returns the current themes and color-mode set on `<html>`.
|
|
4
|
-
*
|
|
5
|
-
* @example
|
|
6
|
-
* ```
|
|
7
|
-
* const { colorMode, dark, light, spacing, typography } = useThemeObserver();
|
|
8
|
-
*
|
|
9
|
-
* // Performing side effects when it changes
|
|
10
|
-
* useEffect(() => {
|
|
11
|
-
* console.log(`The color mode has changed to ${theme.colorMode}`);
|
|
12
|
-
* }, [theme.colorMode]);
|
|
13
|
-
* ```
|
|
14
|
-
*/
|
|
15
|
-
declare const useThemeObserver: () => Partial<ActiveThemeState>;
|
|
16
|
-
export default useThemeObserver;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import { type ShadowToken } from '../types';
|
|
2
|
-
/**
|
|
3
|
-
* Returns a box shadow formatted for CSS from a ShadowToken raw value.
|
|
4
|
-
*
|
|
5
|
-
* @param rawShadow - ShadowToken raw value
|
|
6
|
-
*/
|
|
7
|
-
export declare const getBoxShadow: (rawShadow: ShadowToken<string>["value"]) => string;
|
|
8
|
-
export { hexToRGBAValues } from './hex-to-rgba-values';
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { type UnbindFn } from 'bind-event-listener';
|
|
2
|
-
declare class ColorModeObserver {
|
|
3
|
-
unbindThemeChangeListener: UnbindFn | null;
|
|
4
|
-
getColorMode(): 'dark' | 'light';
|
|
5
|
-
bind(): void;
|
|
6
|
-
unbind(): void;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* A singleton color mode observer - binds "auto" switching logic to a single `mediaQueryList` listener
|
|
10
|
-
* that can be unbound by any consumer when no longer needed.
|
|
11
|
-
*/
|
|
12
|
-
declare const SingletonColorModeObserver: ColorModeObserver;
|
|
13
|
-
export default SingletonColorModeObserver;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { type ThemeState } from '../theme-config';
|
|
2
|
-
/**
|
|
3
|
-
* Given ThemeState, sets appropriate html attributes on the documentElement,
|
|
4
|
-
* adds a listener to keep colorMode updated, and returns a function to unbind.
|
|
5
|
-
*/
|
|
6
|
-
export default function configurePage(themeState: ThemeState): () => void;
|
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
import { type UnbindFn } from 'bind-event-listener';
|
|
2
|
-
declare class ContrastModeObserver {
|
|
3
|
-
unbindContrastChangeListener: UnbindFn | null;
|
|
4
|
-
getContrastMode(): 'more' | 'no-preference';
|
|
5
|
-
bind(): void;
|
|
6
|
-
unbind(): void;
|
|
7
|
-
}
|
|
8
|
-
/**
|
|
9
|
-
* A singleton contrast mode observer - binds "auto" switching logic to a single `mediaQueryList` listener
|
|
10
|
-
* that can be unbound by any consumer when no longer needed.
|
|
11
|
-
*/
|
|
12
|
-
declare const SingletonContrastModeObserver: ContrastModeObserver;
|
|
13
|
-
export default SingletonContrastModeObserver;
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
import { type ThemeColorModes, type ThemeOptionsSchema } from '../theme-config';
|
|
2
|
-
type ThemeAttributeId = 'light' | 'dark';
|
|
3
|
-
export declare function findMissingCustomStyleElements(UNSAFE_themeOptions: ThemeOptionsSchema, mode: ThemeColorModes): ThemeAttributeId[];
|
|
4
|
-
export {};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type tokens from '../artifacts/token-names';
|
|
2
|
-
type Token = keyof typeof tokens;
|
|
3
|
-
interface AdditionalContrastCheck {
|
|
4
|
-
foreground: Token;
|
|
5
|
-
backgroundLight: Token;
|
|
6
|
-
backgroundDark: Token;
|
|
7
|
-
desiredContrast: number;
|
|
8
|
-
updatedTokens: Token[];
|
|
9
|
-
}
|
|
10
|
-
export declare const additionalChecks: AdditionalContrastCheck[];
|
|
11
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function deltaE(rgbA: number[], rgbB: number[]): number;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type tokens from '../artifacts/token-names';
|
|
2
|
-
import { type CSSColor, type ThemeColorModes } from '../theme-config';
|
|
3
|
-
type Token = keyof typeof tokens;
|
|
4
|
-
type TokenMap = {
|
|
5
|
-
[key in Token]?: number | string;
|
|
6
|
-
};
|
|
7
|
-
type Mode = 'light' | 'dark';
|
|
8
|
-
export declare const generateTokenMapWithContrastCheck: (brandColor: CSSColor, mode: ThemeColorModes, themeRamp?: CSSColor[]) => {
|
|
9
|
-
[mode in Mode]?: TokenMap;
|
|
10
|
-
};
|
|
11
|
-
export {};
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type tokens from '../artifacts/token-names';
|
|
2
|
-
import { type CSSColor, type ThemeColorModes } from '../theme-config';
|
|
3
|
-
type Token = keyof typeof tokens;
|
|
4
|
-
type TokenMap = {
|
|
5
|
-
[key in Token]?: number | string;
|
|
6
|
-
};
|
|
7
|
-
type Mode = 'light' | 'dark';
|
|
8
|
-
export declare const generateTokenMap: (brandColor: CSSColor, mode: ThemeColorModes, themeRamp?: CSSColor[]) => {
|
|
9
|
-
[mode in Mode]?: TokenMap;
|
|
10
|
-
};
|
|
11
|
-
export {};
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function getAlpha(hex: string): number;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function getContrastRatio(foreground: string, background: string): number;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Transforms a style dictionary token path to a CSS custom property.
|
|
3
|
-
*
|
|
4
|
-
* A css prefix will be prepended and all [default] key words will be omitted
|
|
5
|
-
* from the path
|
|
6
|
-
*
|
|
7
|
-
* @example <caption>Passing a path as an array</caption>
|
|
8
|
-
* // Returns ds-background-bold
|
|
9
|
-
* getCSSCustomProperty(['color', 'background', 'bold', '[default]'])
|
|
10
|
-
*
|
|
11
|
-
* @example <caption>Passing a path as a string</caption>
|
|
12
|
-
* // Returns ds-background-bold
|
|
13
|
-
* getCSSCustomProperty('color.background.bold.[default]')
|
|
14
|
-
*/
|
|
15
|
-
export declare const getCSSCustomProperty: (path: string | string[]) => string;
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Transforms a style dictionary token path to a fully qualified token id
|
|
3
|
-
* These Ids are intended to be used internal to this package by style-dictionary
|
|
4
|
-
*
|
|
5
|
-
* [default] key words will NOT be omitted from the path
|
|
6
|
-
*
|
|
7
|
-
* @example <caption>Passing a path as a string</caption>
|
|
8
|
-
* // Returns color.background.bold.[default]
|
|
9
|
-
* getFullyQualifiedTokenId(['color', 'background', 'bold', '[default]'])
|
|
10
|
-
*/
|
|
11
|
-
export declare const getFullyQualifiedTokenId: (path: string[]) => string;
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import { type ThemeIds, type ThemeOverrideIds } from '../theme-config';
|
|
2
|
-
/**
|
|
3
|
-
* Finds any matching increased contrast theme available for a selected theme.
|
|
4
|
-
*/
|
|
5
|
-
export default function getIncreasedContrastTheme(themeId: ThemeIds | ThemeOverrideIds): ThemeIds | ThemeOverrideIds | undefined;
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Transforms a style dictionary token path to a shorthand token id
|
|
3
|
-
* These ids will be typically be how tokens are interacted with via typescript and css
|
|
4
|
-
*
|
|
5
|
-
* All [default] key words will be omitted from the path
|
|
6
|
-
*
|
|
7
|
-
* @example <caption>Passing a path as an array</caption>
|
|
8
|
-
* // Returns color.background.bold
|
|
9
|
-
* getTokenId(['color', 'background', 'bold', '[default]'])
|
|
10
|
-
*
|
|
11
|
-
* @example <caption>Passing a path as a string</caption>
|
|
12
|
-
* // Returns color.background.bold
|
|
13
|
-
* getTokenId('color.background.bold.[default]')
|
|
14
|
-
*/
|
|
15
|
-
export declare const getTokenId: (path: string | string[]) => string;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const hash: (str: string) => string;
|
|
@@ -1,8 +0,0 @@
|
|
|
1
|
-
import type { Rgba } from './rgba';
|
|
2
|
-
/**
|
|
3
|
-
* Return int32 color from a given RGBA component
|
|
4
|
-
*
|
|
5
|
-
* @param rgba RGBA representation of a int32 color.
|
|
6
|
-
* @returns ARGB representation of a int32 color.
|
|
7
|
-
*/
|
|
8
|
-
export declare function argbFromRgba({ r, g, b, a }: Rgba): number;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function clampComponent(value: number): number;
|
|
@@ -1,78 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Below lines are copied from @material/material-color-utilities.
|
|
3
|
-
* Do not modify it.
|
|
4
|
-
*/
|
|
5
|
-
/**
|
|
6
|
-
* Utility methods for calculating contrast given two colors, or calculating a
|
|
7
|
-
* color given one color and a contrast ratio.
|
|
8
|
-
*
|
|
9
|
-
* Contrast ratio is calculated using XYZ's Y. When linearized to match human
|
|
10
|
-
* perception, Y becomes HCT's tone and L*a*b*'s' L*. Informally, this is the
|
|
11
|
-
* lightness of a color.
|
|
12
|
-
*
|
|
13
|
-
* Methods refer to tone, T in the the HCT color space.
|
|
14
|
-
* Tone is equivalent to L* in the L*a*b* color space, or L in the LCH color
|
|
15
|
-
* space.
|
|
16
|
-
*/
|
|
17
|
-
export declare class Contrast {
|
|
18
|
-
/**
|
|
19
|
-
* Returns a contrast ratio, which ranges from 1 to 21.
|
|
20
|
-
*
|
|
21
|
-
* @param toneA Tone between 0 and 100. Values outside will be clamped.
|
|
22
|
-
* @param toneB Tone between 0 and 100. Values outside will be clamped.
|
|
23
|
-
*/
|
|
24
|
-
static ratioOfTones(toneA: number, toneB: number): number;
|
|
25
|
-
static ratioOfYs(y1: number, y2: number): number;
|
|
26
|
-
/**
|
|
27
|
-
* Returns a tone >= tone parameter that ensures ratio parameter.
|
|
28
|
-
* Return value is between 0 and 100.
|
|
29
|
-
* Returns -1 if ratio cannot be achieved with tone parameter.
|
|
30
|
-
*
|
|
31
|
-
* @param tone Tone return value must contrast with.
|
|
32
|
-
* Range is 0 to 100. Invalid values will result in -1 being returned.
|
|
33
|
-
* @param ratio Contrast ratio of return value and tone.
|
|
34
|
-
* Range is 1 to 21, invalid values have undefined behavior.
|
|
35
|
-
*/
|
|
36
|
-
static lighter(tone: number, ratio: number): number;
|
|
37
|
-
/**
|
|
38
|
-
* Returns a tone <= tone parameter that ensures ratio parameter.
|
|
39
|
-
* Return value is between 0 and 100.
|
|
40
|
-
* Returns -1 if ratio cannot be achieved with tone parameter.
|
|
41
|
-
*
|
|
42
|
-
* @param tone Tone return value must contrast with.
|
|
43
|
-
* Range is 0 to 100. Invalid values will result in -1 being returned.
|
|
44
|
-
* @param ratio Contrast ratio of return value and tone.
|
|
45
|
-
* Range is 1 to 21, invalid values have undefined behavior.
|
|
46
|
-
*/
|
|
47
|
-
static darker(tone: number, ratio: number): number;
|
|
48
|
-
/**
|
|
49
|
-
* Returns a tone >= tone parameter that ensures ratio parameter.
|
|
50
|
-
* Return value is between 0 and 100.
|
|
51
|
-
* Returns 100 if ratio cannot be achieved with tone parameter.
|
|
52
|
-
*
|
|
53
|
-
* This method is unsafe because the returned value is guaranteed to be in
|
|
54
|
-
* bounds for tone, i.e. between 0 and 100. However, that value may not reach
|
|
55
|
-
* the ratio with tone. For example, there is no color lighter than T100.
|
|
56
|
-
*
|
|
57
|
-
* @param tone Tone return value must contrast with.
|
|
58
|
-
* Range is 0 to 100. Invalid values will result in 100 being returned.
|
|
59
|
-
* @param ratio Desired contrast ratio of return value and tone parameter.
|
|
60
|
-
* Range is 1 to 21, invalid values have undefined behavior.
|
|
61
|
-
*/
|
|
62
|
-
static lighterUnsafe(tone: number, ratio: number): number;
|
|
63
|
-
/**
|
|
64
|
-
* Returns a tone >= tone parameter that ensures ratio parameter.
|
|
65
|
-
* Return value is between 0 and 100.
|
|
66
|
-
* Returns 100 if ratio cannot be achieved with tone parameter.
|
|
67
|
-
*
|
|
68
|
-
* This method is unsafe because the returned value is guaranteed to be in
|
|
69
|
-
* bounds for tone, i.e. between 0 and 100. However, that value may not reach
|
|
70
|
-
* the [ratio with [tone]. For example, there is no color darker than T0.
|
|
71
|
-
*
|
|
72
|
-
* @param tone Tone return value must contrast with.
|
|
73
|
-
* Range is 0 to 100. Invalid values will result in 0 being returned.
|
|
74
|
-
* @param ratio Desired contrast ratio of return value and tone parameter.
|
|
75
|
-
* Range is 1 to 21, invalid values have undefined behavior.
|
|
76
|
-
*/
|
|
77
|
-
static darkerUnsafe(tone: number, ratio: number): number;
|
|
78
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Delinearizes an RGB component.
|
|
3
|
-
*
|
|
4
|
-
* @param rgbComponent 0.0 <= rgb_component <= 100.0, represents
|
|
5
|
-
* linear R/G/B channel
|
|
6
|
-
* @return 0 <= output <= 255, color channel converted to regular
|
|
7
|
-
* RGB space
|
|
8
|
-
*/
|
|
9
|
-
export declare function delinearized(rgbComponent: number): number;
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Below lines are copied from @material/material-color-utilities.
|
|
3
|
-
* Do not modify it.
|
|
4
|
-
*/
|
|
5
|
-
import { ViewingConditions } from './viewing-conditions';
|
|
6
|
-
/**
|
|
7
|
-
* A color system built using CAM16 hue and chroma, and L* from
|
|
8
|
-
* L*a*b*.
|
|
9
|
-
*
|
|
10
|
-
* Using L* creates a link between the color system, contrast, and thus
|
|
11
|
-
* accessibility. Contrast ratio depends on relative luminance, or Y in the XYZ
|
|
12
|
-
* color space. L*, or perceptual luminance can be calculated from Y.
|
|
13
|
-
*
|
|
14
|
-
* Unlike Y, L* is linear to human perception, allowing trivial creation of
|
|
15
|
-
* accurate color tones.
|
|
16
|
-
*
|
|
17
|
-
* Unlike contrast ratio, measuring contrast in L* is linear, and simple to
|
|
18
|
-
* calculate. A difference of 40 in HCT tone guarantees a contrast ratio >= 3.0,
|
|
19
|
-
* and a difference of 50 guarantees a contrast ratio >= 4.5.
|
|
20
|
-
*/
|
|
21
|
-
/**
|
|
22
|
-
* HCT, hue, chroma, and tone. A color system that provides a perceptually
|
|
23
|
-
* accurate color measurement system that can also accurately render what colors
|
|
24
|
-
* will appear as in different lighting environments.
|
|
25
|
-
*/
|
|
26
|
-
export declare class Hct {
|
|
27
|
-
/**
|
|
28
|
-
* @param hue 0 <= hue < 360; invalid values are corrected.
|
|
29
|
-
* @param chroma 0 <= chroma < ?; Informally, colorfulness. The color
|
|
30
|
-
* returned may be lower than the requested chroma. Chroma has a different
|
|
31
|
-
* maximum for any given hue and tone.
|
|
32
|
-
* @param tone 0 <= tone <= 100; invalid values are corrected.
|
|
33
|
-
* @return HCT representation of a color in default viewing conditions.
|
|
34
|
-
*/
|
|
35
|
-
internalHue: number;
|
|
36
|
-
internalChroma: number;
|
|
37
|
-
internalTone: number;
|
|
38
|
-
private argb;
|
|
39
|
-
static from(hue: number, chroma: number, tone: number): Hct;
|
|
40
|
-
/**
|
|
41
|
-
* @param argb ARGB representation of a color.
|
|
42
|
-
* @return HCT representation of a color in default viewing conditions
|
|
43
|
-
*/
|
|
44
|
-
static fromInt(argb: number): Hct;
|
|
45
|
-
toInt(): number;
|
|
46
|
-
/**
|
|
47
|
-
* A number, in degrees, representing ex. red, orange, yellow, etc.
|
|
48
|
-
* Ranges from 0 <= hue < 360.
|
|
49
|
-
*/
|
|
50
|
-
get hue(): number;
|
|
51
|
-
/**
|
|
52
|
-
* @param newHue 0 <= newHue < 360; invalid values are corrected.
|
|
53
|
-
* Chroma may decrease because chroma has a different maximum for any given
|
|
54
|
-
* hue and tone.
|
|
55
|
-
*/
|
|
56
|
-
set hue(newHue: number);
|
|
57
|
-
get chroma(): number;
|
|
58
|
-
/**
|
|
59
|
-
* @param newChroma 0 <= newChroma < ?
|
|
60
|
-
* Chroma may decrease because chroma has a different maximum for any given
|
|
61
|
-
* hue and tone.
|
|
62
|
-
*/
|
|
63
|
-
set chroma(newChroma: number);
|
|
64
|
-
/**
|
|
65
|
-
* Lightness. Ranges from 0 to 100.
|
|
66
|
-
*/
|
|
67
|
-
get tone(): number;
|
|
68
|
-
/**
|
|
69
|
-
* @param newTone 0 <= newTone <= 100; invalid valids are corrected.
|
|
70
|
-
* Chroma may decrease because chroma has a different maximum for any given
|
|
71
|
-
* hue and tone.
|
|
72
|
-
*/
|
|
73
|
-
set tone(newTone: number);
|
|
74
|
-
private constructor();
|
|
75
|
-
private setInternalState;
|
|
76
|
-
/**
|
|
77
|
-
* Translates a color into different [ViewingConditions].
|
|
78
|
-
*
|
|
79
|
-
* Colors change appearance. They look different with lights on versus off,
|
|
80
|
-
* the same color, as in hex code, on white looks different when on black.
|
|
81
|
-
* This is called color relativity, most famously explicated by Josef Albers
|
|
82
|
-
* in Interaction of Color.
|
|
83
|
-
*
|
|
84
|
-
* In color science, color appearance models can account for this and
|
|
85
|
-
* calculate the appearance of a color in different settings. HCT is based on
|
|
86
|
-
* CAM16, a color appearance model, and uses it to make these calculations.
|
|
87
|
-
*
|
|
88
|
-
* See [ViewingConditions.make] for parameters affecting color appearance.
|
|
89
|
-
*/
|
|
90
|
-
inViewingConditions(vc: ViewingConditions): Hct;
|
|
91
|
-
}
|
|
92
|
-
export { ViewingConditions } from './viewing-conditions';
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function labF(t: number): number;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function labInvf(ft: number): number;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Linearizes an RGB component.
|
|
3
|
-
*
|
|
4
|
-
* @param rgbComponent 0 <= rgb_component <= 255, represents R/G/B
|
|
5
|
-
* channel
|
|
6
|
-
* @return 0.0 <= output <= 100.0, color channel converted to
|
|
7
|
-
* linear RGB space
|
|
8
|
-
*/
|
|
9
|
-
export declare function linearized(rgbComponent: number): number;
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* Converts a Y value to an L* value.
|
|
3
|
-
*
|
|
4
|
-
* L* in L*a*b* and Y in XYZ measure the same quantity, luminance.
|
|
5
|
-
*
|
|
6
|
-
* L* measures perceptual luminance, a linear scale. Y in XYZ
|
|
7
|
-
* measures relative luminance, a logarithmic scale.
|
|
8
|
-
*
|
|
9
|
-
* @param y Y in XYZ
|
|
10
|
-
* @return L* in L*a*b*
|
|
11
|
-
*/
|
|
12
|
-
export declare function lstarFromY(y: number): number;
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
export { signum } from './signum';
|
|
2
|
-
export { lerp } from './lerp';
|
|
3
|
-
export { clampInt } from './clamp-int';
|
|
4
|
-
export { clampDouble } from './clamp-double';
|
|
5
|
-
export { sanitizeDegreesDouble } from './sanitize-degrees-double';
|
|
6
|
-
export { matrixMultiply } from './matrix-multiply';
|
|
@@ -1,14 +0,0 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* RGBA component
|
|
3
|
-
*
|
|
4
|
-
* @param r Red value should be between 0-255
|
|
5
|
-
* @param g Green value should be between 0-255
|
|
6
|
-
* @param b Blue value should be between 0-255
|
|
7
|
-
* @param a Alpha value should be between 0-255
|
|
8
|
-
*/
|
|
9
|
-
export interface Rgba {
|
|
10
|
-
r: number;
|
|
11
|
-
g: number;
|
|
12
|
-
b: number;
|
|
13
|
-
a: number;
|
|
14
|
-
}
|
|
@@ -1,47 +0,0 @@
|
|
|
1
|
-
export declare class ViewingConditions {
|
|
2
|
-
/**
|
|
3
|
-
* sRGB-like viewing conditions.
|
|
4
|
-
*/
|
|
5
|
-
static DEFAULT: ViewingConditions;
|
|
6
|
-
/**
|
|
7
|
-
* Create ViewingConditions from a simple, physically relevant, set of
|
|
8
|
-
* parameters.
|
|
9
|
-
*
|
|
10
|
-
* @param whitePoint White point, measured in the XYZ color space.
|
|
11
|
-
* default = D65, or sunny day afternoon
|
|
12
|
-
* @param adaptingLuminance The luminance of the adapting field. Informally,
|
|
13
|
-
* how bright it is in the room where the color is viewed. Can be
|
|
14
|
-
* calculated from lux by multiplying lux by 0.0586. default = 11.72,
|
|
15
|
-
* or 200 lux.
|
|
16
|
-
* @param backgroundLstar The lightness of the area surrounding the color.
|
|
17
|
-
* measured by L* in L*a*b*. default = 50.0
|
|
18
|
-
* @param surround A general description of the lighting surrounding the
|
|
19
|
-
* color. 0 is pitch dark, like watching a movie in a theater. 1.0 is a
|
|
20
|
-
* dimly light room, like watching TV at home at night. 2.0 means there
|
|
21
|
-
* is no difference between the lighting on the color and around it.
|
|
22
|
-
* default = 2.0
|
|
23
|
-
* @param discountingIlluminant Whether the eye accounts for the tint of the
|
|
24
|
-
* ambient lighting, such as knowing an apple is still red in green light.
|
|
25
|
-
* default = false, the eye does not perform this process on
|
|
26
|
-
* self-luminous objects like displays.
|
|
27
|
-
*/
|
|
28
|
-
static make(whitePoint?: number[], adaptingLuminance?: number, backgroundLstar?: number, surround?: number, discountingIlluminant?: boolean): ViewingConditions;
|
|
29
|
-
/**
|
|
30
|
-
* Parameters are intermediate values of the CAM16 conversion process. Their
|
|
31
|
-
* names are shorthand for technical color science terminology, this class
|
|
32
|
-
* would not benefit from documenting them individually. A brief overview
|
|
33
|
-
* is available in the CAM16 specification, and a complete overview requires
|
|
34
|
-
* a color science textbook, such as Fairchild's Color Appearance Models.
|
|
35
|
-
*/
|
|
36
|
-
n: number;
|
|
37
|
-
aw: number;
|
|
38
|
-
nbb: number;
|
|
39
|
-
ncb: number;
|
|
40
|
-
c: number;
|
|
41
|
-
nc: number;
|
|
42
|
-
rgbD: number[];
|
|
43
|
-
fl: number;
|
|
44
|
-
fLRoot: number;
|
|
45
|
-
z: number;
|
|
46
|
-
private constructor();
|
|
47
|
-
}
|