@workday/canvas-kit-react 14.1.0-1284-next.0 → 15.0.0-alpha.1283-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/layout/lib/Box.d.ts +0 -1
- package/dist/commonjs/layout/lib/Box.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/Box.js +0 -2
- package/dist/commonjs/layout/lib/utils/background.d.ts +8 -25
- package/dist/commonjs/layout/lib/utils/background.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/background.js +0 -3
- package/dist/commonjs/layout/lib/utils/border/color.d.ts +1 -12
- package/dist/commonjs/layout/lib/utils/border/color.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/color.js +0 -2
- package/dist/commonjs/layout/lib/utils/border/index.d.ts +0 -3
- package/dist/commonjs/layout/lib/utils/border/index.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/index.js +0 -2
- package/dist/commonjs/layout/lib/utils/border/lineStyle.d.ts +6 -24
- package/dist/commonjs/layout/lib/utils/border/lineStyle.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/lineStyle.js +0 -2
- package/dist/commonjs/layout/lib/utils/border/radius.d.ts +6 -15
- package/dist/commonjs/layout/lib/utils/border/radius.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/radius.js +0 -2
- package/dist/commonjs/layout/lib/utils/border/shorthand.d.ts +8 -22
- package/dist/commonjs/layout/lib/utils/border/shorthand.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/shorthand.js +0 -2
- package/dist/commonjs/layout/lib/utils/border/width.d.ts +4 -18
- package/dist/commonjs/layout/lib/utils/border/width.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/border/width.js +0 -2
- package/dist/commonjs/layout/lib/utils/buildStyleFns.d.ts +0 -4
- package/dist/commonjs/layout/lib/utils/buildStyleFns.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/buildStyleFns.js +0 -9
- package/dist/commonjs/layout/lib/utils/color.d.ts +4 -13
- package/dist/commonjs/layout/lib/utils/color.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/color.js +0 -3
- package/dist/commonjs/layout/lib/utils/depth.d.ts +3 -11
- package/dist/commonjs/layout/lib/utils/depth.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/depth.js +0 -3
- package/dist/commonjs/layout/lib/utils/flex.d.ts +11 -32
- package/dist/commonjs/layout/lib/utils/flex.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/flex.js +0 -3
- package/dist/commonjs/layout/lib/utils/flexItem.d.ts +8 -27
- package/dist/commonjs/layout/lib/utils/flexItem.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/flexItem.js +0 -3
- package/dist/commonjs/layout/lib/utils/grid.d.ts +19 -56
- package/dist/commonjs/layout/lib/utils/grid.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/grid.js +0 -3
- package/dist/commonjs/layout/lib/utils/gridItem.d.ts +11 -36
- package/dist/commonjs/layout/lib/utils/gridItem.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/gridItem.js +0 -3
- package/dist/commonjs/layout/lib/utils/layout.d.ts +13 -36
- package/dist/commonjs/layout/lib/utils/layout.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/layout.js +0 -3
- package/dist/commonjs/layout/lib/utils/mergeStyles.d.ts +0 -1
- package/dist/commonjs/layout/lib/utils/mergeStyles.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/mergeStyles.js +0 -1
- package/dist/commonjs/layout/lib/utils/other.d.ts +34 -106
- package/dist/commonjs/layout/lib/utils/other.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/other.js +0 -3
- package/dist/commonjs/layout/lib/utils/position.d.ts +9 -24
- package/dist/commonjs/layout/lib/utils/position.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/position.js +0 -3
- package/dist/commonjs/layout/lib/utils/space.d.ts +19 -42
- package/dist/commonjs/layout/lib/utils/space.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/space.js +0 -3
- package/dist/commonjs/layout/lib/utils/styleProps.d.ts +0 -2
- package/dist/commonjs/layout/lib/utils/styleProps.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/systemProps.d.ts +0 -17
- package/dist/commonjs/layout/lib/utils/systemProps.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/text.d.ts +14 -45
- package/dist/commonjs/layout/lib/utils/text.d.ts.map +1 -1
- package/dist/commonjs/layout/lib/utils/text.js +0 -3
- package/dist/commonjs/text-input/lib/TextInput.js +5 -5
- package/dist/es6/layout/lib/Box.d.ts +0 -1
- package/dist/es6/layout/lib/Box.d.ts.map +1 -1
- package/dist/es6/layout/lib/Box.js +0 -2
- package/dist/es6/layout/lib/utils/background.d.ts +8 -25
- package/dist/es6/layout/lib/utils/background.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/background.js +0 -3
- package/dist/es6/layout/lib/utils/border/color.d.ts +1 -12
- package/dist/es6/layout/lib/utils/border/color.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/color.js +0 -2
- package/dist/es6/layout/lib/utils/border/index.d.ts +0 -3
- package/dist/es6/layout/lib/utils/border/index.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/index.js +0 -2
- package/dist/es6/layout/lib/utils/border/lineStyle.d.ts +6 -24
- package/dist/es6/layout/lib/utils/border/lineStyle.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/lineStyle.js +0 -2
- package/dist/es6/layout/lib/utils/border/radius.d.ts +6 -15
- package/dist/es6/layout/lib/utils/border/radius.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/radius.js +0 -2
- package/dist/es6/layout/lib/utils/border/shorthand.d.ts +8 -22
- package/dist/es6/layout/lib/utils/border/shorthand.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/shorthand.js +0 -2
- package/dist/es6/layout/lib/utils/border/width.d.ts +4 -18
- package/dist/es6/layout/lib/utils/border/width.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/border/width.js +0 -2
- package/dist/es6/layout/lib/utils/buildStyleFns.d.ts +0 -4
- package/dist/es6/layout/lib/utils/buildStyleFns.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/buildStyleFns.js +0 -9
- package/dist/es6/layout/lib/utils/color.d.ts +4 -13
- package/dist/es6/layout/lib/utils/color.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/color.js +0 -3
- package/dist/es6/layout/lib/utils/depth.d.ts +3 -11
- package/dist/es6/layout/lib/utils/depth.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/depth.js +0 -3
- package/dist/es6/layout/lib/utils/flex.d.ts +11 -32
- package/dist/es6/layout/lib/utils/flex.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/flex.js +0 -3
- package/dist/es6/layout/lib/utils/flexItem.d.ts +8 -27
- package/dist/es6/layout/lib/utils/flexItem.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/flexItem.js +0 -3
- package/dist/es6/layout/lib/utils/grid.d.ts +19 -56
- package/dist/es6/layout/lib/utils/grid.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/grid.js +0 -3
- package/dist/es6/layout/lib/utils/gridItem.d.ts +11 -36
- package/dist/es6/layout/lib/utils/gridItem.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/gridItem.js +0 -3
- package/dist/es6/layout/lib/utils/layout.d.ts +13 -36
- package/dist/es6/layout/lib/utils/layout.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/layout.js +0 -3
- package/dist/es6/layout/lib/utils/mergeStyles.d.ts +0 -1
- package/dist/es6/layout/lib/utils/mergeStyles.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/mergeStyles.js +0 -1
- package/dist/es6/layout/lib/utils/other.d.ts +34 -106
- package/dist/es6/layout/lib/utils/other.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/other.js +0 -3
- package/dist/es6/layout/lib/utils/position.d.ts +9 -24
- package/dist/es6/layout/lib/utils/position.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/position.js +0 -3
- package/dist/es6/layout/lib/utils/space.d.ts +19 -42
- package/dist/es6/layout/lib/utils/space.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/space.js +0 -3
- package/dist/es6/layout/lib/utils/styleProps.d.ts +0 -2
- package/dist/es6/layout/lib/utils/styleProps.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/systemProps.d.ts +0 -17
- package/dist/es6/layout/lib/utils/systemProps.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/text.d.ts +14 -45
- package/dist/es6/layout/lib/utils/text.d.ts.map +1 -1
- package/dist/es6/layout/lib/utils/text.js +0 -3
- package/dist/es6/text-input/lib/TextInput.js +5 -5
- package/layout/lib/Box.tsx +0 -2
- package/layout/lib/utils/background.ts +8 -25
- package/layout/lib/utils/border/color.ts +1 -12
- package/layout/lib/utils/border/index.ts +0 -3
- package/layout/lib/utils/border/lineStyle.ts +6 -24
- package/layout/lib/utils/border/radius.ts +6 -15
- package/layout/lib/utils/border/shorthand.ts +8 -22
- package/layout/lib/utils/border/width.ts +4 -18
- package/layout/lib/utils/buildStyleFns.ts +0 -11
- package/layout/lib/utils/color.ts +4 -13
- package/layout/lib/utils/depth.ts +3 -11
- package/layout/lib/utils/flex.ts +11 -32
- package/layout/lib/utils/flexItem.ts +8 -27
- package/layout/lib/utils/grid.ts +19 -56
- package/layout/lib/utils/gridItem.ts +11 -36
- package/layout/lib/utils/layout.ts +13 -36
- package/layout/lib/utils/mergeStyles.ts +0 -1
- package/layout/lib/utils/other.ts +34 -106
- package/layout/lib/utils/position.ts +9 -24
- package/layout/lib/utils/space.ts +19 -42
- package/layout/lib/utils/styleProps.ts +0 -2
- package/layout/lib/utils/systemProps.ts +0 -17
- package/layout/lib/utils/text.ts +14 -45
- package/package.json +4 -4
- package/text-input/lib/TextInput.tsx +1 -1
|
@@ -1,72 +1,42 @@
|
|
|
1
1
|
import { Property } from 'csstype';
|
|
2
2
|
import { StyleFnConfig } from './buildStyleFns';
|
|
3
3
|
import { SystemPropValues } from './systemProps';
|
|
4
|
-
/** style props to for CSS font and text properties
|
|
5
|
-
* @deprecated ⚠️ Style props are deprecated. Please use our `cs` prop with `createStencil` or `createStyles` to apply styles. For more information view our [Styling docs](* @deprecated ⚠️ `boxStyleFn` is deprecated and will be removed in a future major version. Please reference our new way of styling components [here](https://workday.github.io/canvas-kit/?path=/docs/styling-getting-started-overview--docs).
|
|
6
|
-
*/
|
|
4
|
+
/** style props to for CSS font and text properties */
|
|
7
5
|
export type TextStyleProps = {
|
|
8
6
|
/**
|
|
9
7
|
* - sets [CSS font-family property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-family)
|
|
10
|
-
* - system tokens: `font`
|
|
11
|
-
* @deprecated
|
|
12
|
-
*/
|
|
8
|
+
* - system tokens: `font` */
|
|
13
9
|
fontFamily?: Property.FontFamily | SystemPropValues['font'];
|
|
14
10
|
/**
|
|
15
11
|
* - sets [CSS font-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-size)
|
|
16
|
-
* - system tokens: `fontSize`
|
|
17
|
-
* @deprecated
|
|
18
|
-
*/
|
|
12
|
+
* - system tokens: `fontSize` */
|
|
19
13
|
fontSize?: Property.FontSize | SystemPropValues['fontSize'];
|
|
20
|
-
/** sets [CSS font-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style)
|
|
21
|
-
* @deprecated
|
|
22
|
-
*/
|
|
14
|
+
/** sets [CSS font-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-style) */
|
|
23
15
|
fontStyle?: Property.FontStyle;
|
|
24
16
|
/**
|
|
25
17
|
* - sets [CSS font-weight property](https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight)
|
|
26
|
-
* - system tokens: `fontWeight`
|
|
27
|
-
* @deprecated
|
|
28
|
-
*/
|
|
18
|
+
* - system tokens: `fontWeight` */
|
|
29
19
|
fontWeight?: Property.FontWeight | SystemPropValues['fontWeight'];
|
|
30
|
-
/** sets [CSS line-height property](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height)
|
|
31
|
-
* @deprecated
|
|
32
|
-
*/
|
|
20
|
+
/** sets [CSS line-height property](https://developer.mozilla.org/en-US/docs/Web/CSS/line-height) */
|
|
33
21
|
lineHeight?: Property.LineHeight;
|
|
34
|
-
/** sets [CSS letter-spacing property](https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing)
|
|
35
|
-
* @deprecated
|
|
36
|
-
*/
|
|
22
|
+
/** sets [CSS letter-spacing property](https://developer.mozilla.org/en-US/docs/Web/CSS/letter-spacing) */
|
|
37
23
|
letterSpacing?: Property.LetterSpacing;
|
|
38
|
-
/** sets [CSS text-align property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align)
|
|
39
|
-
* @deprecated
|
|
40
|
-
*/
|
|
24
|
+
/** sets [CSS text-align property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-align) */
|
|
41
25
|
textAlign?: Property.TextAlign;
|
|
42
|
-
/** sets [CSS text-decoration property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration)
|
|
43
|
-
* @deprecated
|
|
44
|
-
*/
|
|
26
|
+
/** sets [CSS text-decoration property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-decoration) */
|
|
45
27
|
textDecoration?: Property.TextDecoration;
|
|
46
|
-
/** sets [CSS text-overflow property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow)
|
|
47
|
-
* @deprecated
|
|
48
|
-
*/
|
|
28
|
+
/** sets [CSS text-overflow property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow) */
|
|
49
29
|
textOverflow?: Property.TextOverflow;
|
|
50
|
-
/** sets [CSS text-transform property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform)
|
|
51
|
-
* @deprecated
|
|
52
|
-
*/
|
|
30
|
+
/** sets [CSS text-transform property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform) */
|
|
53
31
|
textTransform?: Property.TextTransform;
|
|
54
|
-
/** sets [CSS text-shadow property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow)
|
|
55
|
-
* @deprecated
|
|
56
|
-
*/
|
|
32
|
+
/** sets [CSS text-shadow property](https://developer.mozilla.org/en-US/docs/Web/CSS/text-shadow) */
|
|
57
33
|
textShadow?: Property.TextShadow;
|
|
58
|
-
/** sets [CSS white-space property](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space)
|
|
59
|
-
* @deprecated
|
|
60
|
-
*/
|
|
34
|
+
/** sets [CSS white-space property](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space) */
|
|
61
35
|
whiteSpace?: Property.WhiteSpace;
|
|
62
|
-
/** sets [CSS word-break property](https://developer.mozilla.org/en-US/docs/Web/CSS/word-break)
|
|
63
|
-
* @deprecated
|
|
64
|
-
*/
|
|
36
|
+
/** sets [CSS word-break property](https://developer.mozilla.org/en-US/docs/Web/CSS/word-break) */
|
|
65
37
|
wordBreak?: Property.WordBreak;
|
|
66
38
|
};
|
|
67
|
-
/** @deprecated */
|
|
68
39
|
export declare const textStyleFnConfigs: StyleFnConfig[];
|
|
69
|
-
/** @deprecated */
|
|
70
40
|
export declare const textStyleFns: import("./buildStyleFns").StyleFns;
|
|
71
41
|
/**
|
|
72
42
|
* A style prop function that takes component props and returns font and text styles.
|
|
@@ -78,7 +48,6 @@ export declare const textStyleFns: import("./buildStyleFns").StyleFns;
|
|
|
78
48
|
* <Box textAlign="center" fontWeight="medium">Hello, alignment!</Box>
|
|
79
49
|
* );
|
|
80
50
|
* ```
|
|
81
|
-
* @deprecated
|
|
82
51
|
*/
|
|
83
52
|
export declare const text: (props: TextStyleProps) => {};
|
|
84
53
|
//# sourceMappingURL=text.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../layout/lib/utils/text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAEjC,OAAO,EAAkC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC/E,OAAO,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAE/C
|
|
1
|
+
{"version":3,"file":"text.d.ts","sourceRoot":"","sources":["../../../../../layout/lib/utils/text.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,QAAQ,EAAC,MAAM,SAAS,CAAC;AAEjC,OAAO,EAAkC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC/E,OAAO,EAAC,gBAAgB,EAAC,MAAM,eAAe,CAAC;AAE/C,sDAAsD;AACtD,MAAM,MAAM,cAAc,GAAG;IAC3B;;iCAE6B;IAC7B,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,GAAG,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAC5D;;qCAEiC;IACjC,QAAQ,CAAC,EAAE,QAAQ,CAAC,QAAQ,GAAG,gBAAgB,CAAC,UAAU,CAAC,CAAC;IAC5D,kGAAkG;IAClG,SAAS,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC;IAC/B;;uCAEmC;IACnC,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,GAAG,gBAAgB,CAAC,YAAY,CAAC,CAAC;IAClE,oGAAoG;IACpG,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC;IACjC,0GAA0G;IAC1G,aAAa,CAAC,EAAE,QAAQ,CAAC,aAAa,CAAC;IACvC,kGAAkG;IAClG,SAAS,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC;IAC/B,4GAA4G;IAC5G,cAAc,CAAC,EAAE,QAAQ,CAAC,cAAc,CAAC;IACzC,wGAAwG;IACxG,YAAY,CAAC,EAAE,QAAQ,CAAC,YAAY,CAAC;IACrC,0GAA0G;IAC1G,aAAa,CAAC,EAAE,QAAQ,CAAC,aAAa,CAAC;IACvC,oGAAoG;IACpG,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC;IACjC,oGAAoG;IACpG,UAAU,CAAC,EAAE,QAAQ,CAAC,UAAU,CAAC;IACjC,kGAAkG;IAClG,SAAS,CAAC,EAAE,QAAQ,CAAC,SAAS,CAAC;CAChC,CAAC;AAEF,eAAO,MAAM,kBAAkB,EAAE,aAAa,EAkE7C,CAAC;AAEF,eAAO,MAAM,YAAY,oCAAoC,CAAC;AAC9D;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,+BAAiD,CAAC"}
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { buildStyleFns, buildStylePropFn } from './buildStyleFns';
|
|
2
|
-
/** @deprecated */
|
|
3
2
|
export const textStyleFnConfigs = [
|
|
4
3
|
{
|
|
5
4
|
name: 'fontFamily',
|
|
@@ -67,7 +66,6 @@ export const textStyleFnConfigs = [
|
|
|
67
66
|
system: 'none',
|
|
68
67
|
},
|
|
69
68
|
];
|
|
70
|
-
/** @deprecated */
|
|
71
69
|
export const textStyleFns = buildStyleFns(textStyleFnConfigs);
|
|
72
70
|
/**
|
|
73
71
|
* A style prop function that takes component props and returns font and text styles.
|
|
@@ -79,6 +77,5 @@ export const textStyleFns = buildStyleFns(textStyleFnConfigs);
|
|
|
79
77
|
* <Box textAlign="center" fontWeight="medium">Hello, alignment!</Box>
|
|
80
78
|
* );
|
|
81
79
|
* ```
|
|
82
|
-
* @deprecated
|
|
83
80
|
*/
|
|
84
81
|
export const text = buildStylePropFn(textStyleFns);
|
|
@@ -7,15 +7,15 @@ export const textInputStencil = createStencil({
|
|
|
7
7
|
vars: {
|
|
8
8
|
width: '',
|
|
9
9
|
},
|
|
10
|
-
base: { name: "
|
|
10
|
+
base: { name: "18drvp", styles: "box-sizing:border-box;font-family:var(--cnvs-sys-font-family-default);font-weight:var(--cnvs-sys-font-weight-normal);line-height:var(--cnvs-sys-line-height-subtext-large);font-size:var(--cnvs-sys-font-size-subtext-large);letter-spacing:var(--cnvs-base-letter-spacing-150);display:block;border:0.0625rem solid var(--cnvs-sys-color-border-input-default);background-color:var(--cnvs-sys-color-bg-default);border-radius:var(--cnvs-sys-shape-x1-half);height:var(--cnvs-sys-space-x10);transition:0.2s box-shadow, 0.2s border-color;padding:var(--cnvs-sys-space-x2);margin:0rem;width:var(--width-text-input-696c53);min-width:var(--width-text-input-696c53, calc(calc(var(--cnvs-sys-space-x20) * 3) + var(--cnvs-sys-space-x10)));color:var(--cnvs-sys-color-text-default);text-overflow:ellipsis;::-ms-clear{display:none;}&::placeholder{color:var(--cnvs-sys-color-text-hint);}&:is(:hover, .hover){border-color:var(--cnvs-sys-color-border-input-strong);}&:is(:focus-visible, .focus):where(:not([disabled])){border-color:var(--cnvs-brand-common-focus-outline);box-shadow:inset 0 0 0 1px var(--cnvs-brand-common-focus-outline);outline:0.125rem solid transparent;}&:is(:disabled, .disabled){background-color:var(--cnvs-sys-color-bg-alt-softer);border-color:var(--cnvs-sys-color-border-input-disabled);color:var(--cnvs-sys-color-fg-disabled);&::placeholder{color:var(--cnvs-sys-color-fg-disabled);}}" },
|
|
11
11
|
modifiers: {
|
|
12
12
|
grow: {
|
|
13
|
-
true: { name: "
|
|
14
|
-
false: { name: "
|
|
13
|
+
true: { name: "kxkr6", styles: "width:100%;resize:vertical;" },
|
|
14
|
+
false: { name: "3i5nz5", styles: "width:initial;" }
|
|
15
15
|
},
|
|
16
16
|
error: {
|
|
17
|
-
error: { name: "
|
|
18
|
-
caution: { name: "
|
|
17
|
+
error: { name: "48d7tw", styles: "border-color:var(--cnvs-brand-common-error-inner);border-width:0.125rem;background-color:var(--cnvs-brand-error-lightest);&:is(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled]), .focus:not([disabled])){border-color:var(--cnvs-brand-common-error-inner);}&:is(:focus-visible, .focus):not([disabled]){box-shadow:0 0 0 2px var(--cnvs-sys-color-border-inverse), 0 0 0 4px var(--cnvs-brand-common-focus-outline);outline-offset:0.125rem;}" },
|
|
18
|
+
caution: { name: "anba1", styles: "border-color:var(--cnvs-brand-common-alert-outer);box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-common-alert-inner);background-color:var(--cnvs-brand-alert-lightest);&:is(:hover, .hover, :disabled, .disabled, :focus-visible:not([disabled]), .focus:not([disabled])){border-color:var(--cnvs-brand-common-alert-outer);}&:is(:focus-visible, .focus):not([disabled]){box-shadow:inset 0 0 0 0.125rem var(--cnvs-brand-common-alert-inner),\n 0 0 0 2px var(--cnvs-sys-color-border-inverse),\n 0 0 0 4px var(--cnvs-brand-common-focus-outline);}outline-offset:0.125rem;" }
|
|
19
19
|
}
|
|
20
20
|
},
|
|
21
21
|
defaultModifiers: {
|
package/layout/lib/Box.tsx
CHANGED
|
@@ -63,7 +63,6 @@ const omittedProps = [
|
|
|
63
63
|
'wordBreak',
|
|
64
64
|
];
|
|
65
65
|
|
|
66
|
-
/** @deprecated */
|
|
67
66
|
const shouldForwardProp = (prop: string) => {
|
|
68
67
|
return isPropValid(prop) && !omittedProps.includes(prop);
|
|
69
68
|
};
|
|
@@ -85,7 +84,6 @@ const shouldForwardProp = (prop: string) => {
|
|
|
85
84
|
*
|
|
86
85
|
* <StyledHeader color='red'>Hello World</StyledHeader>
|
|
87
86
|
* ```
|
|
88
|
-
* @deprecated ⚠️ `boxStyleFn` is deprecated and will be removed in a future major version. Please reference our new way of styling components [here](https://workday.github.io/canvas-kit/?path=/docs/styling-getting-started-overview--docs).
|
|
89
87
|
*/
|
|
90
88
|
export const boxStyleFn = <P extends BoxProps>(props: P) => {
|
|
91
89
|
return [
|
|
@@ -3,45 +3,30 @@ import {Property} from 'csstype';
|
|
|
3
3
|
import {buildStyleFns, buildStylePropFn, StyleFnConfig} from './buildStyleFns';
|
|
4
4
|
import {SystemPropValues} from './systemProps';
|
|
5
5
|
|
|
6
|
-
/** style props to set CSS background properties
|
|
7
|
-
* @deprecated
|
|
8
|
-
*/
|
|
6
|
+
/** style props to set CSS background properties */
|
|
9
7
|
export type BackgroundStyleProps = {
|
|
10
8
|
/**
|
|
11
9
|
* - sets [CSS background property](https://developer.mozilla.org/en-US/docs/Web/CSS/background)
|
|
12
10
|
* - system tokens: `color`
|
|
13
|
-
*
|
|
14
|
-
*/
|
|
11
|
+
* */
|
|
15
12
|
background?: SystemPropValues['color'];
|
|
16
|
-
/** sets [CSS background-attachment property](https://developer.mozilla.org/en-US/docs/Web/CSS/)
|
|
17
|
-
* @deprecated
|
|
18
|
-
*/
|
|
13
|
+
/** sets [CSS background-attachment property](https://developer.mozilla.org/en-US/docs/Web/CSS/) */
|
|
19
14
|
backgroundAttachment?: Property.BackgroundAttachment;
|
|
20
15
|
/**
|
|
21
16
|
* - sets [CSS background-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-color)
|
|
22
17
|
* - system tokens: `color`
|
|
23
|
-
*
|
|
24
|
-
*/
|
|
18
|
+
* */
|
|
25
19
|
backgroundColor?: SystemPropValues['color'];
|
|
26
|
-
/** sets [CSS background-image property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-image)
|
|
27
|
-
* @deprecated
|
|
28
|
-
*/
|
|
20
|
+
/** sets [CSS background-image property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-image) */
|
|
29
21
|
backgroundImage?: Property.BackgroundImage;
|
|
30
|
-
/** sets [CSS background-position property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-position)
|
|
31
|
-
* @deprecated
|
|
32
|
-
*/
|
|
22
|
+
/** sets [CSS background-position property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-position) */
|
|
33
23
|
backgroundPosition?: Property.BackgroundPosition;
|
|
34
|
-
/** sets [CSS background-repeat property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat)
|
|
35
|
-
* @deprecated
|
|
36
|
-
*/
|
|
24
|
+
/** sets [CSS background-repeat property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-repeat) */
|
|
37
25
|
backgroundRepeat?: Property.BackgroundRepeat;
|
|
38
|
-
/** sets [CSS background-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size)
|
|
39
|
-
* @deprecated
|
|
40
|
-
*/
|
|
26
|
+
/** sets [CSS background-size property](https://developer.mozilla.org/en-US/docs/Web/CSS/background-size) */
|
|
41
27
|
backgroundSize?: Property.BackgroundSize;
|
|
42
28
|
};
|
|
43
29
|
|
|
44
|
-
/** @deprecated */
|
|
45
30
|
export const backgroundStyleFnConfigs: StyleFnConfig[] = [
|
|
46
31
|
{
|
|
47
32
|
name: 'background',
|
|
@@ -80,7 +65,6 @@ export const backgroundStyleFnConfigs: StyleFnConfig[] = [
|
|
|
80
65
|
},
|
|
81
66
|
];
|
|
82
67
|
|
|
83
|
-
/** @deprecated */
|
|
84
68
|
export const backgroundFns = buildStyleFns(backgroundStyleFnConfigs);
|
|
85
69
|
/**
|
|
86
70
|
* A style prop function that takes component props and returns border styles.
|
|
@@ -95,6 +79,5 @@ export const backgroundFns = buildStyleFns(backgroundStyleFnConfigs);
|
|
|
95
79
|
* </Box>
|
|
96
80
|
* );
|
|
97
81
|
*```
|
|
98
|
-
@deprecated
|
|
99
82
|
*/
|
|
100
83
|
export const background = buildStylePropFn<BackgroundStyleProps>(backgroundFns);
|
|
@@ -1,59 +1,49 @@
|
|
|
1
1
|
import {buildStyleFns, StyleFnConfig} from '../buildStyleFns';
|
|
2
2
|
import {SystemPropValues} from '../systemProps';
|
|
3
3
|
|
|
4
|
-
/** style props to set CSS border color properties
|
|
5
|
-
* @deprecated
|
|
6
|
-
*/
|
|
4
|
+
/** style props to set CSS border color properties */
|
|
7
5
|
export type BorderColorStyleProps = {
|
|
8
6
|
/**
|
|
9
7
|
* - sets [CSS border-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-color)
|
|
10
8
|
* - system tokens: `color`
|
|
11
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
12
9
|
*/
|
|
13
10
|
borderColor?: SystemPropValues['color'];
|
|
14
11
|
/**
|
|
15
12
|
* - sets [CSS border-top-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-color)
|
|
16
13
|
* - system tokens: `color`
|
|
17
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
18
14
|
*/
|
|
19
15
|
borderTopColor?: SystemPropValues['color'];
|
|
20
16
|
/**
|
|
21
17
|
* - sets [CSS border-right-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-color)
|
|
22
18
|
* - no bidirectional support
|
|
23
19
|
* - system tokens: `color`
|
|
24
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
25
20
|
*/
|
|
26
21
|
borderRightColor?: SystemPropValues['color'];
|
|
27
22
|
/**
|
|
28
23
|
* - sets [CSS border-bottom-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-color)
|
|
29
24
|
* - system tokens: `color`
|
|
30
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
31
25
|
*/
|
|
32
26
|
borderBottomColor?: SystemPropValues['color'];
|
|
33
27
|
/**
|
|
34
28
|
* - sets [CSS border-left-color property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-color)
|
|
35
29
|
* - no bidirectional support
|
|
36
30
|
* - system tokens: `color`
|
|
37
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
38
31
|
*/
|
|
39
32
|
borderLeftColor?: SystemPropValues['color'];
|
|
40
33
|
/**
|
|
41
34
|
* - sets [CSS border-inline-start-color property ](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-color)
|
|
42
35
|
* - bidirectional support
|
|
43
36
|
* - system tokens: `color`
|
|
44
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
45
37
|
*/
|
|
46
38
|
borderInlineStartColor?: SystemPropValues['color'];
|
|
47
39
|
/**
|
|
48
40
|
* - sets [CSS border-inline-end-color property ](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-color)
|
|
49
41
|
* - bidirectional support
|
|
50
42
|
* - system tokens: `color`
|
|
51
|
-
* @deprecated Use `cs` prop with `system.color.border.*` tokens
|
|
52
43
|
*/
|
|
53
44
|
borderInlineEndColor?: SystemPropValues['color'];
|
|
54
45
|
};
|
|
55
46
|
|
|
56
|
-
/** @deprecated */
|
|
57
47
|
export const borderColorStyleFnConfigs: StyleFnConfig[] = [
|
|
58
48
|
{
|
|
59
49
|
name: 'borderColor',
|
|
@@ -92,5 +82,4 @@ export const borderColorStyleFnConfigs: StyleFnConfig[] = [
|
|
|
92
82
|
},
|
|
93
83
|
];
|
|
94
84
|
|
|
95
|
-
/** @deprecated */
|
|
96
85
|
export const borderColorFns = buildStyleFns(borderColorStyleFnConfigs);
|
|
@@ -9,7 +9,6 @@ import {
|
|
|
9
9
|
} from './shorthand';
|
|
10
10
|
import {BorderWidthStyleProps, borderWidthFns, borderWidthStyleFnConfigs} from './width';
|
|
11
11
|
|
|
12
|
-
/** @deprecated */
|
|
13
12
|
export type BorderStyleProps = BorderColorStyleProps &
|
|
14
13
|
BorderLineStyleProps &
|
|
15
14
|
BorderRadiusStyleProps &
|
|
@@ -32,7 +31,6 @@ export type BorderStyleProps = BorderColorStyleProps &
|
|
|
32
31
|
* </Box>
|
|
33
32
|
* );
|
|
34
33
|
*```
|
|
35
|
-
* @deprecated
|
|
36
34
|
*/
|
|
37
35
|
export const border = buildStylePropFn<BorderStyleProps>({
|
|
38
36
|
...borderColorFns,
|
|
@@ -42,7 +40,6 @@ export const border = buildStylePropFn<BorderStyleProps>({
|
|
|
42
40
|
...borderWidthFns,
|
|
43
41
|
});
|
|
44
42
|
|
|
45
|
-
/** @deprecated */
|
|
46
43
|
export const borderStyleFnConfigs = [
|
|
47
44
|
...borderColorStyleFnConfigs,
|
|
48
45
|
...borderLineStyleFnConfigs,
|
|
@@ -2,57 +2,40 @@ import {Property} from 'csstype';
|
|
|
2
2
|
|
|
3
3
|
import {buildStyleFns, StyleFnConfig} from '../buildStyleFns';
|
|
4
4
|
|
|
5
|
-
/** style props to set CSS border style properties
|
|
6
|
-
* @deprecated
|
|
7
|
-
*/
|
|
5
|
+
/** style props to set CSS border style properties */
|
|
8
6
|
export type BorderLineStyleProps = {
|
|
9
|
-
/** sets [CSS border-collapse property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-collapse)
|
|
10
|
-
* @deprecated
|
|
11
|
-
*/
|
|
7
|
+
/** sets [CSS border-collapse property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-collapse) */
|
|
12
8
|
borderCollapse?: Property.BorderCollapse;
|
|
13
|
-
/** sets [CSS border-spacing property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-spacing)
|
|
14
|
-
* @deprecated
|
|
15
|
-
*/
|
|
9
|
+
/** sets [CSS border-spacing property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-spacing) */
|
|
16
10
|
borderSpacing?: Property.BorderSpacing;
|
|
17
|
-
/** sets [CSS border-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style)
|
|
18
|
-
* @deprecated
|
|
19
|
-
*/
|
|
11
|
+
/** sets [CSS border-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-style) */
|
|
20
12
|
borderStyle?: Property.Border;
|
|
21
|
-
/** sets [CSS border-top-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-style)
|
|
22
|
-
* @deprecated
|
|
23
|
-
*/
|
|
13
|
+
/** sets [CSS border-top-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-style) */
|
|
24
14
|
borderTopStyle?: Property.Border;
|
|
25
15
|
/**
|
|
26
16
|
* - sets [CSS border-right-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-style)
|
|
27
17
|
* - no bidirectional support
|
|
28
|
-
* @deprecated
|
|
29
18
|
*/
|
|
30
19
|
borderRightStyle?: Property.Border;
|
|
31
|
-
/** sets [CSS border-bottom-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-style)
|
|
32
|
-
* @deprecated
|
|
33
|
-
*/
|
|
20
|
+
/** sets [CSS border-bottom-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-style) */
|
|
34
21
|
borderBottomStyle?: Property.Border;
|
|
35
22
|
/**
|
|
36
23
|
* - sets [CSS border-left-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-style)
|
|
37
24
|
* - no bidirectional support
|
|
38
|
-
* @deprecated
|
|
39
25
|
*/
|
|
40
26
|
borderLeftStyle?: Property.Border;
|
|
41
27
|
/**
|
|
42
28
|
* - sets [CSS border-inline-start-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-style)
|
|
43
29
|
* - bidirectional support
|
|
44
|
-
* @deprecated
|
|
45
30
|
*/
|
|
46
31
|
borderInlineStartStyle?: Property.Border;
|
|
47
32
|
/**
|
|
48
33
|
* - sets [CSS border-inline-end-style property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end-style)
|
|
49
34
|
* - bidirectional support
|
|
50
|
-
* @deprecated
|
|
51
35
|
*/
|
|
52
36
|
borderInlineEndStyle?: Property.Border;
|
|
53
37
|
};
|
|
54
38
|
|
|
55
|
-
/** @deprecated */
|
|
56
39
|
export const borderLineStyleFnConfigs: StyleFnConfig[] = [
|
|
57
40
|
{
|
|
58
41
|
name: 'borderCollapse',
|
|
@@ -101,5 +84,4 @@ export const borderLineStyleFnConfigs: StyleFnConfig[] = [
|
|
|
101
84
|
},
|
|
102
85
|
];
|
|
103
86
|
|
|
104
|
-
/** @deprecated */
|
|
105
87
|
export const borderLineStyleFns = buildStyleFns(borderLineStyleFnConfigs);
|
|
@@ -1,43 +1,35 @@
|
|
|
1
1
|
import {buildStyleFns, StyleFnConfig} from '../buildStyleFns';
|
|
2
2
|
import {SystemPropValues} from '../systemProps';
|
|
3
3
|
|
|
4
|
-
/** style props to set CSS border radius properties
|
|
5
|
-
* @deprecated
|
|
6
|
-
*/
|
|
4
|
+
/** style props to set CSS border radius properties */
|
|
7
5
|
export type BorderRadiusStyleProps = {
|
|
8
6
|
/**
|
|
9
7
|
* - sets [CSS border-radius property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
|
|
10
8
|
* - system tokens: `shape`
|
|
11
|
-
*
|
|
12
|
-
*/
|
|
9
|
+
* */
|
|
13
10
|
borderRadius?: SystemPropValues['shape'];
|
|
14
11
|
/**
|
|
15
12
|
* - sets [CSS border-top-left-radius property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-left-radius)
|
|
16
13
|
* - system tokens: `shape`
|
|
17
|
-
*
|
|
18
|
-
*/
|
|
14
|
+
* */
|
|
19
15
|
borderTopLeftRadius?: SystemPropValues['shape'];
|
|
20
16
|
/**
|
|
21
17
|
* - sets [CSS border-top-right-radius property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-right-radius)
|
|
22
18
|
* - system tokens: `shape`
|
|
23
|
-
*
|
|
24
|
-
*/
|
|
19
|
+
* */
|
|
25
20
|
borderTopRightRadius?: SystemPropValues['shape'];
|
|
26
21
|
/**
|
|
27
22
|
* - sets [CSS border-bottom-left-radius property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-left-radius)
|
|
28
23
|
* - system tokens: `shape`
|
|
29
|
-
*
|
|
30
|
-
*/
|
|
24
|
+
* */
|
|
31
25
|
borderBottomLeftRadius?: SystemPropValues['shape'];
|
|
32
26
|
/**
|
|
33
27
|
* - sets [CSS border-bottom-right-radius property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-right-radius)
|
|
34
28
|
* - system tokens: `shape`
|
|
35
|
-
*
|
|
36
|
-
*/
|
|
29
|
+
* */
|
|
37
30
|
borderBottomRightRadius?: SystemPropValues['shape'];
|
|
38
31
|
};
|
|
39
32
|
|
|
40
|
-
/** @deprecated */
|
|
41
33
|
export const borderRadiusStyleFnConfigs: StyleFnConfig[] = [
|
|
42
34
|
{
|
|
43
35
|
name: 'borderRadius',
|
|
@@ -66,5 +58,4 @@ export const borderRadiusStyleFnConfigs: StyleFnConfig[] = [
|
|
|
66
58
|
},
|
|
67
59
|
];
|
|
68
60
|
|
|
69
|
-
/** @deprecated */
|
|
70
61
|
export const borderRadiusFns = buildStyleFns(borderRadiusStyleFnConfigs);
|
|
@@ -2,49 +2,36 @@ import {Property} from 'csstype';
|
|
|
2
2
|
|
|
3
3
|
import {buildStyleFns, StyleFnConfig} from '../buildStyleFns';
|
|
4
4
|
|
|
5
|
-
/** style props to set CSS border properties
|
|
6
|
-
* @deprecated
|
|
7
|
-
*/
|
|
5
|
+
/** style props to set CSS border properties */
|
|
8
6
|
export type BorderShorthandStyleProps = {
|
|
9
|
-
/** sets [CSS border property](https://developer.mozilla.org/en-US/docs/Web/CSS/border)
|
|
10
|
-
* @deprecated
|
|
11
|
-
*/
|
|
7
|
+
/** sets [CSS border property](https://developer.mozilla.org/en-US/docs/Web/CSS/border) */
|
|
12
8
|
border?: Property.Border;
|
|
13
|
-
/** sets [CSS border-top property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top)
|
|
14
|
-
* @deprecated
|
|
15
|
-
*/
|
|
9
|
+
/** sets [CSS border-top property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top) */
|
|
16
10
|
borderTop?: Property.BorderTop;
|
|
17
11
|
/**
|
|
18
12
|
* - sets [CSS border-right property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-right)
|
|
19
13
|
* - no bidirectional support
|
|
20
|
-
*
|
|
21
|
-
*/
|
|
14
|
+
* */
|
|
22
15
|
borderRight?: Property.BorderRight;
|
|
23
|
-
/** sets [CSS border-bottom property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom)
|
|
24
|
-
* @deprecated
|
|
25
|
-
*/
|
|
16
|
+
/** sets [CSS border-bottom property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom) */
|
|
26
17
|
borderBottom?: Property.BorderBottom;
|
|
27
18
|
/**
|
|
28
19
|
* - sets [CSS border-left property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-left)
|
|
29
20
|
* - no bidirectional support
|
|
30
|
-
*
|
|
31
|
-
*/
|
|
21
|
+
* */
|
|
32
22
|
borderLeft?: Property.BorderLeft;
|
|
33
23
|
/**
|
|
34
24
|
* - sets [CSS border-inline-start property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start)
|
|
35
25
|
* - bidirectional support
|
|
36
|
-
*
|
|
37
|
-
*/
|
|
26
|
+
* */
|
|
38
27
|
borderInlineStart?: Property.BorderInlineStart;
|
|
39
28
|
/**
|
|
40
29
|
* - sets [CSS border-inline-end property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end)
|
|
41
30
|
* - bidirectional support
|
|
42
|
-
*
|
|
43
|
-
*/
|
|
31
|
+
* */
|
|
44
32
|
borderInlineEnd?: Property.BorderInlineEnd;
|
|
45
33
|
};
|
|
46
34
|
|
|
47
|
-
/** @deprecated */
|
|
48
35
|
export const borderShorthandStyleFnConfigs: StyleFnConfig[] = [
|
|
49
36
|
{
|
|
50
37
|
name: 'border',
|
|
@@ -83,5 +70,4 @@ export const borderShorthandStyleFnConfigs: StyleFnConfig[] = [
|
|
|
83
70
|
},
|
|
84
71
|
];
|
|
85
72
|
|
|
86
|
-
/** @deprecated */
|
|
87
73
|
export const borderShorthandFns = buildStyleFns(borderShorthandStyleFnConfigs);
|
|
@@ -2,49 +2,36 @@ import {Property} from 'csstype';
|
|
|
2
2
|
|
|
3
3
|
import {buildStyleFns, StyleFnConfig} from '../buildStyleFns';
|
|
4
4
|
|
|
5
|
-
/** style props to set CSS border width properties
|
|
6
|
-
* @deprecated
|
|
7
|
-
*/
|
|
5
|
+
/** style props to set CSS border width properties */
|
|
8
6
|
export type BorderWidthStyleProps = {
|
|
9
|
-
/** sets [CSS border-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width)
|
|
10
|
-
* @deprecated
|
|
11
|
-
*/
|
|
7
|
+
/** sets [CSS border-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-width) */
|
|
12
8
|
borderWidth?: Property.BorderWidth | number;
|
|
13
|
-
/** sets [CSS border-top-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-width)
|
|
14
|
-
* @deprecated
|
|
15
|
-
*/
|
|
9
|
+
/** sets [CSS border-top-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-top-width) */
|
|
16
10
|
borderTopWidth?: Property.BorderTopWidth | number;
|
|
17
11
|
/**
|
|
18
12
|
* - sets [CSS border-right-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-right-width)
|
|
19
13
|
* - no bidirectional support
|
|
20
|
-
* @deprecated
|
|
21
14
|
* */
|
|
22
15
|
borderRightWidth?: Property.BorderRightWidth | number;
|
|
23
|
-
/** sets [CSS border-bottom-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-width)
|
|
24
|
-
* @deprecated
|
|
25
|
-
*/
|
|
16
|
+
/** sets [CSS border-bottom-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-bottom-width) */
|
|
26
17
|
borderBottomWidth?: Property.BorderBottomWidth | number;
|
|
27
18
|
/**
|
|
28
19
|
* - sets [CSS border-left-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-left-width)
|
|
29
20
|
* - no bidirectional support
|
|
30
|
-
* @deprecated
|
|
31
21
|
* */
|
|
32
22
|
borderLeftWidth?: Property.BorderLeftWidth | number;
|
|
33
23
|
/**
|
|
34
24
|
* - sets [CSS border-inline-start-width property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-start-width)
|
|
35
25
|
* - bidirectional support
|
|
36
|
-
* @deprecated
|
|
37
26
|
* */
|
|
38
27
|
borderInlineStartWidth?: Property.BorderInlineStartWidth | number;
|
|
39
28
|
/**
|
|
40
29
|
* - sets [CSS border-inline-end property](https://developer.mozilla.org/en-US/docs/Web/CSS/border-inline-end)
|
|
41
30
|
* - bidirectional support
|
|
42
|
-
* @deprecated
|
|
43
31
|
* */
|
|
44
32
|
borderInlineEndWidth?: Property.BorderInlineEndWidth | number;
|
|
45
33
|
};
|
|
46
34
|
|
|
47
|
-
/** @deprecated */
|
|
48
35
|
export const borderWidthStyleFnConfigs: StyleFnConfig[] = [
|
|
49
36
|
{
|
|
50
37
|
name: 'borderWidth',
|
|
@@ -83,5 +70,4 @@ export const borderWidthStyleFnConfigs: StyleFnConfig[] = [
|
|
|
83
70
|
},
|
|
84
71
|
];
|
|
85
72
|
|
|
86
|
-
/** @deprecated */
|
|
87
73
|
export const borderWidthFns = buildStyleFns(borderWidthStyleFnConfigs);
|
|
@@ -9,39 +9,32 @@ import {wrapProperty} from '@workday/canvas-kit-styling';
|
|
|
9
9
|
|
|
10
10
|
import {CanvasSystemPropValues, SystemPropNames, SystemPropValues} from './systemProps';
|
|
11
11
|
|
|
12
|
-
/** @deprecated */
|
|
13
12
|
export type StyleFnConfig = {
|
|
14
13
|
name: string;
|
|
15
14
|
properties: string[];
|
|
16
15
|
system: SystemPropNames | 'none';
|
|
17
16
|
};
|
|
18
17
|
|
|
19
|
-
/** @deprecated */
|
|
20
18
|
export type StyleFns = {
|
|
21
19
|
[key: string]: (value: unknown) => {};
|
|
22
20
|
};
|
|
23
21
|
|
|
24
|
-
/** @deprecated */
|
|
25
22
|
const getColor = (value: SystemPropValues['color']) => {
|
|
26
23
|
return colorTokens[value] || wrapProperty(value);
|
|
27
24
|
};
|
|
28
25
|
|
|
29
|
-
/** @deprecated */
|
|
30
26
|
const getDepth = (value: SystemPropValues['depth']) => {
|
|
31
27
|
return depthTokens[value];
|
|
32
28
|
};
|
|
33
29
|
|
|
34
|
-
/** @deprecated */
|
|
35
30
|
const getShape = (value: SystemPropValues['shape']) => {
|
|
36
31
|
return borderRadiusTokens[value as CanvasSystemPropValues['shape']] || wrapProperty(value);
|
|
37
32
|
};
|
|
38
33
|
|
|
39
|
-
/** @deprecated */
|
|
40
34
|
const getSpace = (value: SystemPropValues['space']) => {
|
|
41
35
|
return spaceTokens[value as CanvasSystemPropValues['space']] || wrapProperty(value);
|
|
42
36
|
};
|
|
43
37
|
|
|
44
|
-
/** @deprecated */
|
|
45
38
|
const getFont = (value: SystemPropValues['font']) => {
|
|
46
39
|
return (
|
|
47
40
|
typeTokens.properties.fontFamilies[value as CanvasSystemPropValues['font']] ||
|
|
@@ -49,7 +42,6 @@ const getFont = (value: SystemPropValues['font']) => {
|
|
|
49
42
|
);
|
|
50
43
|
};
|
|
51
44
|
|
|
52
|
-
/** @deprecated */
|
|
53
45
|
const getFontSize = (value: SystemPropValues['fontSize'] | string) => {
|
|
54
46
|
return (
|
|
55
47
|
typeTokens.properties.fontSizes[value as CanvasSystemPropValues['fontSize']] ||
|
|
@@ -57,7 +49,6 @@ const getFontSize = (value: SystemPropValues['fontSize'] | string) => {
|
|
|
57
49
|
);
|
|
58
50
|
};
|
|
59
51
|
|
|
60
|
-
/** @deprecated */
|
|
61
52
|
const getFontWeight = (value: SystemPropValues['fontWeight'] | string) => {
|
|
62
53
|
return (
|
|
63
54
|
typeTokens.properties.fontWeights[value as CanvasSystemPropValues['fontWeight']] ||
|
|
@@ -65,7 +56,6 @@ const getFontWeight = (value: SystemPropValues['fontWeight'] | string) => {
|
|
|
65
56
|
);
|
|
66
57
|
};
|
|
67
58
|
|
|
68
|
-
/** @deprecated */
|
|
69
59
|
export function buildStyleFns(styleFnConfigs: StyleFnConfig[]): StyleFns {
|
|
70
60
|
return styleFnConfigs.reduce((styleFns = {}, styleFnConfig) => {
|
|
71
61
|
const styleFn = (value: unknown) => {
|
|
@@ -120,7 +110,6 @@ export function buildStyleFns(styleFnConfigs: StyleFnConfig[]): StyleFns {
|
|
|
120
110
|
}, {});
|
|
121
111
|
}
|
|
122
112
|
|
|
123
|
-
/** @deprecated */
|
|
124
113
|
export function buildStylePropFn<P extends {}>(styleFns: StyleFns) {
|
|
125
114
|
return (props: P) => {
|
|
126
115
|
let styles = {};
|