@workday/canvas-kit-labs-react 14.0.0-alpha.1196-next.0 → 14.0.0-alpha.1199-next.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/dist/commonjs/ai-assistant-ingress-button/lib/AIAssistantIngressButton.d.ts +4 -4
- package/dist/commonjs/ai-assistant-ingress-button/lib/AIAssistantIngressButton.js +5 -5
- package/dist/commonjs/search-form/lib/SearchForm.d.ts +5 -5
- package/dist/commonjs/search-form/lib/SearchForm.js +14 -14
- package/dist/es6/ai-assistant-ingress-button/lib/AIAssistantIngressButton.d.ts +4 -4
- package/dist/es6/ai-assistant-ingress-button/lib/AIAssistantIngressButton.js +5 -5
- package/dist/es6/search-form/lib/SearchForm.d.ts +5 -5
- package/dist/es6/search-form/lib/SearchForm.js +14 -14
- package/package.json +5 -5
- package/search-form/lib/SearchForm.tsx +7 -7
|
@@ -173,7 +173,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
173
173
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
174
174
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
175
175
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
176
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
176
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
177
177
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
178
178
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
179
179
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -1115,7 +1115,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
1115
1115
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
1116
1116
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
1117
1117
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
1118
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
1118
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
1119
1119
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
1120
1120
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
1121
1121
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -2045,7 +2045,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
2045
2045
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
2046
2046
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
2047
2047
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
2048
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
2048
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
2049
2049
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
2050
2050
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
2051
2051
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -2973,7 +2973,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
2973
2973
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
2974
2974
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
2975
2975
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
2976
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
2976
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
2977
2977
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
2978
2978
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
2979
2979
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -26,20 +26,20 @@ const glowHappyHour = canvas_tokens_web_1.base.orange400; //'#FD7E00';
|
|
|
26
26
|
const glowThumbtack = canvas_tokens_web_1.base.coral500; //'#FC5B05';
|
|
27
27
|
exports.AIAssistantIngressButtonStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
28
28
|
extends: button_1.buttonStencil,
|
|
29
|
-
base: { name: "
|
|
29
|
+
base: { name: "3iug9", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-sys-color-bg-ai-strongest);border-radius:var(--cnvs-sys-shape-round);height:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x1));width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x1));transition:box-shadow 300ms ease-out, background 300ms ease-out;.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-inverse);}}&:is(:hover, .hover):not(:disabled, .disabled){.wd-icon-ai-assistant-ingress-button{linearGradient > stop:first-child{stop-color:var(--cnvs-base-palette-red-200);}linearGradient > stop:nth-child(2){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(3){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(4){stop-color:var(--cnvs-base-palette-amber-200);}linearGradient > stop:nth-child(5){stop-color:var(--cnvs-base-palette-amber-300);}}}&:disabled, &:disabled:active, &.disabled{opacity:var(--cnvs-sys-opacity-disabled);}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}" },
|
|
30
30
|
modifiers: {
|
|
31
31
|
variant: {
|
|
32
|
-
inverse: { name: "
|
|
32
|
+
inverse: { name: "219pjy", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}}&:is(:hover, .hover):not(:disabled, .disabled){.wd-icon-ai-assistant-ingress-button{linearGradient > stop:first-child{stop-color:var(--cnvs-base-palette-red-200);}linearGradient > stop:nth-child(2){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(3){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(4){stop-color:var(--cnvs-base-palette-amber-200);}linearGradient > stop:nth-child(5){stop-color:var(--cnvs-base-palette-amber-300);}}}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-sys-color-fg-inverse);border:2px solid var(--cnvs-sys-color-border-ai) ;}" }
|
|
33
33
|
},
|
|
34
34
|
toggled: {
|
|
35
|
-
true: { name: "
|
|
36
|
-
false: { name: "
|
|
35
|
+
true: { name: "ojto4", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);transition:box-shadow 300ms ease-out, background 300ms ease-out;box-shadow:0px 0px 4.9px 0px var(--cnvs-base-palette-magenta-200), 0px 0px 0.98px 0px var(--cnvs-base-palette-amber-100), 0px 0px 1.96px 0px var(--cnvs-base-palette-amber-300), 0px 0px 2.94px 0px var(--cnvs-base-palette-amber-300), 0px 0px 4.9px 0px var(--cnvs-base-palette-orange-400), 0px 0px 7.36px 0px var(--cnvs-base-palette-coral-500), 0px 0px 9.81px 0px var(--cnvs-base-palette-magenta-200), 0px 0px 12.26px 0px rgba(255, 194, 253, 0.50);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));border:1px solid var(--cnvs-sys-color-border-container) ;}" },
|
|
36
|
+
false: { name: "4eb0n", styles: "transition:box-shadow 300ms ease-out, background 300ms ease-out;" }
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
compound: [
|
|
40
40
|
{
|
|
41
41
|
modifiers: { toggled: true, variant: 'inverse' },
|
|
42
|
-
styles: { name: "
|
|
42
|
+
styles: { name: "av56u", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-ai-strongest);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-inverse);}}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-sys-color-fg-inverse);border:none;}" }
|
|
43
43
|
}
|
|
44
44
|
]
|
|
45
45
|
}, "a-i-assistant-ingress-button-9a9b1c");
|
|
@@ -205,7 +205,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
205
205
|
paddingInlineEnd: string;
|
|
206
206
|
maxWidth: string;
|
|
207
207
|
minWidth: number;
|
|
208
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
208
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
209
209
|
height: string;
|
|
210
210
|
display?: undefined;
|
|
211
211
|
margin?: undefined;
|
|
@@ -216,7 +216,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
216
216
|
bottom: number;
|
|
217
217
|
margin: number;
|
|
218
218
|
position: "relative";
|
|
219
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
219
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
220
220
|
transition: "background-color 120ms";
|
|
221
221
|
maxWidth: string;
|
|
222
222
|
minWidth: string;
|
|
@@ -232,7 +232,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
232
232
|
paddingInlineEnd: string;
|
|
233
233
|
maxWidth: string;
|
|
234
234
|
minWidth: number;
|
|
235
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
235
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
236
236
|
height: string;
|
|
237
237
|
};
|
|
238
238
|
};
|
|
@@ -387,8 +387,8 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
387
387
|
readonly closeButtonPart: "search-form-close-button";
|
|
388
388
|
}>) => {
|
|
389
389
|
"[data-part=\"search-form-input\"]": {
|
|
390
|
-
background: "--cnvs-sys-color-bg-transparent";
|
|
391
|
-
backgroundFocus: "--cnvs-sys-color-bg-transparent";
|
|
390
|
+
background: "--cnvs-sys-color-bg-transparent-default";
|
|
391
|
+
backgroundFocus: "--cnvs-sys-color-bg-transparent-default";
|
|
392
392
|
color: "--cnvs-sys-color-text-default";
|
|
393
393
|
colorFocus: "--cnvs-sys-color-text-default";
|
|
394
394
|
placeholderColor: "--cnvs-sys-color-text-hint";
|
|
@@ -77,45 +77,45 @@ exports.searchFormStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
|
77
77
|
searchInput: 'search-form-input',
|
|
78
78
|
closeButtonPart: 'search-form-close-button',
|
|
79
79
|
},
|
|
80
|
-
base: { name: "
|
|
80
|
+
base: { name: "a30ih", styles: "box-sizing:border-box;position:relative;flex-grow:1;display:flex;align-items:center;margin-inline-start:var(--cnvs-sys-space-x6);min-width:var(--minWidth-search-form-150181, 7.5rem);max-width:var(--maxWidth-search-form-150181, 30rem);[data-part=\"search-form-container\"]{position:relative;display:flex;align-items:center;width:100%;text-align:left;min-height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));}[data-part=\"search-form-combobox\"]{width:100%;}[data-part=\"search-form-close-button\"]{position:absolute;top:0;bottom:0;right:0;margin:auto var(--cnvs-sys-space-x2);z-index:3;display:none;}[data-part=\"search-form-field\"]{width:100%;height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));max-width:var(--maxWidth-search-form-150181, 30rem);margin-bottom:0;display:inline-block;> div{display:block;}}[data-part=\"search-form-submit-search-icon\"], [data-part=\"search-form-open-search-icon\"]{position:absolute;margin:auto var(--cnvs-sys-space-x2);top:0;bottom:0;left:0;padding:0;z-index:3;:dir(rtl){right:0;left:auto;}}[data-part=\"search-form-input\"]{max-width:var(--maxWidth-search-form-150181);min-width:var(--minWidth-search-form-150181);padding-inline-start:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x2));padding-inline-end:var(--cnvs-sys-space-x10);background-color:var(--background-search-form-150181, var(--cnvs-sys-color-bg-alt-soft));height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));font-size:var(--cnvs-sys-font-size-subtext-large);box-shadow:var(--boxShadow-search-form-150181);color:var(--color-search-form-150181, var(--cnvs-sys-color-text-default));border:none;-webkit-appearance:none;transition:background-color 120ms, color 120ms, box-shadow 200ms, border-color 200ms;z-index:2;width:100%;&::-webkit-search-cancel-button{display:none;}&::placeholder{color:var(--placeholderColor-search-form-150181, var(--cnvs-sys-color-text-hint));}&:placeholder-shown{text-overflow:ellipsis;}&:hover{background-color:var(--backgroundHover-search-form-150181, var(--background-search-form-150181, var(--cnvs-sys-color-bg-alt-default)));}&:is(:focus-visible, .focus):where(:not([disabled])){background:var(--backgroundFocus-search-form-150181, var(--cnvs-sys-color-bg-alt-soft));color:var(--colorFocus-search-form-150181);border-color:var(--cnvs-brand-common-focus-outline);outline:0.125rem solid transparent;box-shadow:var(--boxShadowFocus-search-form-150181, 0 0 0 0px var(--cnvs-sys-color-bg-default), 0 0 0 2px var(--cnvs-brand-common-focus-outline));::placeholder{color:var(--placeholderColorFocus-search-form-150181);}}}" },
|
|
81
81
|
modifiers: {
|
|
82
82
|
isHiddenSubmitSearchIcon: {
|
|
83
|
-
true: { name: "
|
|
83
|
+
true: { name: "rdnee", styles: "[data-part=\"search-form-submit-search-icon\"]{display:none;}" }
|
|
84
84
|
},
|
|
85
85
|
isHiddenOpenSeachIcon: {
|
|
86
|
-
true: { name: "
|
|
86
|
+
true: { name: "3uz5tx", styles: "[data-part=\"search-form-open-search-icon\"]{display:none;}" }
|
|
87
87
|
},
|
|
88
88
|
isCollapsed: {
|
|
89
|
-
true: { name: "
|
|
90
|
-
false: { name: "
|
|
89
|
+
true: { name: "19w8k3", styles: "top:0;right:0;left:0;bottom:0;margin:0;position:relative;background-color:var(--cnvs-sys-color-bg-transparent-default);transition:background-color 120ms;max-width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x2));min-width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x3));overflow:hidden;z-index:1;[data-part=\"search-form-field\"]{display:none;max-width:100%;}[data-part=\"search-form-submit-search-icon\"], [data-part=\"search-form-open-search-icon\"]{margin:auto var(--cnvs-sys-space-x2);}[data-part=\"search-form-input\"]{font-size:20px;padding-inline-start:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x4));padding-inline-end:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x4));max-width:none;min-width:0;background-color:var(--cnvs-sys-color-bg-transparent-default);height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));}" },
|
|
90
|
+
false: { name: "142oqd", styles: "[data-part=\"search-form-field\"]{display:inline-block;}" }
|
|
91
91
|
},
|
|
92
92
|
rightAlign: {
|
|
93
|
-
true: { name: "
|
|
93
|
+
true: { name: "2g3za1", styles: "text-align:right;" }
|
|
94
94
|
},
|
|
95
95
|
showForm: {
|
|
96
|
-
true: { name: "
|
|
97
|
-
false: { name: "
|
|
96
|
+
true: { name: "tgjji", styles: "" },
|
|
97
|
+
false: { name: "3o9ems", styles: "" }
|
|
98
98
|
},
|
|
99
99
|
grow: {
|
|
100
|
-
true: { name: "
|
|
100
|
+
true: { name: "ojpc0", styles: "max-width:100%;[data-part=\"search-form-field\"], [data-part=\"search-form-input\"]{max-width:100%;}" }
|
|
101
101
|
},
|
|
102
102
|
searchTheme: {
|
|
103
103
|
// Light theme
|
|
104
|
-
light: { name: "
|
|
104
|
+
light: { name: "48mi8z", styles: "[data-part=\"search-form-input\"]{background:var(--cnvs-sys-color-bg-alt-soft);color:var(--cnvs-sys-color-text-default);::placeholder{color:var(--cnvs-sys-color-text-hint);}&:hover{background:var(--cnvs-sys-color-bg-alt-default);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-alt-soft);box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse), 0 0 0 2px var(--cnvs-brand-common-focus-outline);}}" },
|
|
105
105
|
// Dark theme
|
|
106
|
-
dark: { name: "
|
|
106
|
+
dark: { name: "43ayo1", styles: "[data-part=\"search-form-input\"]{background-color:rgba(0, 0, 0, 0.2);color:var(--cnvs-sys-color-text-inverse);box-shadow:none;::placeholder{color:var(--cnvs-sys-color-text-inverse);}:hover{background:rgba(0, 0, 0, 0.2);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-default);color:var(--cnvs-sys-color-text-default);::placeholder{color:var(--cnvs-sys-color-text-hint);}box-shadow:none;}}" },
|
|
107
107
|
//Transparent theme
|
|
108
|
-
transparent: { name: "
|
|
108
|
+
transparent: { name: "1r3l0i", styles: "[data-part=\"search-form-input\"]{background:var(--cnvs-sys-color-bg-transparent-default);background-focus:var(--cnvs-sys-color-bg-transparent-default);color:var(--cnvs-sys-color-text-default);color-focus:var(--cnvs-sys-color-text-default);placeholder-color:var(--cnvs-sys-color-text-hint);placeholder-color-focus:var(--cnvs-sys-color-text-hint);box-shadow:none;box-shadow-focus:none;}" }
|
|
109
109
|
}
|
|
110
110
|
},
|
|
111
111
|
compound: [
|
|
112
112
|
{
|
|
113
113
|
modifiers: { showForm: 'true', isCollapsed: 'true' },
|
|
114
|
-
styles: { name: "
|
|
114
|
+
styles: { name: "fwaln", styles: "position:absolute;background-color:var(--cnvs-sys-color-bg-default);max-width:none;overflow:visible;& [data-part=\"search-form-close-button\"]{display:inline-block;}& [data-part=\"search-form-field\"]{display:inline-block;}& [data-part=\"search-form-input\"]{box-shadow:none;background:var(--cnvs-sys-color-bg-transparent-default);:hover{background:var(--cnvs-sys-color-bg-transparent-default);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-transparent-default);box-shadow:none;}}" }
|
|
115
115
|
},
|
|
116
116
|
{
|
|
117
117
|
modifiers: { isCollapsed: 'true', showForm: 'true' },
|
|
118
|
-
styles: { name: "
|
|
118
|
+
styles: { name: "3aaowk", styles: "& [data-part=\"search-form-field\"]{display:inline-block;}" }
|
|
119
119
|
}
|
|
120
120
|
]
|
|
121
121
|
}, "search-form-150181");
|
|
@@ -173,7 +173,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
173
173
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
174
174
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
175
175
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
176
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
176
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
177
177
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
178
178
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
179
179
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -1115,7 +1115,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
1115
1115
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
1116
1116
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
1117
1117
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
1118
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
1118
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
1119
1119
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
1120
1120
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
1121
1121
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -2045,7 +2045,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
2045
2045
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
2046
2046
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
2047
2047
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
2048
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
2048
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
2049
2049
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
2050
2050
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
2051
2051
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -2973,7 +2973,7 @@ export declare const AIAssistantIngressButtonStencil: import("@workday/canvas-ki
|
|
|
2973
2973
|
fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | (import("csstype").Property.FontVariantNumeric | undefined)[] | import("csstype").Property.FontVariantNumeric[] | undefined;
|
|
2974
2974
|
fontVariantPosition?: import("csstype").Property.FontVariantPosition | (import("csstype").Property.FontVariantPosition | undefined)[] | import("csstype").Property.FontVariantPosition[] | undefined;
|
|
2975
2975
|
fontVariationSettings?: import("csstype").Property.FontVariationSettings | (import("csstype").Property.FontVariationSettings | undefined)[] | import("csstype").Property.FontVariationSettings[] | undefined;
|
|
2976
|
-
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | import("csstype").Globals | "normal" | "bolder"
|
|
2976
|
+
fontWeight?: import("csstype").Property.FontWeight | (import("csstype").Property.FontWeight | undefined)[] | ("bold" | "lighter" | import("csstype").Globals | "normal" | "bolder")[] | undefined;
|
|
2977
2977
|
forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | (import("csstype").Property.ForcedColorAdjust | undefined)[] | import("csstype").Property.ForcedColorAdjust[] | undefined;
|
|
2978
2978
|
gridAutoColumns?: (string | (string & {}))[] | import("csstype").Property.GridAutoColumns<string | number> | (import("csstype").Property.GridAutoColumns<string | number> | undefined)[] | undefined;
|
|
2979
2979
|
gridAutoFlow?: import("csstype").Property.GridAutoFlow | (import("csstype").Property.GridAutoFlow | undefined)[] | import("csstype").Property.GridAutoFlow[] | undefined;
|
|
@@ -23,20 +23,20 @@ const glowHappyHour = base.orange400; //'#FD7E00';
|
|
|
23
23
|
const glowThumbtack = base.coral500; //'#FC5B05';
|
|
24
24
|
export const AIAssistantIngressButtonStencil = createStencil({
|
|
25
25
|
extends: buttonStencil,
|
|
26
|
-
base: { name: "
|
|
26
|
+
base: { name: "3iug9", styles: "box-sizing:border-box;--background-button-65cb05:var(--cnvs-sys-color-bg-ai-strongest);border-radius:var(--cnvs-sys-shape-round);height:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x1));width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x1));transition:box-shadow 300ms ease-out, background 300ms ease-out;.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-inverse);}}&:is(:hover, .hover):not(:disabled, .disabled){.wd-icon-ai-assistant-ingress-button{linearGradient > stop:first-child{stop-color:var(--cnvs-base-palette-red-200);}linearGradient > stop:nth-child(2){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(3){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(4){stop-color:var(--cnvs-base-palette-amber-200);}linearGradient > stop:nth-child(5){stop-color:var(--cnvs-base-palette-amber-300);}}}&:disabled, &:disabled:active, &.disabled{opacity:var(--cnvs-sys-opacity-disabled);}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));}" },
|
|
27
27
|
modifiers: {
|
|
28
28
|
variant: {
|
|
29
|
-
inverse: { name: "
|
|
29
|
+
inverse: { name: "219pjy", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}}&:is(:hover, .hover):not(:disabled, .disabled){.wd-icon-ai-assistant-ingress-button{linearGradient > stop:first-child{stop-color:var(--cnvs-base-palette-red-200);}linearGradient > stop:nth-child(2){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(3){stop-color:var(--cnvs-base-palette-orange-200);}linearGradient > stop:nth-child(4){stop-color:var(--cnvs-base-palette-amber-200);}linearGradient > stop:nth-child(5){stop-color:var(--cnvs-base-palette-amber-300);}}}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-sys-color-fg-inverse);border:2px solid var(--cnvs-sys-color-border-ai) ;}" }
|
|
30
30
|
},
|
|
31
31
|
toggled: {
|
|
32
|
-
true: { name: "
|
|
33
|
-
false: { name: "
|
|
32
|
+
true: { name: "ojto4", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-default);transition:box-shadow 300ms ease-out, background 300ms ease-out;box-shadow:0px 0px 4.9px 0px var(--cnvs-base-palette-magenta-200), 0px 0px 0.98px 0px var(--cnvs-base-palette-amber-100), 0px 0px 1.96px 0px var(--cnvs-base-palette-amber-300), 0px 0px 2.94px 0px var(--cnvs-base-palette-amber-300), 0px 0px 4.9px 0px var(--cnvs-base-palette-orange-400), 0px 0px 7.36px 0px var(--cnvs-base-palette-coral-500), 0px 0px 9.81px 0px var(--cnvs-base-palette-magenta-200), 0px 0px 12.26px 0px rgba(255, 194, 253, 0.50);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-ai);}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 4px var(--cnvs-brand-common-focus-outline, rgba(8,117,225,1));border:1px solid var(--cnvs-sys-color-border-container) ;}" },
|
|
33
|
+
false: { name: "4eb0n", styles: "transition:box-shadow 300ms ease-out, background 300ms ease-out;" }
|
|
34
34
|
}
|
|
35
35
|
},
|
|
36
36
|
compound: [
|
|
37
37
|
{
|
|
38
38
|
modifiers: { toggled: true, variant: 'inverse' },
|
|
39
|
-
styles: { name: "
|
|
39
|
+
styles: { name: "av56u", styles: "--background-button-65cb05:var(--cnvs-sys-color-bg-ai-strongest);.wd-icon-ai-assistant-ingress-button{.wd-icon-fill{transition:fill 300ms ease-out;}> linearGradient > stop{transition:300ms ease-out;stop-color:var(--cnvs-sys-color-fg-inverse);}}&:is(:focus-visible, .focus):not(:disabled, .disabled){box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse, rgba(255,255,255,1)), 0 0 0 2px var(--cnvs-sys-color-fg-inverse);border:none;}" }
|
|
40
40
|
}
|
|
41
41
|
]
|
|
42
42
|
}, "a-i-assistant-ingress-button-9a9b1c");
|
|
@@ -205,7 +205,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
205
205
|
paddingInlineEnd: string;
|
|
206
206
|
maxWidth: string;
|
|
207
207
|
minWidth: number;
|
|
208
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
208
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
209
209
|
height: string;
|
|
210
210
|
display?: undefined;
|
|
211
211
|
margin?: undefined;
|
|
@@ -216,7 +216,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
216
216
|
bottom: number;
|
|
217
217
|
margin: number;
|
|
218
218
|
position: "relative";
|
|
219
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
219
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
220
220
|
transition: "background-color 120ms";
|
|
221
221
|
maxWidth: string;
|
|
222
222
|
minWidth: string;
|
|
@@ -232,7 +232,7 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
232
232
|
paddingInlineEnd: string;
|
|
233
233
|
maxWidth: string;
|
|
234
234
|
minWidth: number;
|
|
235
|
-
backgroundColor: "--cnvs-sys-color-bg-transparent";
|
|
235
|
+
backgroundColor: "--cnvs-sys-color-bg-transparent-default";
|
|
236
236
|
height: string;
|
|
237
237
|
};
|
|
238
238
|
};
|
|
@@ -387,8 +387,8 @@ export declare const searchFormStencil: import("@workday/canvas-kit-styling").St
|
|
|
387
387
|
readonly closeButtonPart: "search-form-close-button";
|
|
388
388
|
}>) => {
|
|
389
389
|
"[data-part=\"search-form-input\"]": {
|
|
390
|
-
background: "--cnvs-sys-color-bg-transparent";
|
|
391
|
-
backgroundFocus: "--cnvs-sys-color-bg-transparent";
|
|
390
|
+
background: "--cnvs-sys-color-bg-transparent-default";
|
|
391
|
+
backgroundFocus: "--cnvs-sys-color-bg-transparent-default";
|
|
392
392
|
color: "--cnvs-sys-color-text-default";
|
|
393
393
|
colorFocus: "--cnvs-sys-color-text-default";
|
|
394
394
|
placeholderColor: "--cnvs-sys-color-text-hint";
|
|
@@ -48,45 +48,45 @@ export const searchFormStencil = createStencil({
|
|
|
48
48
|
searchInput: 'search-form-input',
|
|
49
49
|
closeButtonPart: 'search-form-close-button',
|
|
50
50
|
},
|
|
51
|
-
base: { name: "
|
|
51
|
+
base: { name: "a30ih", styles: "box-sizing:border-box;position:relative;flex-grow:1;display:flex;align-items:center;margin-inline-start:var(--cnvs-sys-space-x6);min-width:var(--minWidth-search-form-150181, 7.5rem);max-width:var(--maxWidth-search-form-150181, 30rem);[data-part=\"search-form-container\"]{position:relative;display:flex;align-items:center;width:100%;text-align:left;min-height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));}[data-part=\"search-form-combobox\"]{width:100%;}[data-part=\"search-form-close-button\"]{position:absolute;top:0;bottom:0;right:0;margin:auto var(--cnvs-sys-space-x2);z-index:3;display:none;}[data-part=\"search-form-field\"]{width:100%;height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));max-width:var(--maxWidth-search-form-150181, 30rem);margin-bottom:0;display:inline-block;> div{display:block;}}[data-part=\"search-form-submit-search-icon\"], [data-part=\"search-form-open-search-icon\"]{position:absolute;margin:auto var(--cnvs-sys-space-x2);top:0;bottom:0;left:0;padding:0;z-index:3;:dir(rtl){right:0;left:auto;}}[data-part=\"search-form-input\"]{max-width:var(--maxWidth-search-form-150181);min-width:var(--minWidth-search-form-150181);padding-inline-start:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x2));padding-inline-end:var(--cnvs-sys-space-x10);background-color:var(--background-search-form-150181, var(--cnvs-sys-color-bg-alt-soft));height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));font-size:var(--cnvs-sys-font-size-subtext-large);box-shadow:var(--boxShadow-search-form-150181);color:var(--color-search-form-150181, var(--cnvs-sys-color-text-default));border:none;-webkit-appearance:none;transition:background-color 120ms, color 120ms, box-shadow 200ms, border-color 200ms;z-index:2;width:100%;&::-webkit-search-cancel-button{display:none;}&::placeholder{color:var(--placeholderColor-search-form-150181, var(--cnvs-sys-color-text-hint));}&:placeholder-shown{text-overflow:ellipsis;}&:hover{background-color:var(--backgroundHover-search-form-150181, var(--background-search-form-150181, var(--cnvs-sys-color-bg-alt-default)));}&:is(:focus-visible, .focus):where(:not([disabled])){background:var(--backgroundFocus-search-form-150181, var(--cnvs-sys-color-bg-alt-soft));color:var(--colorFocus-search-form-150181);border-color:var(--cnvs-brand-common-focus-outline);outline:0.125rem solid transparent;box-shadow:var(--boxShadowFocus-search-form-150181, 0 0 0 0px var(--cnvs-sys-color-bg-default), 0 0 0 2px var(--cnvs-brand-common-focus-outline));::placeholder{color:var(--placeholderColorFocus-search-form-150181);}}}" },
|
|
52
52
|
modifiers: {
|
|
53
53
|
isHiddenSubmitSearchIcon: {
|
|
54
|
-
true: { name: "
|
|
54
|
+
true: { name: "rdnee", styles: "[data-part=\"search-form-submit-search-icon\"]{display:none;}" }
|
|
55
55
|
},
|
|
56
56
|
isHiddenOpenSeachIcon: {
|
|
57
|
-
true: { name: "
|
|
57
|
+
true: { name: "3uz5tx", styles: "[data-part=\"search-form-open-search-icon\"]{display:none;}" }
|
|
58
58
|
},
|
|
59
59
|
isCollapsed: {
|
|
60
|
-
true: { name: "
|
|
61
|
-
false: { name: "
|
|
60
|
+
true: { name: "19w8k3", styles: "top:0;right:0;left:0;bottom:0;margin:0;position:relative;background-color:var(--cnvs-sys-color-bg-transparent-default);transition:background-color 120ms;max-width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x2));min-width:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x3));overflow:hidden;z-index:1;[data-part=\"search-form-field\"]{display:none;max-width:100%;}[data-part=\"search-form-submit-search-icon\"], [data-part=\"search-form-open-search-icon\"]{margin:auto var(--cnvs-sys-space-x2);}[data-part=\"search-form-input\"]{font-size:20px;padding-inline-start:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x4));padding-inline-end:calc(var(--cnvs-sys-space-x10) + var(--cnvs-sys-space-x4));max-width:none;min-width:0;background-color:var(--cnvs-sys-color-bg-transparent-default);height:var(--height-search-form-150181, var(--cnvs-sys-space-x10));}" },
|
|
61
|
+
false: { name: "142oqd", styles: "[data-part=\"search-form-field\"]{display:inline-block;}" }
|
|
62
62
|
},
|
|
63
63
|
rightAlign: {
|
|
64
|
-
true: { name: "
|
|
64
|
+
true: { name: "2g3za1", styles: "text-align:right;" }
|
|
65
65
|
},
|
|
66
66
|
showForm: {
|
|
67
|
-
true: { name: "
|
|
68
|
-
false: { name: "
|
|
67
|
+
true: { name: "tgjji", styles: "" },
|
|
68
|
+
false: { name: "3o9ems", styles: "" }
|
|
69
69
|
},
|
|
70
70
|
grow: {
|
|
71
|
-
true: { name: "
|
|
71
|
+
true: { name: "ojpc0", styles: "max-width:100%;[data-part=\"search-form-field\"], [data-part=\"search-form-input\"]{max-width:100%;}" }
|
|
72
72
|
},
|
|
73
73
|
searchTheme: {
|
|
74
74
|
// Light theme
|
|
75
|
-
light: { name: "
|
|
75
|
+
light: { name: "48mi8z", styles: "[data-part=\"search-form-input\"]{background:var(--cnvs-sys-color-bg-alt-soft);color:var(--cnvs-sys-color-text-default);::placeholder{color:var(--cnvs-sys-color-text-hint);}&:hover{background:var(--cnvs-sys-color-bg-alt-default);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-alt-soft);box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse), 0 0 0 2px var(--cnvs-brand-common-focus-outline);}}" },
|
|
76
76
|
// Dark theme
|
|
77
|
-
dark: { name: "
|
|
77
|
+
dark: { name: "43ayo1", styles: "[data-part=\"search-form-input\"]{background-color:rgba(0, 0, 0, 0.2);color:var(--cnvs-sys-color-text-inverse);box-shadow:none;::placeholder{color:var(--cnvs-sys-color-text-inverse);}:hover{background:rgba(0, 0, 0, 0.2);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-default);color:var(--cnvs-sys-color-text-default);::placeholder{color:var(--cnvs-sys-color-text-hint);}box-shadow:none;}}" },
|
|
78
78
|
//Transparent theme
|
|
79
|
-
transparent: { name: "
|
|
79
|
+
transparent: { name: "1r3l0i", styles: "[data-part=\"search-form-input\"]{background:var(--cnvs-sys-color-bg-transparent-default);background-focus:var(--cnvs-sys-color-bg-transparent-default);color:var(--cnvs-sys-color-text-default);color-focus:var(--cnvs-sys-color-text-default);placeholder-color:var(--cnvs-sys-color-text-hint);placeholder-color-focus:var(--cnvs-sys-color-text-hint);box-shadow:none;box-shadow-focus:none;}" }
|
|
80
80
|
}
|
|
81
81
|
},
|
|
82
82
|
compound: [
|
|
83
83
|
{
|
|
84
84
|
modifiers: { showForm: 'true', isCollapsed: 'true' },
|
|
85
|
-
styles: { name: "
|
|
85
|
+
styles: { name: "fwaln", styles: "position:absolute;background-color:var(--cnvs-sys-color-bg-default);max-width:none;overflow:visible;& [data-part=\"search-form-close-button\"]{display:inline-block;}& [data-part=\"search-form-field\"]{display:inline-block;}& [data-part=\"search-form-input\"]{box-shadow:none;background:var(--cnvs-sys-color-bg-transparent-default);:hover{background:var(--cnvs-sys-color-bg-transparent-default);}&:is(:focus-visible, &.focus):where(:not([disabled])){background:var(--cnvs-sys-color-bg-transparent-default);box-shadow:none;}}" }
|
|
86
86
|
},
|
|
87
87
|
{
|
|
88
88
|
modifiers: { isCollapsed: 'true', showForm: 'true' },
|
|
89
|
-
styles: { name: "
|
|
89
|
+
styles: { name: "3aaowk", styles: "& [data-part=\"search-form-field\"]{display:inline-block;}" }
|
|
90
90
|
}
|
|
91
91
|
]
|
|
92
92
|
}, "search-form-150181");
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@workday/canvas-kit-labs-react",
|
|
3
|
-
"version": "14.0.0-alpha.
|
|
3
|
+
"version": "14.0.0-alpha.1199-next.0",
|
|
4
4
|
"description": "Canvas Kit Labs is an incubator for new and experimental components. Since we have a rather rigorous process for getting components in at a production level, it can be valuable to make them available earlier while we continuously iterate on the API/functionality. The Labs modules allow us to do that as needed.",
|
|
5
5
|
"author": "Workday, Inc. (https://www.workday.com)",
|
|
6
6
|
"license": "Apache-2.0",
|
|
@@ -46,10 +46,10 @@
|
|
|
46
46
|
"dependencies": {
|
|
47
47
|
"@emotion/react": "^11.7.1",
|
|
48
48
|
"@emotion/styled": "^11.6.0",
|
|
49
|
-
"@workday/canvas-kit-react": "^14.0.0-alpha.
|
|
50
|
-
"@workday/canvas-kit-styling": "^14.0.0-alpha.
|
|
49
|
+
"@workday/canvas-kit-react": "^14.0.0-alpha.1199-next.0",
|
|
50
|
+
"@workday/canvas-kit-styling": "^14.0.0-alpha.1199-next.0",
|
|
51
51
|
"@workday/canvas-system-icons-web": "^3.0.35",
|
|
52
|
-
"@workday/canvas-tokens-web": "3.0.0-alpha.
|
|
52
|
+
"@workday/canvas-tokens-web": "3.0.0-alpha.12",
|
|
53
53
|
"@workday/design-assets-types": "^0.2.10",
|
|
54
54
|
"chroma-js": "^2.2.0",
|
|
55
55
|
"lodash.flatten": "^4.4.0",
|
|
@@ -58,5 +58,5 @@
|
|
|
58
58
|
"devDependencies": {
|
|
59
59
|
"@types/lodash.flatten": "^4.4.6"
|
|
60
60
|
},
|
|
61
|
-
"gitHead": "
|
|
61
|
+
"gitHead": "4bd041e30458c4039340481ed19ea4467f277437"
|
|
62
62
|
}
|
|
@@ -291,7 +291,7 @@ export const searchFormStencil = createStencil({
|
|
|
291
291
|
bottom: 0,
|
|
292
292
|
margin: 0,
|
|
293
293
|
position: 'relative',
|
|
294
|
-
backgroundColor: system.color.bg.transparent,
|
|
294
|
+
backgroundColor: system.color.bg.transparent.default,
|
|
295
295
|
transition: 'background-color 120ms',
|
|
296
296
|
maxWidth: calc.add(system.space.x10, system.space.x2),
|
|
297
297
|
minWidth: calc.add(system.space.x10, system.space.x3),
|
|
@@ -310,7 +310,7 @@ export const searchFormStencil = createStencil({
|
|
|
310
310
|
paddingInlineEnd: calc.add(system.space.x10, system.space.x4),
|
|
311
311
|
maxWidth: 'none',
|
|
312
312
|
minWidth: 0,
|
|
313
|
-
backgroundColor: system.color.bg.transparent,
|
|
313
|
+
backgroundColor: system.color.bg.transparent.default,
|
|
314
314
|
height: cssVar(height, system.space.x10),
|
|
315
315
|
},
|
|
316
316
|
}),
|
|
@@ -383,8 +383,8 @@ export const searchFormStencil = createStencil({
|
|
|
383
383
|
//Transparent theme
|
|
384
384
|
transparent: ({searchInputPart}) => ({
|
|
385
385
|
[searchInputPart]: {
|
|
386
|
-
background: system.color.bg.transparent,
|
|
387
|
-
backgroundFocus: system.color.bg.transparent,
|
|
386
|
+
background: system.color.bg.transparent.default,
|
|
387
|
+
backgroundFocus: system.color.bg.transparent.default,
|
|
388
388
|
color: system.color.text.default,
|
|
389
389
|
colorFocus: system.color.text.default,
|
|
390
390
|
placeholderColor: system.color.text.hint,
|
|
@@ -411,13 +411,13 @@ export const searchFormStencil = createStencil({
|
|
|
411
411
|
},
|
|
412
412
|
'& [data-part="search-form-input"]': {
|
|
413
413
|
boxShadow: 'none',
|
|
414
|
-
background: system.color.bg.transparent,
|
|
414
|
+
background: system.color.bg.transparent.default,
|
|
415
415
|
':hover': {
|
|
416
|
-
background: system.color.bg.transparent,
|
|
416
|
+
background: system.color.bg.transparent.default,
|
|
417
417
|
},
|
|
418
418
|
|
|
419
419
|
'&:is(:focus-visible, &.focus):where(:not([disabled]))': {
|
|
420
|
-
background: system.color.bg.transparent,
|
|
420
|
+
background: system.color.bg.transparent.default,
|
|
421
421
|
boxShadow: 'none',
|
|
422
422
|
},
|
|
423
423
|
},
|