@atlaskit/ds-explorations 2.0.11 → 2.0.12

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 (12) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/cjs/version.json +1 -1
  3. package/dist/es2019/version.json +1 -1
  4. package/dist/esm/version.json +1 -1
  5. package/examples/01-box.tsx +14 -14
  6. package/examples/02-text-advanced.tsx +1 -1
  7. package/examples/02-text.tsx +6 -6
  8. package/examples/06-section-message.tsx +4 -4
  9. package/examples/07-comment.tsx +3 -3
  10. package/examples/08-lozenge.tsx +1 -1
  11. package/examples/99-interactions.tsx +6 -6
  12. package/package.json +2 -2
package/CHANGELOG.md CHANGED
@@ -1,5 +1,11 @@
1
1
  # @atlaskit/ds-explorations
2
2
 
3
+ ## 2.0.12
4
+
5
+ ### Patch Changes
6
+
7
+ - [`2e01c9c74b5`](https://bitbucket.org/atlassian/atlassian-frontend/commits/2e01c9c74b5) - DUMMY remove before merging to master; dupe adf-schema via adf-utils
8
+
3
9
  ## 2.0.11
4
10
 
5
11
  ### Patch Changes
package/dist/cjs/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/ds-explorations",
3
- "version": "2.0.11",
3
+ "version": "2.0.12",
4
4
  "sideEffects": false
5
5
  }
package/dist/es2019/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/ds-explorations",
3
- "version": "2.0.11",
3
+ "version": "2.0.12",
4
4
  "sideEffects": false
5
5
  }
package/dist/esm/version.json CHANGED
@@ -1,5 +1,5 @@
1
1
  {
2
2
  "name": "@atlaskit/ds-explorations",
3
- "version": "2.0.11",
3
+ "version": "2.0.12",
4
4
  "sideEffects": false
5
5
  }
package/examples/01-box.tsx CHANGED
@@ -12,10 +12,10 @@ import { spacingScale } from '../src/internal/spacing-scale';
12
12
  */
13
13
  export default () => {
14
14
  return (
15
- <Stack space="400" alignInline="start">
16
- <Stack space="200" testId="box-with-background-and-paddingBlock">
15
+ <Stack space="space.400" alignInline="start">
16
+ <Stack space="space.200" testId="box-with-background-and-paddingBlock">
17
17
  <Heading level="h600">paddingBlock</Heading>
18
- <Inline space="200" alignBlock="center">
18
+ <Inline space="space.200" alignBlock="center">
19
19
  {spacingScale.map((space) => (
20
20
  <Box
21
21
  key={space}
@@ -30,9 +30,9 @@ export default () => {
30
30
  </Inline>
31
31
  </Stack>
32
32
 
33
- <Stack space="200" testId="box-with-background-and-paddingInline">
33
+ <Stack space="space.200" testId="box-with-background-and-paddingInline">
34
34
  <Heading level="h600">paddingInline</Heading>
35
- <Stack space="200" alignInline="center">
35
+ <Stack space="space.200" alignInline="center">
36
36
  {spacingScale.map((space) => (
37
37
  <Box
38
38
  key={space}
@@ -47,9 +47,9 @@ export default () => {
47
47
  </Stack>
48
48
  </Stack>
49
49
 
50
- <Stack space="200" testId="box-with-background-and-padding">
50
+ <Stack space="space.200" testId="box-with-background-and-padding">
51
51
  <Heading level="h600">padding</Heading>
52
- <Inline space="200" alignBlock="center">
52
+ <Inline space="space.200" alignBlock="center">
53
53
  {spacingScale.map((space) => (
54
54
  <Box key={space} backgroundColor="discovery.bold" padding={space}>
55
55
  <Box backgroundColor="elevation.surface" justifyContent="center">
@@ -60,9 +60,9 @@ export default () => {
60
60
  </Inline>
61
61
  </Stack>
62
62
 
63
- <Stack space="200" testId="box-with-backgroundColor">
63
+ <Stack space="space.200" testId="box-with-backgroundColor">
64
64
  <Heading level="h600">backgroundColor</Heading>
65
- <Inline space="200" alignBlock="center">
65
+ <Inline space="space.200" alignBlock="center">
66
66
  {(
67
67
  [
68
68
  'discovery.bold',
@@ -82,9 +82,9 @@ export default () => {
82
82
  </Inline>
83
83
  </Stack>
84
84
 
85
- <Stack space="200" testId="box-with-borderColor">
85
+ <Stack space="space.200" testId="box-with-borderColor">
86
86
  <Heading level="h600">borderColor</Heading>
87
- <Inline space="200" alignBlock="center">
87
+ <Inline space="space.200" alignBlock="center">
88
88
  {(
89
89
  [
90
90
  'discovery',
@@ -111,9 +111,9 @@ export default () => {
111
111
  </Inline>
112
112
  </Stack>
113
113
 
114
- <Stack space="200" testId="box-with-shadow">
114
+ <Stack space="space.200" testId="box-with-shadow">
115
115
  <Heading level="h600">shadow</Heading>
116
- <Inline space="200" alignBlock="center">
116
+ <Inline space="space.200" alignBlock="center">
117
117
  {(['raised', 'overflow', 'overlay'] as const).map((shadow) => (
118
118
  <Box
119
119
  key={shadow}
@@ -129,7 +129,7 @@ export default () => {
129
129
  </Inline>
130
130
  </Stack>
131
131
 
132
- <Stack space="200" testId="box-with-layer">
132
+ <Stack space="space.200" testId="box-with-layer">
133
133
  <Heading level="h600">layer</Heading>
134
134
  <Box alignItems="center" UNSAFE_style={{ width: 800, height: 650 }}>
135
135
  {(
package/examples/02-text-advanced.tsx CHANGED
@@ -7,7 +7,7 @@ import Text from '../src/components/text.partial';
7
7
 
8
8
  export default () => {
9
9
  return (
10
- <Inline space="100">
10
+ <Inline space="space.100">
11
11
  <Box
12
12
  paddingBlock="space.400"
13
13
  paddingInline="space.400"
package/examples/02-text.tsx CHANGED
@@ -8,14 +8,14 @@ import { UNSAFE_Box as Box, UNSAFE_Text as Text } from '../src';
8
8
 
9
9
  export default () => {
10
10
  return (
11
- <Stack space="300">
11
+ <Stack space="space.300">
12
12
  <Heading level="h400" as="h3">
13
13
  Text examples
14
14
  </Heading>
15
- <Stack space="200">
15
+ <Stack space="space.200">
16
16
  <Box display="block">
17
17
  <Heading level="h300">Font size</Heading>
18
- <Inline space="200" testId="font-sizes">
18
+ <Inline space="space.200" testId="font-sizes">
19
19
  {(
20
20
  [
21
21
  'size.050',
@@ -38,7 +38,7 @@ export default () => {
38
38
  <Heading level="h300" as="h4">
39
39
  Font weight
40
40
  </Heading>
41
- <Inline space="200" testId="font-weights">
41
+ <Inline space="space.200" testId="font-weights">
42
42
  {(['regular', 'medium', 'semibold', 'bold'] as const).map(
43
43
  (fontWeight) => (
44
44
  <Text key={fontWeight} fontWeight={fontWeight}>
@@ -52,7 +52,7 @@ export default () => {
52
52
  <Heading level="h300" as="h4">
53
53
  Line height
54
54
  </Heading>
55
- <Inline space="200" testId="line-heights" alignBlock="center">
55
+ <Inline space="space.200" testId="line-heights" alignBlock="center">
56
56
  {(
57
57
  [
58
58
  'lineHeight.100',
@@ -77,7 +77,7 @@ export default () => {
77
77
  <Heading level="h300" as="h4">
78
78
  Testing
79
79
  </Heading>
80
- <Stack space="050" testId="testing">
80
+ <Stack space="space.050" testId="testing">
81
81
  <Text as="p">Paragraph</Text>
82
82
  <Text as="div">A div</Text>
83
83
  <Text>
package/examples/06-section-message.tsx CHANGED
@@ -18,18 +18,18 @@ import Text from '../src/components/text.partial';
18
18
 
19
19
  export default () => {
20
20
  return (
21
- <Stack space="100">
21
+ <Stack space="space.100">
22
22
  <Box
23
23
  paddingBlock="space.200"
24
24
  paddingInline="space.200"
25
25
  backgroundColor="information"
26
26
  >
27
- <Inline space="200">
27
+ <Inline space="space.200">
28
28
  <InfoIcon
29
29
  primaryColor={token('color.icon.information')}
30
30
  label="info"
31
31
  />
32
- <Stack space="100">
32
+ <Stack space="space.100">
33
33
  <Heading as="h1" level="h500">
34
34
  The Modern Prometheus
35
35
  </Heading>
@@ -40,7 +40,7 @@ export default () => {
40
40
  to assure my dear sister of my welfare and increasing confidence
41
41
  in the success of my undertaking.
42
42
  </Text>
43
- <Inline separator="·" space="075">
43
+ <Inline separator="·" space="space.075">
44
44
  <Button
45
45
  appearance="link"
46
46
  spacing="none"
package/examples/07-comment.tsx CHANGED
@@ -27,8 +27,8 @@ const CommentAction = ({ children }: any) => {
27
27
  export default () => {
28
28
  return (
29
29
  <Box>
30
- <Stack space="050">
31
- <Inline space="100" alignBlock="center">
30
+ <Stack space="space.050">
31
+ <Inline space="space.100" alignBlock="center">
32
32
  <Author>Jane Citizen</Author>
33
33
  <Lozenge>Author</Lozenge>
34
34
  <Date>Jun 15, 2022</Date>
@@ -41,7 +41,7 @@ export default () => {
41
41
  aliquip ex ea commodo consequat.
42
42
  </Text>
43
43
  <Box color="subtle">
44
- <Inline space="100" separator="·">
44
+ <Inline space="space.100" separator="·">
45
45
  <CommentAction>Reply</CommentAction>
46
46
  <CommentAction>Edit</CommentAction>
47
47
  <CommentAction>Like</CommentAction>
package/examples/08-lozenge.tsx CHANGED
@@ -8,7 +8,7 @@ import { UNSAFE_Box as Box, UNSAFE_Text as Text } from '../src';
8
8
 
9
9
  export default () => {
10
10
  return (
11
- <Inline space="200">
11
+ <Inline space="space.200">
12
12
  <Lozenge>Default</Lozenge>
13
13
  <Box
14
14
  backgroundColor="neutral"
package/examples/99-interactions.tsx CHANGED
@@ -36,9 +36,9 @@ const fieldsetStyles = css({
36
36
  export default () => {
37
37
  return (
38
38
  <Box width="size.500" padding="space.100" testId="all">
39
- <Stack space="200">
39
+ <Stack space="space.200">
40
40
  <Heading level="h400">Current ADS Buttons</Heading>
41
- <Inline space="200">
41
+ <Inline space="space.200">
42
42
  <Button appearance="primary">brand.bold</Button>
43
43
  <Button appearance="default">neutral</Button>
44
44
  <Button appearance="warning">warning.bold</Button>
@@ -46,7 +46,7 @@ export default () => {
46
46
  <Heading level="h400">
47
47
  Buttons with <Code>InteractionSurface</Code>
48
48
  </Heading>
49
- <Inline space="200" testId="buttons">
49
+ <Inline space="space.200" testId="buttons">
50
50
  {(['brand.bold', 'neutral', 'warning.bold'] as const).map((app) => (
51
51
  <FocusRing key={app}>
52
52
  <Box
@@ -74,7 +74,7 @@ export default () => {
74
74
  <Heading level="h400">
75
75
  Icon Buttons with <Code>InteractionSurface</Code>
76
76
  </Heading>
77
- <Inline space="200" testId="icon-buttons">
77
+ <Inline space="space.200" testId="icon-buttons">
78
78
  <FocusRing>
79
79
  <Box
80
80
  as="button"
@@ -129,7 +129,7 @@ export default () => {
129
129
  <Heading level="h400">
130
130
  Progress Indicator with <Code>InteractionSurface</Code>
131
131
  </Heading>
132
- <Inline space="200" testId="progress-indicators">
132
+ <Inline space="space.200" testId="progress-indicators">
133
133
  {(['brand.bold', 'neutral', 'warning.bold'] as const).map((app) => (
134
134
  <FocusRing>
135
135
  <Box
@@ -149,7 +149,7 @@ export default () => {
149
149
  ))}
150
150
  </Inline>
151
151
  <Heading level="h400">Textfield / input spikes</Heading>
152
- <Inline space="200">
152
+ <Inline space="space.200">
153
153
  <Textfield />
154
154
  <Box
155
155
  as="fieldset"
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@atlaskit/ds-explorations",
3
- "version": "2.0.11",
3
+ "version": "2.0.12",
4
4
  "description": "An experimental package for exploration and validation of spacing / typography foundations.",
5
5
  "license": "Apache-2.0",
6
6
  "atlassian": {
@@ -56,7 +56,7 @@
56
56
  "@atlaskit/heading": "*",
57
57
  "@atlaskit/icon": "*",
58
58
  "@atlaskit/lozenge": "*",
59
- "@atlaskit/primitives": "^0.7.0",
59
+ "@atlaskit/primitives": "^0.8.0",
60
60
  "@atlaskit/section-message": "*",
61
61
  "@atlaskit/ssr": "*",
62
62
  "@atlaskit/textfield": "*",