@workday/canvas-kit-preview-react 12.4.19 → 12.4.21
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/divider/lib/Divider.js +1 -1
- package/dist/commonjs/information-highlight/lib/InformationHighlight.js +7 -7
- package/dist/commonjs/information-highlight/lib/parts/Body.js +1 -1
- package/dist/commonjs/information-highlight/lib/parts/Heading.js +1 -1
- package/dist/commonjs/information-highlight/lib/parts/Link.js +1 -1
- package/dist/commonjs/loading-sparkles/lib/LoadingSparkles.js +3 -3
- package/dist/commonjs/multi-select/lib/MultiSelect.d.ts +140 -140
- package/dist/commonjs/multi-select/lib/MultiSelectCard.d.ts +16 -16
- package/dist/commonjs/multi-select/lib/MultiSelectInput.d.ts +24 -24
- package/dist/commonjs/multi-select/lib/MultiSelectInput.js +1 -1
- package/dist/commonjs/multi-select/lib/MultiSelectItem.d.ts +20 -20
- package/dist/commonjs/multi-select/lib/MultiSelectedItem.d.ts +16 -16
- package/dist/commonjs/multi-select/lib/MultiSelectedList.d.ts +8 -8
- package/dist/commonjs/multi-select/lib/useMultiSelectItemRemove.d.ts +8 -8
- package/dist/commonjs/multi-select/lib/useMultiSelectModel.d.ts +118 -118
- package/dist/commonjs/radio/lib/RadioGroup.js +3 -3
- package/dist/commonjs/radio/lib/RadioLabel.js +1 -1
- package/dist/commonjs/radio/lib/RadioText.js +4 -4
- package/dist/commonjs/radio/lib/StyledRadioButton.js +5 -5
- package/dist/commonjs/segmented-control/lib/SegmentedControl.d.ts +92 -92
- package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts +4 -4
- package/dist/commonjs/segmented-control/lib/SegmentedControlItem.d.ts.map +1 -1
- package/dist/commonjs/segmented-control/lib/SegmentedControlList.d.ts +8 -8
- package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +4 -4
- package/dist/commonjs/segmented-control/lib/hooks/useSegmentedControlModel.d.ts +94 -94
- package/dist/commonjs/status-indicator/lib/StatusIndicator.js +13 -13
- package/dist/commonjs/status-indicator/lib/StatusIndicatorLabel.js +1 -1
- package/dist/es6/divider/lib/Divider.js +1 -1
- package/dist/es6/information-highlight/lib/InformationHighlight.js +7 -7
- package/dist/es6/information-highlight/lib/parts/Body.js +1 -1
- package/dist/es6/information-highlight/lib/parts/Heading.js +1 -1
- package/dist/es6/information-highlight/lib/parts/Link.js +1 -1
- package/dist/es6/loading-sparkles/lib/LoadingSparkles.js +3 -3
- package/dist/es6/multi-select/lib/MultiSelect.d.ts +140 -140
- package/dist/es6/multi-select/lib/MultiSelectCard.d.ts +16 -16
- package/dist/es6/multi-select/lib/MultiSelectInput.d.ts +24 -24
- package/dist/es6/multi-select/lib/MultiSelectInput.js +1 -1
- package/dist/es6/multi-select/lib/MultiSelectItem.d.ts +20 -20
- package/dist/es6/multi-select/lib/MultiSelectedItem.d.ts +16 -16
- package/dist/es6/multi-select/lib/MultiSelectedList.d.ts +8 -8
- package/dist/es6/multi-select/lib/useMultiSelectItemRemove.d.ts +8 -8
- package/dist/es6/multi-select/lib/useMultiSelectModel.d.ts +118 -118
- package/dist/es6/radio/lib/RadioGroup.js +3 -3
- package/dist/es6/radio/lib/RadioLabel.js +1 -1
- package/dist/es6/radio/lib/RadioText.js +4 -4
- package/dist/es6/radio/lib/StyledRadioButton.js +5 -5
- package/dist/es6/segmented-control/lib/SegmentedControl.d.ts +92 -92
- package/dist/es6/segmented-control/lib/SegmentedControlItem.d.ts +4 -4
- package/dist/es6/segmented-control/lib/SegmentedControlItem.d.ts.map +1 -1
- package/dist/es6/segmented-control/lib/SegmentedControlList.d.ts +8 -8
- package/dist/es6/segmented-control/lib/hooks/useSegmentedControlItem.d.ts +4 -4
- package/dist/es6/segmented-control/lib/hooks/useSegmentedControlModel.d.ts +94 -94
- package/dist/es6/status-indicator/lib/StatusIndicator.js +13 -13
- package/dist/es6/status-indicator/lib/StatusIndicatorLabel.js +1 -1
- package/package.json +4 -4
|
@@ -16,11 +16,11 @@ const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
|
16
16
|
* Styles for RadioGroup
|
|
17
17
|
*/
|
|
18
18
|
const radioGroupStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
19
|
-
base: { name: "
|
|
19
|
+
base: { name: "tbfrw", styles: "box-sizing:border-box;display:flex;flex-direction:column;border-radius:var(--cnvs-sys-shape-x1);gap:var(--cnvs-sys-space-x2);padding:0.625rem var(--cnvs-sys-space-x3) var(--cnvs-sys-space-x2);margin:0 calc(var(--cnvs-sys-space-x3) * -1);transition:100ms box-shadow;width:fit-content;" },
|
|
20
20
|
modifiers: {
|
|
21
21
|
error: {
|
|
22
|
-
error: { name: "
|
|
23
|
-
alert: { name: "
|
|
22
|
+
error: { name: "tbfrx", styles: "box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-error-base);" },
|
|
23
|
+
alert: { name: "tbfry", styles: "box-shadow:inset 0 0 0 0.0625rem var(--cnvs-brand-alert-darkest), inset 0 0 0 0.1875rem var(--cnvs-brand-alert-base);" }
|
|
24
24
|
}
|
|
25
25
|
}
|
|
26
26
|
}, "radio-group-ce2b62");
|
|
@@ -13,7 +13,7 @@ const RadioText_1 = require("./RadioText");
|
|
|
13
13
|
const canvas_kit_styling_1 = require("@workday/canvas-kit-styling");
|
|
14
14
|
const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
15
15
|
const radioLabelStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
16
|
-
base: { name: "
|
|
16
|
+
base: { name: "tbfrv", styles: "box-sizing:border-box;align-items:flex-start;min-height:var(--cnvs-sys-space-x6);position:relative;gap:var(--cnvs-sys-space-x3);" }
|
|
17
17
|
}, "radio-label-0cca27");
|
|
18
18
|
exports.RadioLabelContext = react_1.default.createContext({});
|
|
19
19
|
exports.RadioLabel = (0, common_1.createSubcomponent)('label')({
|
|
@@ -14,19 +14,19 @@ const canvas_tokens_web_1 = require("@workday/canvas-tokens-web");
|
|
|
14
14
|
const layout_1 = require("@workday/canvas-kit-react/layout");
|
|
15
15
|
const radioTextStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
16
16
|
extends: text_1.textStencil,
|
|
17
|
-
base: { name: "
|
|
17
|
+
base: { name: "tbfrr", styles: "box-sizing:border-box;cursor:pointer;" },
|
|
18
18
|
modifiers: {
|
|
19
19
|
variant: {
|
|
20
|
-
inverse: { name: "
|
|
20
|
+
inverse: { name: "tbfrs", styles: "color:var(--cnvs-sys-color-text-inverse);" }
|
|
21
21
|
},
|
|
22
22
|
disabled: {
|
|
23
|
-
true: { name: "
|
|
23
|
+
true: { name: "tbfrt", styles: "cursor:default;color:var(--cnvs-sys-color-text-disabled);" }
|
|
24
24
|
}
|
|
25
25
|
},
|
|
26
26
|
compound: [
|
|
27
27
|
{
|
|
28
28
|
modifiers: { variant: 'inverse', disabled: true },
|
|
29
|
-
styles: { name: "
|
|
29
|
+
styles: { name: "tbfru", styles: "color:var(--cnvs-sys-color-text-inverse);opacity:var(--cnvs-sys-opacity-disabled);" }
|
|
30
30
|
}
|
|
31
31
|
],
|
|
32
32
|
defaultModifiers: {
|
|
@@ -13,10 +13,10 @@ const RadioLabel_1 = require("./RadioLabel");
|
|
|
13
13
|
const radioWidth = 18;
|
|
14
14
|
const radioHeight = 18;
|
|
15
15
|
const radioInputStencil = (0, canvas_kit_styling_1.createStencil)({
|
|
16
|
-
base: { name: "
|
|
16
|
+
base: { name: "tbfr6", styles: "box-sizing:border-box;cursor:pointer;height:1.125rem;width:1.125rem;border-radius:var(--cnvs-sys-shape-round);position:absolute;margin:var(--cnvs-sys-space-zero);&:focus-visible, &.focus, &:active{outline:transparent;}&:disabled, &.disabled{cursor:auto;+ .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-disabled);background-color:var(--cnvs-sys-color-bg-alt-softer);}&:hover + .cnvs-radio-check, &.hover + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-disabled);}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-brand-primary-accent);border:0.3125rem solid var(--cnvs-brand-primary-base);}}+ .cnvs-radio-check{display:flex;flex-direction:column;align-items:center;background-color:var(--cnvs-sys-color-bg-default);border-radius:var(--cnvs-sys-shape-round);box-sizing:border-box;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);height:1.125rem;width:1.125rem;justify-content:center;pointer-events:none;position:absolute;transition:border 200ms ease, background 200ms;opacity:var(--cnvs-sys-opacity-full);}&:hover + .cnvs-radio-check, &.hover + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-strong);}&:focus-visible + .cnvs-radio-check, &.focus + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-primary-default);box-shadow:0 0 0 0px var(--cnvs-sys-color-border-inverse), 0 0 0 1px var(--cnvs-brand-common-focus-outline);}&:focus-visible:hover + .cnvs-radio-check, &.focus:hover + .cnvs-radio-check{outline:transparent;}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-brand-primary-accent);border:0.3125rem solid var(--cnvs-brand-primary-base);}&:focus-visible:checked + .cnvs-radio-check, &:focus-visible:hover:checked + .cnvs-radio-check, &.focus:checked + .cnvs-radio-check, &.focus:hover:checked + .cnvs-radio-check{outline:transparent;box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse), 0 0 0 4px var(--cnvs-brand-common-focus-outline);}" },
|
|
17
17
|
modifiers: {
|
|
18
18
|
variant: {
|
|
19
|
-
inverse: { name: "
|
|
19
|
+
inverse: { name: "tbfr7", styles: "+ .cnvs-radio-check{background-color:var(--cnvs-sys-color-bg-alt-softer);border-color:var(--cnvs-sys-color-border-input-inverse);}&:disabled, &.disabled{opacity:var(--cnvs-sys-opacity-disabled);+ .cnvs-radio-check{background-color:var(--cnvs-sys-color-bg-alt-softer);border-color:var(--cnvs-sys-color-border-input-disabled);opacity:var(--cnvs-sys-opacity-disabled);}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-brand-primary-base);border-color:var(--cnvs-sys-color-border-inverse);}}&:hover + .cnvs-radio-check, &.hover + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-inverse);}&:focus-visible + .cnvs-radio-check, &.focus + .cnvs-radio-check{border-color:var(--cnvs-sys-color-border-input-inverse);}&:checked + .cnvs-radio-check, &.checked + .cnvs-radio-check{background-color:var(--cnvs-brand-primary-base);border-color:var(--cnvs-sys-color-border-inverse);}&:focus-visible + .cnvs-radio-check, &:focus-visible:hover + .cnvs-radio-check, &.focus + .cnvs-radio-check, &.focus:hover + .cnvs-radio-check{box-shadow:0 0 0 0px var(--cnvs-sys-color-border-contrast-default), 0 0 0 2px var(--cnvs-sys-color-border-inverse);}&:focus-visible:checked + .cnvs-radio-check, &:focus-visible:hover:checked + .cnvs-radio-check, &.focus:checked + .cnvs-radio-check, &.focus:hover:checked + .cnvs-radio-check{box-shadow:0 0 0 2px var(--cnvs-sys-color-border-contrast-default), 0 0 0 4px var(--cnvs-sys-color-border-inverse);}" }
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
}, "radio-input-f05aaa");
|
|
@@ -27,13 +27,13 @@ const StyledRadioInput = (0, common_1.createComponent)('input')({
|
|
|
27
27
|
},
|
|
28
28
|
});
|
|
29
29
|
const radioInputWrapperStyles = (0, canvas_kit_styling_1.createStencil)({
|
|
30
|
-
base: { name: "
|
|
30
|
+
base: { name: "tbfr8", styles: "box-sizing:border-box;height:1.125rem;width:1.125rem;flex:0 0 auto;::before{content:'';position:absolute;border-radius:var(--cnvs-sys-shape-round);height:1.125rem;transition:box-shadow 150ms ease-out;width:1.125rem;pointer-events:none;opacity:var(--cnvs-sys-opacity-full);}&:hover:before, &.hover:before{box-shadow:0 0 0 calc(var(--cnvs-sys-space-x2) - 0.0625rem) var(--cnvs-sys-color-bg-alt-soft);}" },
|
|
31
31
|
modifiers: {
|
|
32
32
|
variant: {
|
|
33
|
-
inverse: { name: "
|
|
33
|
+
inverse: { name: "tbfr9", styles: "::before{opacity:var(--cnvs-sys-opacity-disabled);}" }
|
|
34
34
|
},
|
|
35
35
|
disabled: {
|
|
36
|
-
true: { name: "
|
|
36
|
+
true: { name: "tbfra", styles: "&:hover:before, &.hover:before{box-shadow:none;cursor:auto;}" }
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
39
|
}, "radio-input-wrapper-styles-fce2c4");
|