@workday/canvas-kit-docs 15.0.0-alpha.1293-next.0 → 15.0.0-alpha.1301-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.
Files changed (8) hide show
  1. package/dist/es6/lib/ExampleCodeBlock.d.ts.map +1 -1
  2. package/dist/es6/lib/ExampleCodeBlock.js +4 -1
  3. package/dist/es6/lib/docs.js +237 -1
  4. package/dist/es6/lib/stackblitzFiles/packageJSONFile.js +5 -5
  5. package/dist/es6/lib/stackblitzFiles/packageJSONFile.ts +5 -5
  6. package/dist/mdx/react/banner/examples/StickyAnimation.tsx +1 -3
  7. package/lib/ExampleCodeBlock.tsx +4 -1
  8. package/package.json +6 -6
package/dist/es6/lib/ExampleCodeBlock.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ExampleCodeBlock.d.ts","sourceRoot":"","sources":["../../../lib/ExampleCodeBlock.tsx"],"names":[],"mappings":"AAmEA,eAAO,MAAM,gBAAgB,aAAY,GAAG,4CAkH3C,CAAC"}
1
+ {"version":3,"file":"ExampleCodeBlock.d.ts","sourceRoot":"","sources":["../../../lib/ExampleCodeBlock.tsx"],"names":[],"mappings":"AAsEA,eAAO,MAAM,gBAAgB,aAAY,GAAG,4CAkH3C,CAAC"}
package/dist/es6/lib/ExampleCodeBlock.js CHANGED
@@ -27,6 +27,9 @@ const cardStencil = createStencil({
27
27
  position: 'relative',
28
28
  overflow: 'auto', // This allows for the entire ExampleCodeBlock to scroll on smaller viewports
29
29
  },
30
+ '[data-part="example-block-container"]': {
31
+ overflow: 'auto',
32
+ },
30
33
  '[data-part="code-block"]': {
31
34
  display: 'none',
32
35
  boxShadow: system.depth[1],
@@ -111,7 +114,7 @@ export const ExampleCodeBlock = ({ code }) => {
111
114
  openFile: 'src/Demo.tsx',
112
115
  });
113
116
  };
114
- return (_jsxs("div", { ...cardStencil({ opened: isCodeDisplayed }), children: [_jsx(Card, { "data-part": "example-block", className: "sb-unstyled", children: _jsx(Card.Body, { cs: { overflow: 'auto' }, children: _jsxs(CanvasProvider, { className: defaultBranding, children: [React.createElement(code), code && (_jsxs("div", { "data-part": "code-toggle-stackblitz-btn-container", children: [_jsx(TertiaryButton, { size: "extraSmall", onClick: () => openProjectInStackblitz(), children: "\u26A1\uFE0F Edit in Stackblitz" }), _jsx(TertiaryButton, { size: "extraSmall", onClick: () => setCodeDisplayed(!isCodeDisplayed), children: !isCodeDisplayed ? 'Show Code' : 'Hide Code' })] }))] }) }) }), _jsx(Card, { "data-part": "code-block", padding: 0, children: _jsx(Card.Body, { cs: { position: 'relative' }, children: _jsxs(CanvasProvider, { className: defaultBranding, children: [code && (_jsx("div", { ref: textInput, children: _jsx(SyntaxHighlighter, { className: "sb-unstyled", language: "jsx", style: vscDarkPlus, customStyle: {
117
+ return (_jsxs("div", { ...cardStencil({ opened: isCodeDisplayed }), children: [_jsx(Card, { "data-part": "example-block", className: "sb-unstyled", children: _jsx(Card.Body, { "data-part": "example-block-container", children: _jsxs(CanvasProvider, { className: defaultBranding, children: [React.createElement(code), code && (_jsxs("div", { "data-part": "code-toggle-stackblitz-btn-container", children: [_jsx(TertiaryButton, { size: "extraSmall", onClick: () => openProjectInStackblitz(), children: "\u26A1\uFE0F Edit in Stackblitz" }), _jsx(TertiaryButton, { size: "extraSmall", onClick: () => setCodeDisplayed(!isCodeDisplayed), children: !isCodeDisplayed ? 'Show Code' : 'Hide Code' })] }))] }) }) }), _jsx(Card, { "data-part": "code-block", padding: 0, children: _jsx(Card.Body, { cs: { position: 'relative' }, children: _jsxs(CanvasProvider, { className: defaultBranding, children: [code && (_jsx("div", { ref: textInput, children: _jsx(SyntaxHighlighter, { className: "sb-unstyled", language: "jsx", style: vscDarkPlus, customStyle: {
115
118
  fontSize: cssVar(system.fontSize.subtext.large),
116
119
  lineHeight: cssVar(system.lineHeight.subtext.large),
117
120
  margin: '0',
package/dist/es6/lib/docs.js CHANGED
@@ -5336,7 +5336,7 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
5336
5336
  },
5337
5337
  "defaultValue": {
5338
5338
  "kind": "string",
5339
- "value": "cover"
5339
+ "value": "contain"
5340
5340
  }
5341
5341
  },
5342
5342
  {
@@ -127051,6 +127051,24 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
127051
127051
  "componentType": "regular",
127052
127052
  "displayName": "CheckboxRipple",
127053
127053
  "props": [
127054
+ {
127055
+ "kind": "property",
127056
+ "name": "cs",
127057
+ "required": false,
127058
+ "type": {
127059
+ "kind": "symbol",
127060
+ "name": "CSToPropsInput",
127061
+ "value": "CSToPropsInput"
127062
+ },
127063
+ "description": "The `cs` prop takes in a single value or an array of values. You can pass the CSS class name\nreturned by {@link createStyles}, or the result of {@link createVars} and\n{@link createModifiers}. If you're extending a component already using `cs`, you can merge that\nprop in as well. Any style that is passed to the `cs` prop will override style props. If you\nwish to have styles that are overridden by the `css` prop, or styles added via the `styled`\nAPI, use {@link handleCsProp} wherever `elemProps` is used. If your component needs to also\nhandle style props, use {@link mergeStyles } instead.\n\n\n```tsx\nimport {handleCsProp} from '@workday/canvas-kit-styling';\nimport {mergeStyles} from '@workday/canvas-kit-react/layout';\n\n// ...\n\n// `handleCsProp` handles compat mode with Emotion's runtime APIs. `mergeStyles` has the same\n// function signature, but adds support for style props.\n\nreturn (\n <Element\n {...handleCsProp(elemProps, [\n myStyles,\n myModifiers({ size: 'medium' }),\n myVars({ backgroundColor: 'red' })\n ])}\n >\n {children}\n </Element>\n)\n```",
127064
+ "declarations": [
127065
+ {
127066
+ "name": "cs",
127067
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/styling/dist/es6/lib/cs.d.ts"
127068
+ }
127069
+ ],
127070
+ "tags": {}
127071
+ },
127054
127072
  {
127055
127073
  "kind": "property",
127056
127074
  "name": "children",
@@ -194415,6 +194433,176 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
194415
194433
  }
194416
194434
  }
194417
194435
  },
194436
+ {
194437
+ "name": "forwardFitTokens",
194438
+ "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts",
194439
+ "description": "This file is NOT INTENDED to be used by consumers, only internally by Canvas Kit.",
194440
+ "declarations": [
194441
+ {
194442
+ "name": "forwardFitTokens",
194443
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194444
+ }
194445
+ ],
194446
+ "tags": {},
194447
+ "type": {
194448
+ "kind": "object",
194449
+ "properties": [
194450
+ {
194451
+ "kind": "property",
194452
+ "name": "system",
194453
+ "defaultValue": {
194454
+ "kind": "object",
194455
+ "properties": [
194456
+ {
194457
+ "kind": "property",
194458
+ "name": "shape",
194459
+ "defaultValue": {
194460
+ "kind": "object",
194461
+ "properties": [
194462
+ {
194463
+ "kind": "property",
194464
+ "name": "sm",
194465
+ "defaultValue": {
194466
+ "kind": "string",
194467
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194468
+ },
194469
+ "type": {
194470
+ "kind": "string",
194471
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194472
+ },
194473
+ "required": true,
194474
+ "description": "",
194475
+ "declarations": [
194476
+ {
194477
+ "name": "sm",
194478
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194479
+ }
194480
+ ],
194481
+ "tags": {}
194482
+ }
194483
+ ]
194484
+ },
194485
+ "type": {
194486
+ "kind": "object",
194487
+ "properties": [
194488
+ {
194489
+ "kind": "property",
194490
+ "name": "sm",
194491
+ "defaultValue": {
194492
+ "kind": "string",
194493
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194494
+ },
194495
+ "type": {
194496
+ "kind": "string",
194497
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194498
+ },
194499
+ "required": true,
194500
+ "description": "",
194501
+ "declarations": [
194502
+ {
194503
+ "name": "sm",
194504
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194505
+ }
194506
+ ],
194507
+ "tags": {}
194508
+ }
194509
+ ]
194510
+ },
194511
+ "required": true,
194512
+ "description": "",
194513
+ "declarations": [
194514
+ {
194515
+ "name": "shape",
194516
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194517
+ }
194518
+ ],
194519
+ "tags": {}
194520
+ }
194521
+ ]
194522
+ },
194523
+ "type": {
194524
+ "kind": "object",
194525
+ "properties": [
194526
+ {
194527
+ "kind": "property",
194528
+ "name": "shape",
194529
+ "defaultValue": {
194530
+ "kind": "object",
194531
+ "properties": [
194532
+ {
194533
+ "kind": "property",
194534
+ "name": "sm",
194535
+ "defaultValue": {
194536
+ "kind": "string",
194537
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194538
+ },
194539
+ "type": {
194540
+ "kind": "string",
194541
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194542
+ },
194543
+ "required": true,
194544
+ "description": "",
194545
+ "declarations": [
194546
+ {
194547
+ "name": "sm",
194548
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194549
+ }
194550
+ ],
194551
+ "tags": {}
194552
+ }
194553
+ ]
194554
+ },
194555
+ "type": {
194556
+ "kind": "object",
194557
+ "properties": [
194558
+ {
194559
+ "kind": "property",
194560
+ "name": "sm",
194561
+ "defaultValue": {
194562
+ "kind": "string",
194563
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194564
+ },
194565
+ "type": {
194566
+ "kind": "string",
194567
+ "value": "var(--cnvs-sys-shape-sm, var(--cnvs-sys-shape-x1-half))"
194568
+ },
194569
+ "required": true,
194570
+ "description": "",
194571
+ "declarations": [
194572
+ {
194573
+ "name": "sm",
194574
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194575
+ }
194576
+ ],
194577
+ "tags": {}
194578
+ }
194579
+ ]
194580
+ },
194581
+ "required": true,
194582
+ "description": "",
194583
+ "declarations": [
194584
+ {
194585
+ "name": "shape",
194586
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194587
+ }
194588
+ ],
194589
+ "tags": {}
194590
+ }
194591
+ ]
194592
+ },
194593
+ "required": true,
194594
+ "description": "",
194595
+ "declarations": [
194596
+ {
194597
+ "name": "system",
194598
+ "filePath": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/forwardFitTokens.ts"
194599
+ }
194600
+ ],
194601
+ "tags": {}
194602
+ }
194603
+ ]
194604
+ }
194605
+ },
194418
194606
  {
194419
194607
  "name": "GenericStyles",
194420
194608
  "fileName": "/home/runner/work/canvas-kit/canvas-kit/modules/react/common/lib/genericStyles.ts",
@@ -272652,6 +272840,54 @@ export const docs = (typeof window !== 'undefined' && window.__docs) ||
272652
272840
  "returnType": {
272653
272841
  "kind": "object",
272654
272842
  "properties": [
272843
+ {
272844
+ "kind": "property",
272845
+ "name": "id",
272846
+ "required": true,
272847
+ "type": {
272848
+ "kind": "primitive",
272849
+ "value": "string"
272850
+ },
272851
+ "description": "",
272852
+ "tags": {},
272853
+ "declarations": []
272854
+ },
272855
+ {
272856
+ "kind": "property",
272857
+ "name": "role",
272858
+ "required": true,
272859
+ "type": {
272860
+ "kind": "string",
272861
+ "value": "menuitem"
272862
+ },
272863
+ "description": "",
272864
+ "tags": {},
272865
+ "declarations": []
272866
+ },
272867
+ {
272868
+ "kind": "property",
272869
+ "name": "aria-haspopup",
272870
+ "required": true,
272871
+ "type": {
272872
+ "kind": "string",
272873
+ "value": "true"
272874
+ },
272875
+ "description": "",
272876
+ "tags": {},
272877
+ "declarations": []
272878
+ },
272879
+ {
272880
+ "kind": "property",
272881
+ "name": "aria-expanded",
272882
+ "required": true,
272883
+ "type": {
272884
+ "kind": "primitive",
272885
+ "value": "boolean"
272886
+ },
272887
+ "description": "",
272888
+ "tags": {},
272889
+ "declarations": []
272890
+ },
272655
272891
  {
272656
272892
  "kind": "property",
272657
272893
  "name": "onMouseDown",
package/dist/es6/lib/stackblitzFiles/packageJSONFile.js CHANGED
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
18
18
  "@emotion/react": "11.11.4",
19
19
  "@types/react": "18.2.60",
20
20
  "@types/react-dom": "18.2.19",
21
- "@workday/canvas-kit-labs-react": "14.0.13",
22
- "@workday/canvas-kit-preview-react": "14.0.13",
23
- "@workday/canvas-kit-react": "14.0.13",
24
- "@workday/canvas-kit-react-fonts": "^14.0.13",
25
- "@workday/canvas-kit-styling": "14.0.13",
21
+ "@workday/canvas-kit-labs-react": "14.0.17",
22
+ "@workday/canvas-kit-preview-react": "14.0.17",
23
+ "@workday/canvas-kit-react": "14.0.17",
24
+ "@workday/canvas-kit-react-fonts": "^14.0.17",
25
+ "@workday/canvas-kit-styling": "14.0.17",
26
26
  "@workday/canvas-system-icons-web": "3.0.36",
27
27
  "@workday/canvas-tokens-web": "3.1.2"
28
28
  },
package/dist/es6/lib/stackblitzFiles/packageJSONFile.ts CHANGED
@@ -18,11 +18,11 @@ export const packageJSONFile = `{
18
18
  "@emotion/react": "11.11.4",
19
19
  "@types/react": "18.2.60",
20
20
  "@types/react-dom": "18.2.19",
21
- "@workday/canvas-kit-labs-react": "14.0.13",
22
- "@workday/canvas-kit-preview-react": "14.0.13",
23
- "@workday/canvas-kit-react": "14.0.13",
24
- "@workday/canvas-kit-react-fonts": "^14.0.13",
25
- "@workday/canvas-kit-styling": "14.0.13",
21
+ "@workday/canvas-kit-labs-react": "14.0.17",
22
+ "@workday/canvas-kit-preview-react": "14.0.17",
23
+ "@workday/canvas-kit-react": "14.0.17",
24
+ "@workday/canvas-kit-react-fonts": "^14.0.17",
25
+ "@workday/canvas-kit-styling": "14.0.17",
26
26
  "@workday/canvas-system-icons-web": "3.0.36",
27
27
  "@workday/canvas-tokens-web": "3.1.2"
28
28
  },
package/dist/mdx/react/banner/examples/StickyAnimation.tsx CHANGED
@@ -1,6 +1,5 @@
1
1
  import React from 'react';
2
2
 
3
- import {CSSProperties, space} from '@workday/canvas-kit-react/tokens';
4
3
  import {useTheme} from '@workday/canvas-kit-react/common';
5
4
  import {Box} from '@workday/canvas-kit-react/layout';
6
5
  import {loopIcon} from '@workday/canvas-system-icons-web';
@@ -32,7 +31,7 @@ const stickAnimationKeyframes = keyframes({
32
31
 
33
32
  const stickyAnimationStencil = createStencil({
34
33
  base: {
35
- marginY: system.space.x1,
34
+ marginBlock: system.space.x1,
36
35
  marginInlineStart: system.space.x1,
37
36
  marginInlineEnd: 0,
38
37
  animationName: stickAnimationKeyframes,
@@ -45,7 +44,6 @@ export default () => {
45
44
  const theme = useTheme();
46
45
  const bannerRef = React.useRef<HTMLButtonElement>(null);
47
46
  const containerRef = React.useRef<HTMLDivElement>(null);
48
- const [styles, setStyles] = React.useState<CSSProperties>();
49
47
  const [bannerWidth, setBannerWidth] = React.useState(0);
50
48
 
51
49
  const [rerun, setRerun] = React.useState(1); // Only needed for demo purposes
package/lib/ExampleCodeBlock.tsx CHANGED
@@ -28,6 +28,9 @@ const cardStencil = createStencil({
28
28
  position: 'relative',
29
29
  overflow: 'auto', // This allows for the entire ExampleCodeBlock to scroll on smaller viewports
30
30
  },
31
+ '[data-part="example-block-container"]': {
32
+ overflow: 'auto',
33
+ },
31
34
  '[data-part="code-block"]': {
32
35
  display: 'none',
33
36
  boxShadow: system.depth[1],
@@ -125,7 +128,7 @@ export const ExampleCodeBlock = ({code}: any) => {
125
128
  <div {...cardStencil({opened: isCodeDisplayed})}>
126
129
  <Card data-part="example-block" className="sb-unstyled">
127
130
  {/* This allows for the div to scroll on smaller viewports while not allowing the components to overflow over the container */}
128
- <Card.Body cs={{overflow: 'auto'}}>
131
+ <Card.Body data-part="example-block-container">
129
132
  <CanvasProvider className={defaultBranding}>
130
133
  {React.createElement(code)}
131
134
  {code && (
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@workday/canvas-kit-docs",
3
- "version": "15.0.0-alpha.1293-next.0",
3
+ "version": "15.0.0-alpha.1301-next.0",
4
4
  "description": "Documentation components of Canvas Kit components",
5
5
  "author": "Workday, Inc. (https://www.workday.com)",
6
6
  "license": "Apache-2.0",
@@ -45,10 +45,10 @@
45
45
  "@emotion/styled": "^11.6.0",
46
46
  "@stackblitz/sdk": "^1.11.0",
47
47
  "@storybook/csf": "0.0.1",
48
- "@workday/canvas-kit-labs-react": "^15.0.0-alpha.1293-next.0",
49
- "@workday/canvas-kit-preview-react": "^15.0.0-alpha.1293-next.0",
50
- "@workday/canvas-kit-react": "^15.0.0-alpha.1293-next.0",
51
- "@workday/canvas-kit-styling": "^15.0.0-alpha.1293-next.0",
48
+ "@workday/canvas-kit-labs-react": "^15.0.0-alpha.1301-next.0",
49
+ "@workday/canvas-kit-preview-react": "^15.0.0-alpha.1301-next.0",
50
+ "@workday/canvas-kit-react": "^15.0.0-alpha.1301-next.0",
51
+ "@workday/canvas-kit-styling": "^15.0.0-alpha.1301-next.0",
52
52
  "@workday/canvas-system-icons-web": "^3.0.36",
53
53
  "@workday/canvas-tokens-web": "^3.1.1",
54
54
  "markdown-to-jsx": "^7.2.0",
@@ -61,5 +61,5 @@
61
61
  "mkdirp": "^1.0.3",
62
62
  "typescript": "5.0"
63
63
  },
64
- "gitHead": "3af12af1258fa5f8a09c702f9bb322b5a1f0653d"
64
+ "gitHead": "5a43df05e8c2e88e1bf2aa502b38c511f6a35117"
65
65
  }