@fluid-topics/ft-wc-utils 1.0.58 → 1.0.60

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.
Files changed (10) hide show
  1. package/build/FtCssVariables.d.ts +1 -20
  2. package/build/FtCssVariables.js +1 -50
  3. package/build/FtFormComponent.d.ts +8 -0
  4. package/build/FtFormComponent.js +20 -0
  5. package/build/designSystemVariables.d.ts +62 -62
  6. package/build/designSystemVariables.js +62 -62
  7. package/build/globals.min.js +23 -23
  8. package/build/index.d.ts +1 -0
  9. package/build/index.js +1 -0
  10. package/package.json +3 -2
package/build/FtCssVariables.d.ts CHANGED
@@ -1,20 +1 @@
1
- import { CSSResult } from "lit";
2
- export type FtCssVariableCategory = "COLOR" | "NUMBER" | "SIZE" | "UNKNOWN" | "POSITION" | "DISPLAY" | "BORDER-STYLE";
3
- export declare class FtCssVariableFactory {
4
- static create(name: string, category: FtCssVariableCategory, defaultValue: string): FtCssVariable;
5
- static extend(name: string, fallbackVariable: FtCssVariable, defaultValue?: string): FtCssVariable;
6
- static external(externalVariable: FtCssVariable, context: string): FtCssVariable;
7
- }
8
- export type FtCssVariable = CSSResult & {
9
- name: string;
10
- category: FtCssVariableCategory;
11
- fallbackVariable?: FtCssVariable;
12
- defaultValue?: string;
13
- context?: string;
14
- breadcrumb(): Array<string>;
15
- defaultCssValue(defaultValue?: string): CSSResult;
16
- get(defaultValue?: string): CSSResult;
17
- lastResortDefaultValue(): string | undefined;
18
- };
19
- export type FtCssVariables = Record<string, FtCssVariable>;
20
- export declare function setVariable(variable: FtCssVariable, value: string | CSSResult | FtCssVariable): CSSResult;
1
+ export * from "@fluid-topics/design-system-variables";
package/build/FtCssVariables.js CHANGED
@@ -1,50 +1 @@
1
- import { css, unsafeCSS } from "lit";
2
- export class FtCssVariableFactory {
3
- static create(name, category, defaultValue) {
4
- let defaultCssValue = (contextualDefaultValue) => unsafeCSS(contextualDefaultValue !== null && contextualDefaultValue !== void 0 ? contextualDefaultValue : defaultValue);
5
- let cssResult = css `var(${unsafeCSS(name)}, ${defaultCssValue(defaultValue)})`;
6
- cssResult.name = name;
7
- cssResult.category = category;
8
- cssResult.defaultValue = defaultValue;
9
- cssResult.defaultCssValue = defaultCssValue;
10
- cssResult.get = (defaultValue) => css `var(${unsafeCSS(name)}, ${defaultCssValue(defaultValue)})`;
11
- cssResult.breadcrumb = () => [];
12
- cssResult.lastResortDefaultValue = () => defaultValue;
13
- return cssResult;
14
- }
15
- static extend(name, fallbackVariable, defaultValue) {
16
- let defaultCssValue = (contextualDefaultValue) => fallbackVariable.get(contextualDefaultValue !== null && contextualDefaultValue !== void 0 ? contextualDefaultValue : defaultValue);
17
- let cssResult = css `var(${unsafeCSS(name)}, ${defaultCssValue(defaultValue)})`;
18
- cssResult.name = name;
19
- cssResult.category = fallbackVariable.category;
20
- cssResult.fallbackVariable = fallbackVariable;
21
- cssResult.defaultValue = defaultValue;
22
- cssResult.defaultCssValue = defaultCssValue;
23
- cssResult.get = (defaultValue) => css `var(${unsafeCSS(name)}, ${defaultCssValue(defaultValue)})`;
24
- cssResult.breadcrumb = () => [fallbackVariable.name, ...fallbackVariable.breadcrumb()];
25
- cssResult.lastResortDefaultValue = () => defaultValue;
26
- return cssResult;
27
- }
28
- static external(externalVariable, context) {
29
- let defaultCssValue = (contextualDefaultValue) => externalVariable.fallbackVariable
30
- ? externalVariable.fallbackVariable.get(contextualDefaultValue !== null && contextualDefaultValue !== void 0 ? contextualDefaultValue : externalVariable.defaultValue)
31
- : unsafeCSS(contextualDefaultValue !== null && contextualDefaultValue !== void 0 ? contextualDefaultValue : externalVariable.defaultValue);
32
- let cssResult = css `var(${unsafeCSS(externalVariable.name)}, ${defaultCssValue(externalVariable.defaultValue)})`;
33
- cssResult.name = externalVariable.name;
34
- cssResult.category = externalVariable.category;
35
- cssResult.fallbackVariable = externalVariable.fallbackVariable;
36
- cssResult.defaultValue = externalVariable.defaultValue;
37
- cssResult.context = context;
38
- cssResult.defaultCssValue = defaultCssValue;
39
- cssResult.get = (defaultValue) => css `var(${unsafeCSS(externalVariable.name)}, ${defaultCssValue(defaultValue)})`;
40
- cssResult.breadcrumb = () => externalVariable.fallbackVariable ? [
41
- externalVariable.fallbackVariable.name,
42
- ...externalVariable.fallbackVariable.breadcrumb()
43
- ] : [];
44
- cssResult.lastResortDefaultValue = () => { var _a, _b; return (_a = externalVariable.defaultValue) !== null && _a !== void 0 ? _a : (_b = externalVariable.fallbackVariable) === null || _b === void 0 ? void 0 : _b.lastResortDefaultValue(); };
45
- return cssResult;
46
- }
47
- }
48
- export function setVariable(variable, value) {
49
- return unsafeCSS(`${variable.name}: ${value}`);
50
- }
1
+ export * from "@fluid-topics/design-system-variables";
package/build/FtFormComponent.d.ts ADDED
@@ -0,0 +1,8 @@
1
+ import { FtLitElement } from "./FtLitElement";
2
+ import { Constructor } from "./generic-types";
3
+ export type FtFormComponentInterface = {
4
+ setFormValue(value: string): void;
5
+ get form(): HTMLFormElement | null;
6
+ };
7
+ export type FtFormComponentType<T extends Constructor<FtLitElement>> = T & Constructor<FtFormComponentInterface>;
8
+ export declare function toFtFormComponent<T extends Constructor<FtLitElement>>(ElementClass: T, role: string): FtFormComponentType<T>;
package/build/FtFormComponent.js ADDED
@@ -0,0 +1,20 @@
1
+ const elementInternals = Symbol("elementInternals");
2
+ export function toFtFormComponent(ElementClass, role) {
3
+ class FtFormComponentClass extends ElementClass {
4
+ static get formAssociated() {
5
+ return true;
6
+ }
7
+ get form() {
8
+ return this[elementInternals].form;
9
+ }
10
+ constructor(...params) {
11
+ super(params);
12
+ this[elementInternals] = this.attachInternals();
13
+ this[elementInternals].role = role;
14
+ }
15
+ setFormValue(value) {
16
+ this[elementInternals].setFormValue(value);
17
+ }
18
+ }
19
+ return FtFormComponentClass;
20
+ }
package/build/designSystemVariables.d.ts CHANGED
@@ -1,64 +1,64 @@
1
1
  export declare const designSystemVariables: {
2
- colorPrimary: import("./FtCssVariables").FtCssVariable;
3
- colorPrimaryVariant: import("./FtCssVariables").FtCssVariable;
4
- colorSecondary: import("./FtCssVariables").FtCssVariable;
5
- colorSecondaryVariant: import("./FtCssVariables").FtCssVariable;
6
- colorSurface: import("./FtCssVariables").FtCssVariable;
7
- colorContent: import("./FtCssVariables").FtCssVariable;
8
- colorError: import("./FtCssVariables").FtCssVariable;
9
- colorOutline: import("./FtCssVariables").FtCssVariable;
10
- colorOpacityHigh: import("./FtCssVariables").FtCssVariable;
11
- colorOpacityMedium: import("./FtCssVariables").FtCssVariable;
12
- colorOpacityDisabled: import("./FtCssVariables").FtCssVariable;
13
- colorOnPrimary: import("./FtCssVariables").FtCssVariable;
14
- colorOnPrimaryHigh: import("./FtCssVariables").FtCssVariable;
15
- colorOnPrimaryMedium: import("./FtCssVariables").FtCssVariable;
16
- colorOnPrimaryDisabled: import("./FtCssVariables").FtCssVariable;
17
- colorOnSecondary: import("./FtCssVariables").FtCssVariable;
18
- colorOnSecondaryHigh: import("./FtCssVariables").FtCssVariable;
19
- colorOnSecondaryMedium: import("./FtCssVariables").FtCssVariable;
20
- colorOnSecondaryDisabled: import("./FtCssVariables").FtCssVariable;
21
- colorOnSurface: import("./FtCssVariables").FtCssVariable;
22
- colorOnSurfaceHigh: import("./FtCssVariables").FtCssVariable;
23
- colorOnSurfaceMedium: import("./FtCssVariables").FtCssVariable;
24
- colorOnSurfaceDisabled: import("./FtCssVariables").FtCssVariable;
25
- opacityContentOnSurfaceDisabled: import("./FtCssVariables").FtCssVariable;
26
- opacityContentOnSurfaceEnable: import("./FtCssVariables").FtCssVariable;
27
- opacityContentOnSurfaceHover: import("./FtCssVariables").FtCssVariable;
28
- opacityContentOnSurfaceFocused: import("./FtCssVariables").FtCssVariable;
29
- opacityContentOnSurfacePressed: import("./FtCssVariables").FtCssVariable;
30
- opacityContentOnSurfaceSelected: import("./FtCssVariables").FtCssVariable;
31
- opacityContentOnSurfaceDragged: import("./FtCssVariables").FtCssVariable;
32
- opacityPrimaryOnSurfaceDisabled: import("./FtCssVariables").FtCssVariable;
33
- opacityPrimaryOnSurfaceEnable: import("./FtCssVariables").FtCssVariable;
34
- opacityPrimaryOnSurfaceHover: import("./FtCssVariables").FtCssVariable;
35
- opacityPrimaryOnSurfaceFocused: import("./FtCssVariables").FtCssVariable;
36
- opacityPrimaryOnSurfacePressed: import("./FtCssVariables").FtCssVariable;
37
- opacityPrimaryOnSurfaceSelected: import("./FtCssVariables").FtCssVariable;
38
- opacityPrimaryOnSurfaceDragged: import("./FtCssVariables").FtCssVariable;
39
- opacitySurfaceOnPrimaryDisabled: import("./FtCssVariables").FtCssVariable;
40
- opacitySurfaceOnPrimaryEnable: import("./FtCssVariables").FtCssVariable;
41
- opacitySurfaceOnPrimaryHover: import("./FtCssVariables").FtCssVariable;
42
- opacitySurfaceOnPrimaryFocused: import("./FtCssVariables").FtCssVariable;
43
- opacitySurfaceOnPrimaryPressed: import("./FtCssVariables").FtCssVariable;
44
- opacitySurfaceOnPrimarySelected: import("./FtCssVariables").FtCssVariable;
45
- opacitySurfaceOnPrimaryDragged: import("./FtCssVariables").FtCssVariable;
46
- elevation00: import("./FtCssVariables").FtCssVariable;
47
- elevation01: import("./FtCssVariables").FtCssVariable;
48
- elevation02: import("./FtCssVariables").FtCssVariable;
49
- elevation03: import("./FtCssVariables").FtCssVariable;
50
- elevation04: import("./FtCssVariables").FtCssVariable;
51
- elevation06: import("./FtCssVariables").FtCssVariable;
52
- elevation08: import("./FtCssVariables").FtCssVariable;
53
- elevation12: import("./FtCssVariables").FtCssVariable;
54
- elevation16: import("./FtCssVariables").FtCssVariable;
55
- elevation24: import("./FtCssVariables").FtCssVariable;
56
- borderRadiusS: import("./FtCssVariables").FtCssVariable;
57
- borderRadiusM: import("./FtCssVariables").FtCssVariable;
58
- borderRadiusL: import("./FtCssVariables").FtCssVariable;
59
- borderRadiusXL: import("./FtCssVariables").FtCssVariable;
60
- titleFont: import("./FtCssVariables").FtCssVariable;
61
- contentFont: import("./FtCssVariables").FtCssVariable;
62
- transitionDuration: import("./FtCssVariables").FtCssVariable;
63
- transitionTimingFunction: import("./FtCssVariables").FtCssVariable;
2
+ colorPrimary: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
3
+ colorPrimaryVariant: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
4
+ colorSecondary: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
5
+ colorSecondaryVariant: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
6
+ colorSurface: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
7
+ colorContent: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
8
+ colorError: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
9
+ colorOutline: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
10
+ colorOpacityHigh: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
11
+ colorOpacityMedium: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
12
+ colorOpacityDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
13
+ colorOnPrimary: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
14
+ colorOnPrimaryHigh: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
15
+ colorOnPrimaryMedium: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
16
+ colorOnPrimaryDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
17
+ colorOnSecondary: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
18
+ colorOnSecondaryHigh: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
19
+ colorOnSecondaryMedium: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
20
+ colorOnSecondaryDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
21
+ colorOnSurface: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
22
+ colorOnSurfaceHigh: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
23
+ colorOnSurfaceMedium: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
24
+ colorOnSurfaceDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
25
+ opacityContentOnSurfaceDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
26
+ opacityContentOnSurfaceEnable: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
27
+ opacityContentOnSurfaceHover: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
28
+ opacityContentOnSurfaceFocused: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
29
+ opacityContentOnSurfacePressed: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
30
+ opacityContentOnSurfaceSelected: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
31
+ opacityContentOnSurfaceDragged: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
32
+ opacityPrimaryOnSurfaceDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
33
+ opacityPrimaryOnSurfaceEnable: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
34
+ opacityPrimaryOnSurfaceHover: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
35
+ opacityPrimaryOnSurfaceFocused: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
36
+ opacityPrimaryOnSurfacePressed: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
37
+ opacityPrimaryOnSurfaceSelected: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
38
+ opacityPrimaryOnSurfaceDragged: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
39
+ opacitySurfaceOnPrimaryDisabled: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
40
+ opacitySurfaceOnPrimaryEnable: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
41
+ opacitySurfaceOnPrimaryHover: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
42
+ opacitySurfaceOnPrimaryFocused: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
43
+ opacitySurfaceOnPrimaryPressed: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
44
+ opacitySurfaceOnPrimarySelected: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
45
+ opacitySurfaceOnPrimaryDragged: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
46
+ elevation00: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
47
+ elevation01: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
48
+ elevation02: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
49
+ elevation03: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
50
+ elevation04: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
51
+ elevation06: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
52
+ elevation08: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
53
+ elevation12: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
54
+ elevation16: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
55
+ elevation24: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
56
+ borderRadiusS: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
57
+ borderRadiusM: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
58
+ borderRadiusL: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
59
+ borderRadiusXL: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
60
+ titleFont: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
61
+ contentFont: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
62
+ transitionDuration: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
63
+ transitionTimingFunction: import("@fluid-topics/design-system-variables/build/FtCssVariables").FtCssVariable;
64
64
  };
package/build/designSystemVariables.js CHANGED
@@ -1,65 +1,65 @@
1
1
  import { FtCssVariableFactory } from "./FtCssVariables";
2
2
  export const designSystemVariables = {
3
- colorPrimary: FtCssVariableFactory.create("--ft-color-primary", "COLOR", "#2196F3"),
4
- colorPrimaryVariant: FtCssVariableFactory.create("--ft-color-primary-variant", "COLOR", "#1976D2"),
5
- colorSecondary: FtCssVariableFactory.create("--ft-color-secondary", "COLOR", "#FFCC80"),
6
- colorSecondaryVariant: FtCssVariableFactory.create("--ft-color-secondary-variant", "COLOR", "#F57C00"),
7
- colorSurface: FtCssVariableFactory.create("--ft-color-surface", "COLOR", "#FFFFFF"),
8
- colorContent: FtCssVariableFactory.create("--ft-color-content", "COLOR", "rgba(0, 0, 0, 0.87)"),
9
- colorError: FtCssVariableFactory.create("--ft-color-error", "COLOR", "#B00020"),
10
- colorOutline: FtCssVariableFactory.create("--ft-color-outline", "COLOR", "rgba(0, 0, 0, 0.14)"),
11
- colorOpacityHigh: FtCssVariableFactory.create("--ft-color-opacity-high", "NUMBER", "1"),
12
- colorOpacityMedium: FtCssVariableFactory.create("--ft-color-opacity-medium", "NUMBER", "0.74"),
13
- colorOpacityDisabled: FtCssVariableFactory.create("--ft-color-opacity-disabled", "NUMBER", "0.38"),
14
- colorOnPrimary: FtCssVariableFactory.create("--ft-color-on-primary", "COLOR", "#FFFFFF"),
15
- colorOnPrimaryHigh: FtCssVariableFactory.create("--ft-color-on-primary-high", "COLOR", "#FFFFFF"),
16
- colorOnPrimaryMedium: FtCssVariableFactory.create("--ft-color-on-primary-medium", "COLOR", "rgba(255, 255, 255, 0.74)"),
17
- colorOnPrimaryDisabled: FtCssVariableFactory.create("--ft-color-on-primary-disabled", "COLOR", "rgba(255, 255, 255, 0.38)"),
18
- colorOnSecondary: FtCssVariableFactory.create("--ft-color-on-secondary", "COLOR", "#FFFFFF"),
19
- colorOnSecondaryHigh: FtCssVariableFactory.create("--ft-color-on-secondary-high", "COLOR", "#FFFFFF"),
20
- colorOnSecondaryMedium: FtCssVariableFactory.create("--ft-color-on-secondary-medium", "COLOR", "rgba(255, 255, 255, 0.74)"),
21
- colorOnSecondaryDisabled: FtCssVariableFactory.create("--ft-color-on-secondary-disabled", "COLOR", "rgba(255, 255, 255, 0.38)"),
22
- colorOnSurface: FtCssVariableFactory.create("--ft-color-on-surface", "COLOR", "rgba(0, 0, 0, 0.87)"),
23
- colorOnSurfaceHigh: FtCssVariableFactory.create("--ft-color-on-surface-high", "COLOR", "rgba(0, 0, 0, 0.87)"),
24
- colorOnSurfaceMedium: FtCssVariableFactory.create("--ft-color-on-surface-medium", "COLOR", "rgba(0, 0, 0, 0.60)"),
25
- colorOnSurfaceDisabled: FtCssVariableFactory.create("--ft-color-on-surface-disabled", "COLOR", "rgba(0, 0, 0, 0.38)"),
26
- opacityContentOnSurfaceDisabled: FtCssVariableFactory.create("--ft-opacity-content-on-surface-disabled", "NUMBER", "0"),
27
- opacityContentOnSurfaceEnable: FtCssVariableFactory.create("--ft-opacity-content-on-surface-enable", "NUMBER", "0"),
28
- opacityContentOnSurfaceHover: FtCssVariableFactory.create("--ft-opacity-content-on-surface-hover", "NUMBER", "0.04"),
29
- opacityContentOnSurfaceFocused: FtCssVariableFactory.create("--ft-opacity-content-on-surface-focused", "NUMBER", "0.12"),
30
- opacityContentOnSurfacePressed: FtCssVariableFactory.create("--ft-opacity-content-on-surface-pressed", "NUMBER", "0.10"),
31
- opacityContentOnSurfaceSelected: FtCssVariableFactory.create("--ft-opacity-content-on-surface-selected", "NUMBER", "0.08"),
32
- opacityContentOnSurfaceDragged: FtCssVariableFactory.create("--ft-opacity-content-on-surface-dragged", "NUMBER", "0.08"),
33
- opacityPrimaryOnSurfaceDisabled: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-disabled", "NUMBER", "0"),
34
- opacityPrimaryOnSurfaceEnable: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-enable", "NUMBER", "0"),
35
- opacityPrimaryOnSurfaceHover: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-hover", "NUMBER", "0.04"),
36
- opacityPrimaryOnSurfaceFocused: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-focused", "NUMBER", "0.12"),
37
- opacityPrimaryOnSurfacePressed: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-pressed", "NUMBER", "0.10"),
38
- opacityPrimaryOnSurfaceSelected: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-selected", "NUMBER", "0.08"),
39
- opacityPrimaryOnSurfaceDragged: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-dragged", "NUMBER", "0.08"),
40
- opacitySurfaceOnPrimaryDisabled: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-disabled", "NUMBER", "0"),
41
- opacitySurfaceOnPrimaryEnable: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-enable", "NUMBER", "0"),
42
- opacitySurfaceOnPrimaryHover: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-hover", "NUMBER", "0.04"),
43
- opacitySurfaceOnPrimaryFocused: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-focused", "NUMBER", "0.12"),
44
- opacitySurfaceOnPrimaryPressed: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-pressed", "NUMBER", "0.10"),
45
- opacitySurfaceOnPrimarySelected: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-selected", "NUMBER", "0.08"),
46
- opacitySurfaceOnPrimaryDragged: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-dragged", "NUMBER", "0.08"),
47
- elevation00: FtCssVariableFactory.create("--ft-elevation-00", "UNKNOWN", "0px 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px 0px rgba(0, 0, 0, 0)"),
48
- elevation01: FtCssVariableFactory.create("--ft-elevation-01", "UNKNOWN", "0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 1px 2px 0px rgba(0, 0, 0, 0.14), 0px 0px 1px 0px rgba(0, 0, 0, 0.06)"),
49
- elevation02: FtCssVariableFactory.create("--ft-elevation-02", "UNKNOWN", "0px 4px 10px 0px rgba(0, 0, 0, 0.06), 0px 2px 5px 0px rgba(0, 0, 0, 0.14), 0px 0px 1px 0px rgba(0, 0, 0, 0.06)"),
50
- elevation03: FtCssVariableFactory.create("--ft-elevation-03", "UNKNOWN", "0px 6px 13px 0px rgba(0, 0, 0, 0.06), 0px 3px 7px 0px rgba(0, 0, 0, 0.14), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)"),
51
- elevation04: FtCssVariableFactory.create("--ft-elevation-04", "UNKNOWN", "0px 8px 16px 0px rgba(0, 0, 0, 0.06), 0px 4px 9px 0px rgba(0, 0, 0, 0.14), 0px 2px 3px 0px rgba(0, 0, 0, 0.06)"),
52
- elevation06: FtCssVariableFactory.create("--ft-elevation-06", "UNKNOWN", "0px 12px 22px 0px rgba(0, 0, 0, 0.06), 0px 6px 13px 0px rgba(0, 0, 0, 0.14), 0px 4px 5px 0px rgba(0, 0, 0, 0.06)"),
53
- elevation08: FtCssVariableFactory.create("--ft-elevation-08", "UNKNOWN", "0px 16px 28px 0px rgba(0, 0, 0, 0.06), 0px 8px 17px 0px rgba(0, 0, 0, 0.14), 0px 6px 7px 0px rgba(0, 0, 0, 0.06)"),
54
- elevation12: FtCssVariableFactory.create("--ft-elevation-12", "UNKNOWN", "0px 22px 40px 0px rgba(0, 0, 0, 0.06), 0px 12px 23px 0px rgba(0, 0, 0, 0.14), 0px 10px 11px 0px rgba(0, 0, 0, 0.06)"),
55
- elevation16: FtCssVariableFactory.create("--ft-elevation-16", "UNKNOWN", "0px 28px 52px 0px rgba(0, 0, 0, 0.06), 0px 16px 29px 0px rgba(0, 0, 0, 0.14), 0px 14px 15px 0px rgba(0, 0, 0, 0.06)"),
56
- elevation24: FtCssVariableFactory.create("--ft-elevation-24", "UNKNOWN", "0px 40px 76px 0px rgba(0, 0, 0, 0.06), 0px 24px 41px 0px rgba(0, 0, 0, 0.14), 0px 22px 23px 0px rgba(0, 0, 0, 0.06)"),
57
- borderRadiusS: FtCssVariableFactory.create("--ft-border-radius-S", "SIZE", "4px"),
58
- borderRadiusM: FtCssVariableFactory.create("--ft-border-radius-M", "SIZE", "8px"),
59
- borderRadiusL: FtCssVariableFactory.create("--ft-border-radius-L", "SIZE", "12px"),
60
- borderRadiusXL: FtCssVariableFactory.create("--ft-border-radius-XL", "SIZE", "16px"),
61
- titleFont: FtCssVariableFactory.create("--ft-title-font", "UNKNOWN", "Ubuntu, system-ui, sans-serif"),
62
- contentFont: FtCssVariableFactory.create("--ft-content-font", "UNKNOWN", "'Open Sans', system-ui, sans-serif"),
63
- transitionDuration: FtCssVariableFactory.create("--ft-transition-duration", "UNKNOWN", "250ms"),
64
- transitionTimingFunction: FtCssVariableFactory.create("--ft-transition-timing-function", "UNKNOWN", "ease-in-out"),
3
+ colorPrimary: FtCssVariableFactory.create("--ft-color-primary", "", "COLOR", "#2196F3"),
4
+ colorPrimaryVariant: FtCssVariableFactory.create("--ft-color-primary-variant", "", "COLOR", "#1976D2"),
5
+ colorSecondary: FtCssVariableFactory.create("--ft-color-secondary", "", "COLOR", "#FFCC80"),
6
+ colorSecondaryVariant: FtCssVariableFactory.create("--ft-color-secondary-variant", "", "COLOR", "#F57C00"),
7
+ colorSurface: FtCssVariableFactory.create("--ft-color-surface", "", "COLOR", "#FFFFFF"),
8
+ colorContent: FtCssVariableFactory.create("--ft-color-content", "", "COLOR", "rgba(0, 0, 0, 0.87)"),
9
+ colorError: FtCssVariableFactory.create("--ft-color-error", "", "COLOR", "#B00020"),
10
+ colorOutline: FtCssVariableFactory.create("--ft-color-outline", "", "COLOR", "rgba(0, 0, 0, 0.14)"),
11
+ colorOpacityHigh: FtCssVariableFactory.create("--ft-color-opacity-high", "", "NUMBER", "1"),
12
+ colorOpacityMedium: FtCssVariableFactory.create("--ft-color-opacity-medium", "", "NUMBER", "0.74"),
13
+ colorOpacityDisabled: FtCssVariableFactory.create("--ft-color-opacity-disabled", "", "NUMBER", "0.38"),
14
+ colorOnPrimary: FtCssVariableFactory.create("--ft-color-on-primary", "", "COLOR", "#FFFFFF"),
15
+ colorOnPrimaryHigh: FtCssVariableFactory.create("--ft-color-on-primary-high", "", "COLOR", "#FFFFFF"),
16
+ colorOnPrimaryMedium: FtCssVariableFactory.create("--ft-color-on-primary-medium", "", "COLOR", "rgba(255, 255, 255, 0.74)"),
17
+ colorOnPrimaryDisabled: FtCssVariableFactory.create("--ft-color-on-primary-disabled", "", "COLOR", "rgba(255, 255, 255, 0.38)"),
18
+ colorOnSecondary: FtCssVariableFactory.create("--ft-color-on-secondary", "", "COLOR", "#FFFFFF"),
19
+ colorOnSecondaryHigh: FtCssVariableFactory.create("--ft-color-on-secondary-high", "", "COLOR", "#FFFFFF"),
20
+ colorOnSecondaryMedium: FtCssVariableFactory.create("--ft-color-on-secondary-medium", "", "COLOR", "rgba(255, 255, 255, 0.74)"),
21
+ colorOnSecondaryDisabled: FtCssVariableFactory.create("--ft-color-on-secondary-disabled", "", "COLOR", "rgba(255, 255, 255, 0.38)"),
22
+ colorOnSurface: FtCssVariableFactory.create("--ft-color-on-surface", "", "COLOR", "rgba(0, 0, 0, 0.87)"),
23
+ colorOnSurfaceHigh: FtCssVariableFactory.create("--ft-color-on-surface-high", "", "COLOR", "rgba(0, 0, 0, 0.87)"),
24
+ colorOnSurfaceMedium: FtCssVariableFactory.create("--ft-color-on-surface-medium", "", "COLOR", "rgba(0, 0, 0, 0.60)"),
25
+ colorOnSurfaceDisabled: FtCssVariableFactory.create("--ft-color-on-surface-disabled", "", "COLOR", "rgba(0, 0, 0, 0.38)"),
26
+ opacityContentOnSurfaceDisabled: FtCssVariableFactory.create("--ft-opacity-content-on-surface-disabled", "", "NUMBER", "0"),
27
+ opacityContentOnSurfaceEnable: FtCssVariableFactory.create("--ft-opacity-content-on-surface-enable", "", "NUMBER", "0"),
28
+ opacityContentOnSurfaceHover: FtCssVariableFactory.create("--ft-opacity-content-on-surface-hover", "", "NUMBER", "0.04"),
29
+ opacityContentOnSurfaceFocused: FtCssVariableFactory.create("--ft-opacity-content-on-surface-focused", "", "NUMBER", "0.12"),
30
+ opacityContentOnSurfacePressed: FtCssVariableFactory.create("--ft-opacity-content-on-surface-pressed", "", "NUMBER", "0.10"),
31
+ opacityContentOnSurfaceSelected: FtCssVariableFactory.create("--ft-opacity-content-on-surface-selected", "", "NUMBER", "0.08"),
32
+ opacityContentOnSurfaceDragged: FtCssVariableFactory.create("--ft-opacity-content-on-surface-dragged", "", "NUMBER", "0.08"),
33
+ opacityPrimaryOnSurfaceDisabled: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-disabled", "", "NUMBER", "0"),
34
+ opacityPrimaryOnSurfaceEnable: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-enable", "", "NUMBER", "0"),
35
+ opacityPrimaryOnSurfaceHover: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-hover", "", "NUMBER", "0.04"),
36
+ opacityPrimaryOnSurfaceFocused: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-focused", "", "NUMBER", "0.12"),
37
+ opacityPrimaryOnSurfacePressed: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-pressed", "", "NUMBER", "0.10"),
38
+ opacityPrimaryOnSurfaceSelected: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-selected", "", "NUMBER", "0.08"),
39
+ opacityPrimaryOnSurfaceDragged: FtCssVariableFactory.create("--ft-opacity-primary-on-surface-dragged", "", "NUMBER", "0.08"),
40
+ opacitySurfaceOnPrimaryDisabled: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-disabled", "", "NUMBER", "0"),
41
+ opacitySurfaceOnPrimaryEnable: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-enable", "", "NUMBER", "0"),
42
+ opacitySurfaceOnPrimaryHover: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-hover", "", "NUMBER", "0.04"),
43
+ opacitySurfaceOnPrimaryFocused: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-focused", "", "NUMBER", "0.12"),
44
+ opacitySurfaceOnPrimaryPressed: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-pressed", "", "NUMBER", "0.10"),
45
+ opacitySurfaceOnPrimarySelected: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-selected", "", "NUMBER", "0.08"),
46
+ opacitySurfaceOnPrimaryDragged: FtCssVariableFactory.create("--ft-opacity-surface-on-primary-dragged", "", "NUMBER", "0.08"),
47
+ elevation00: FtCssVariableFactory.create("--ft-elevation-00", "", "UNKNOWN", "0px 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px 0px rgba(0, 0, 0, 0), 0px 0px 0px 0px rgba(0, 0, 0, 0)"),
48
+ elevation01: FtCssVariableFactory.create("--ft-elevation-01", "", "UNKNOWN", "0px 1px 4px 0px rgba(0, 0, 0, 0.06), 0px 1px 2px 0px rgba(0, 0, 0, 0.14), 0px 0px 1px 0px rgba(0, 0, 0, 0.06)"),
49
+ elevation02: FtCssVariableFactory.create("--ft-elevation-02", "", "UNKNOWN", "0px 4px 10px 0px rgba(0, 0, 0, 0.06), 0px 2px 5px 0px rgba(0, 0, 0, 0.14), 0px 0px 1px 0px rgba(0, 0, 0, 0.06)"),
50
+ elevation03: FtCssVariableFactory.create("--ft-elevation-03", "", "UNKNOWN", "0px 6px 13px 0px rgba(0, 0, 0, 0.06), 0px 3px 7px 0px rgba(0, 0, 0, 0.14), 0px 1px 2px 0px rgba(0, 0, 0, 0.06)"),
51
+ elevation04: FtCssVariableFactory.create("--ft-elevation-04", "", "UNKNOWN", "0px 8px 16px 0px rgba(0, 0, 0, 0.06), 0px 4px 9px 0px rgba(0, 0, 0, 0.14), 0px 2px 3px 0px rgba(0, 0, 0, 0.06)"),
52
+ elevation06: FtCssVariableFactory.create("--ft-elevation-06", "", "UNKNOWN", "0px 12px 22px 0px rgba(0, 0, 0, 0.06), 0px 6px 13px 0px rgba(0, 0, 0, 0.14), 0px 4px 5px 0px rgba(0, 0, 0, 0.06)"),
53
+ elevation08: FtCssVariableFactory.create("--ft-elevation-08", "", "UNKNOWN", "0px 16px 28px 0px rgba(0, 0, 0, 0.06), 0px 8px 17px 0px rgba(0, 0, 0, 0.14), 0px 6px 7px 0px rgba(0, 0, 0, 0.06)"),
54
+ elevation12: FtCssVariableFactory.create("--ft-elevation-12", "", "UNKNOWN", "0px 22px 40px 0px rgba(0, 0, 0, 0.06), 0px 12px 23px 0px rgba(0, 0, 0, 0.14), 0px 10px 11px 0px rgba(0, 0, 0, 0.06)"),
55
+ elevation16: FtCssVariableFactory.create("--ft-elevation-16", "", "UNKNOWN", "0px 28px 52px 0px rgba(0, 0, 0, 0.06), 0px 16px 29px 0px rgba(0, 0, 0, 0.14), 0px 14px 15px 0px rgba(0, 0, 0, 0.06)"),
56
+ elevation24: FtCssVariableFactory.create("--ft-elevation-24", "", "UNKNOWN", "0px 40px 76px 0px rgba(0, 0, 0, 0.06), 0px 24px 41px 0px rgba(0, 0, 0, 0.14), 0px 22px 23px 0px rgba(0, 0, 0, 0.06)"),
57
+ borderRadiusS: FtCssVariableFactory.create("--ft-border-radius-S", "", "SIZE", "4px"),
58
+ borderRadiusM: FtCssVariableFactory.create("--ft-border-radius-M", "", "SIZE", "8px"),
59
+ borderRadiusL: FtCssVariableFactory.create("--ft-border-radius-L", "", "SIZE", "12px"),
60
+ borderRadiusXL: FtCssVariableFactory.create("--ft-border-radius-XL", "", "SIZE", "16px"),
61
+ titleFont: FtCssVariableFactory.create("--ft-title-font", "", "UNKNOWN", "Ubuntu, system-ui, sans-serif"),
62
+ contentFont: FtCssVariableFactory.create("--ft-content-font", "", "UNKNOWN", "'Open Sans', system-ui, sans-serif"),
63
+ transitionDuration: FtCssVariableFactory.create("--ft-transition-duration", "", "UNKNOWN", "250ms"),
64
+ transitionTimingFunction: FtCssVariableFactory.create("--ft-transition-timing-function", "", "UNKNOWN", "ease-in-out"),
65
65
  };