@automattic/vip-design-system 0.8.1 → 0.9.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 (90) hide show
  1. package/.eslines.json +10 -0
  2. package/.eslintignore +7 -0
  3. package/.eslintrc.json +23 -0
  4. package/.github/PULL_REQUEST_TEMPLATE.md +22 -0
  5. package/.github/workflows/codeql-analysis.yml +71 -0
  6. package/.github/workflows/nodejs.yaml +29 -0
  7. package/.prettierrc +9 -0
  8. package/.storybook/preview.js +5 -0
  9. package/README.md +38 -1
  10. package/babel.config.js +10 -10
  11. package/build/system/Avatar/Avatar.js +1 -1
  12. package/build/system/Avatar/Avatar.test.js +54 -0
  13. package/build/system/Card/Card.js +8 -5
  14. package/build/system/Dialog/DialogButton.js +0 -2
  15. package/build/system/Dialog/DialogContent.js +1 -1
  16. package/build/system/Form/InlineSelect.js +2 -2
  17. package/build/system/Form/Input.js +8 -5
  18. package/build/system/Form/RadioBoxGroup.js +0 -2
  19. package/build/system/Form/SearchSelect.js +1 -1
  20. package/build/system/Form/Select.js +3 -3
  21. package/build/system/Form/Textarea.js +9 -6
  22. package/build/system/Form/ToggleGroup.js +0 -4
  23. package/build/system/Notice/Notice.js +50 -29
  24. package/build/system/ResourceList/ResourceItem.js +89 -0
  25. package/build/system/ResourceList/ResourceList.js +121 -0
  26. package/build/system/ResourceList/index.js +11 -0
  27. package/build/system/Time/index.js +91 -0
  28. package/build/system/Tooltip/Tooltip.js +4 -3
  29. package/build/system/index.js +7 -2
  30. package/package.json +47 -7
  31. package/src/system/Avatar/Avatar.js +1 -1
  32. package/src/system/Avatar/Avatar.stories.js +0 -5
  33. package/src/system/Avatar/Avatar.test.js +31 -0
  34. package/src/system/Badge/Badge.js +1 -1
  35. package/src/system/Badge/Badge.stories.js +0 -5
  36. package/src/system/BlankState/BlankState.js +2 -2
  37. package/src/system/BlankState/BlankState.stories.js +0 -5
  38. package/src/system/Box/Box.stories.js +0 -5
  39. package/src/system/Button/Button.js +1 -1
  40. package/src/system/Card/Card.js +6 -4
  41. package/src/system/Card/Card.stories.js +0 -5
  42. package/src/system/Code/Code.stories.js +4 -1
  43. package/src/system/ConfirmationDialog/ConfirmationDialog.stories.js +0 -5
  44. package/src/system/Dialog/Dialog.stories.js +0 -5
  45. package/src/system/Dialog/DialogButton.js +0 -1
  46. package/src/system/Dialog/DialogContent.js +14 -1
  47. package/src/system/Flex/Flex.stories.js +0 -5
  48. package/src/system/Form/InlineSelect.js +6 -6
  49. package/src/system/Form/Input.js +5 -3
  50. package/src/system/Form/Input.stories.js +0 -5
  51. package/src/system/Form/RadioBoxGroup.js +1 -2
  52. package/src/system/Form/RadioBoxGroup.stories.js +4 -5
  53. package/src/system/Form/SearchSelect.js +4 -4
  54. package/src/system/Form/Select.js +18 -18
  55. package/src/system/Form/Select.stories.js +1 -1
  56. package/src/system/Form/Textarea.js +6 -4
  57. package/src/system/Form/ToggleGroup.js +34 -37
  58. package/src/system/Form/ToggleGroup.stories.js +30 -32
  59. package/src/system/Form/ToggleRow.js +1 -1
  60. package/src/system/Grid/Grid.stories.js +0 -5
  61. package/src/system/Heading/Heading.stories.js +0 -5
  62. package/src/system/Link/Link.stories.js +0 -5
  63. package/src/system/Notice/Notice.js +30 -11
  64. package/src/system/Notification/Notification.js +2 -2
  65. package/src/system/Notification/Notification.stories.js +0 -5
  66. package/src/system/OptionRow/OptionRow.js +23 -23
  67. package/src/system/OptionRow/OptionRow.stories.js +0 -5
  68. package/src/system/Progress/Progress.stories.js +0 -5
  69. package/src/system/ResourceList/ResourceItem.js +66 -0
  70. package/src/system/ResourceList/ResourceList.js +96 -0
  71. package/src/system/ResourceList/ResourceList.stories.js +300 -0
  72. package/src/system/ResourceList/index.js +7 -0
  73. package/src/system/Spinner/Spinner.stories.js +0 -5
  74. package/src/system/Table/Table.stories.js +0 -5
  75. package/src/system/Table/TableRow.js +1 -1
  76. package/src/system/Tabs/Tabs.stories.js +0 -5
  77. package/src/system/Text/Text.stories.js +0 -5
  78. package/src/system/{Timeline/Timeline.stories.js → Time/Time.stories.js} +5 -5
  79. package/src/system/Time/index.js +62 -0
  80. package/src/system/Tooltip/Tooltip.js +5 -4
  81. package/src/system/Tooltip/Tooltip.stories.js +0 -5
  82. package/src/system/Wizard/Wizard.js +7 -7
  83. package/src/system/Wizard/WizardStep.js +5 -5
  84. package/src/system/Wizard/WizardStepHorizontal.js +1 -1
  85. package/src/system/index.js +27 -4
  86. package/src/system/theme/colors.js +1 -1
  87. package/src/system/theme/index.js +247 -247
  88. package/test/setupAfterEnv.js +13 -0
  89. package/test/setupTests.js +4 -0
  90. package/src/system/Timeline/index.js +0 -40
package/src/system/Timeline/index.js DELETED
@@ -1,40 +0,0 @@
1
- /** @jsxImportSource theme-ui */
2
-
3
- /**
4
- * External dependencies
5
- */
6
- import { Flex, Text } from 'theme-ui';
7
- import { MdWatchLater } from 'react-icons/md';
8
- import PropTypes from 'prop-types';
9
-
10
- const VerticalLine = () => {
11
- return (
12
- <div
13
- sx={ {
14
- borderLeft: '2px solid',
15
- borderColor: 'border',
16
- height: 'calc( 50% - 16px )',
17
- borderRadius: '2px',
18
- } }>
19
- </div>
20
- );
21
- };
22
-
23
- const Timeline = ( { time, ...props } ) => (
24
- <Flex { ...props }>
25
- <Flex sx={ { flexDirection: 'column', justifyContent: 'space-evenly', alignItems: 'center' } }>
26
- <VerticalLine />
27
- <MdWatchLater sx={ { color: 'border' } } size={ 18 }/>
28
- <VerticalLine />
29
- </Flex>
30
- <Flex sx={ { alignItems: 'center', ml: 2 } }>
31
- <Text as="span" sx={ { color: 'muted' } }>{ time }</Text>
32
- </Flex>
33
- </Flex>
34
- );
35
-
36
- Timeline.propTypes = {
37
- time: PropTypes.string,
38
- };
39
-
40
- export { Timeline };