@digigov/react-core 2.0.0-a402a664 → 2.0.0-a594a958

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 (103) hide show
  1. package/AccordionSection/index.web.d.ts +0 -1
  2. package/AccordionSection/index.web.js.map +2 -2
  3. package/AccordionSectionSummaryHeading/index.d.ts +1 -0
  4. package/AccordionSectionSummaryHeading/index.js +3 -2
  5. package/AccordionSectionSummaryHeading/index.js.map +2 -2
  6. package/BannerContainer/index.js +1 -1
  7. package/BannerContainer/index.js.map +2 -2
  8. package/{CircularProgress → CircularProgressBase}/index.d.ts +5 -5
  9. package/{CircularProgress → CircularProgressBase}/index.js +4 -4
  10. package/CircularProgressBase/index.js.map +7 -0
  11. package/{CircularProgress → CircularProgressBase}/package.json +1 -1
  12. package/DetailsContent/index.d.ts +1 -0
  13. package/DetailsContent/index.js +3 -2
  14. package/DetailsContent/index.js.map +2 -2
  15. package/Grid/index.d.ts +1 -7
  16. package/Grid/index.js.map +2 -2
  17. package/NavListItemActionBase/index.js +2 -2
  18. package/NavListItemActionBase/index.js.map +2 -2
  19. package/SummaryList/index.d.ts +10 -2
  20. package/SummaryList/index.js +10 -2
  21. package/SummaryList/index.js.map +2 -2
  22. package/SummaryListItem/index.js +1 -1
  23. package/SummaryListItem/index.js.map +2 -2
  24. package/SummaryListItemKey/index.d.ts +14 -0
  25. package/SummaryListItemKey/index.js +14 -2
  26. package/SummaryListItemKey/index.js.map +2 -2
  27. package/SummaryListItemValue/index.d.ts +14 -0
  28. package/SummaryListItemValue/index.js +11 -2
  29. package/SummaryListItemValue/index.js.map +2 -2
  30. package/TableDataCell/index.d.ts +9 -0
  31. package/TableDataCell/index.js +8 -1
  32. package/TableDataCell/index.js.map +2 -2
  33. package/cjs/AccordionSection/index.web.js.map +2 -2
  34. package/cjs/AccordionSectionSummaryHeading/index.js +3 -2
  35. package/cjs/AccordionSectionSummaryHeading/index.js.map +2 -2
  36. package/cjs/BannerContainer/index.js +1 -1
  37. package/cjs/BannerContainer/index.js.map +2 -2
  38. package/cjs/{CircularProgress → CircularProgressBase}/index.js +8 -8
  39. package/cjs/CircularProgressBase/index.js.map +7 -0
  40. package/cjs/DetailsContent/index.js +3 -2
  41. package/cjs/DetailsContent/index.js.map +2 -2
  42. package/cjs/Grid/index.js.map +2 -2
  43. package/cjs/NavListItemActionBase/index.js +2 -2
  44. package/cjs/NavListItemActionBase/index.js.map +2 -2
  45. package/cjs/SummaryList/index.js +10 -2
  46. package/cjs/SummaryList/index.js.map +2 -2
  47. package/cjs/SummaryListItem/index.js +1 -1
  48. package/cjs/SummaryListItem/index.js.map +2 -2
  49. package/cjs/SummaryListItemKey/index.js +14 -2
  50. package/cjs/SummaryListItemKey/index.js.map +3 -3
  51. package/cjs/SummaryListItemValue/index.js +11 -2
  52. package/cjs/SummaryListItemValue/index.js.map +3 -3
  53. package/cjs/TableDataCell/index.js +8 -1
  54. package/cjs/TableDataCell/index.js.map +3 -3
  55. package/cjs/index.js +2 -2
  56. package/cjs/index.js.map +2 -2
  57. package/cjs/lazy/index.js +1 -1
  58. package/cjs/lazy.js.map +2 -2
  59. package/cjs/registry/index.js +4 -4
  60. package/cjs/registry.js.map +2 -2
  61. package/index.d.ts +1 -1
  62. package/index.js +2 -2
  63. package/index.js.map +1 -1
  64. package/lazy/index.js +1 -1
  65. package/package.json +3 -3
  66. package/registry/index.js +4 -4
  67. package/src/Accordion/__snapshots__/index.test.tsx.snap +48 -0
  68. package/src/Accordion/index.test.tsx +24 -0
  69. package/src/AccordionSection/index.web.tsx +0 -1
  70. package/src/AccordionSectionSummaryHeading/__snapshots__/index.test.tsx.snap +17 -0
  71. package/src/AccordionSectionSummaryHeading/index.test.tsx +9 -0
  72. package/src/AccordionSectionSummaryHeading/index.tsx +9 -2
  73. package/src/BannerContainer/__snapshots__/index.test.tsx.snap +1 -1
  74. package/src/BannerContainer/index.tsx +1 -1
  75. package/src/{CircularProgress → CircularProgressBase}/__snapshots__/index.test.tsx.snap +6 -6
  76. package/src/CircularProgressBase/index.test.tsx +38 -0
  77. package/src/{CircularProgress → CircularProgressBase}/index.tsx +7 -7
  78. package/src/DetailsContent/index.tsx +11 -2
  79. package/src/Grid/index.tsx +1 -7
  80. package/src/NavListItemActionBase/__snapshots__/index.test.tsx.snap +0 -1
  81. package/src/NavListItemActionBase/index.tsx +2 -2
  82. package/src/SummaryList/__snapshots__/index.test.tsx.snap +36 -0
  83. package/src/SummaryList/index.test.tsx +15 -0
  84. package/src/SummaryList/index.tsx +20 -3
  85. package/src/SummaryListItem/index.tsx +1 -1
  86. package/src/SummaryListItemKey/__snapshots__/index.test.tsx.snap +70 -0
  87. package/src/SummaryListItemKey/index.test.tsx +29 -0
  88. package/src/SummaryListItemKey/index.tsx +29 -1
  89. package/src/SummaryListItemValue/__snapshots__/index.test.tsx.snap +34 -0
  90. package/src/SummaryListItemValue/index.test.tsx +14 -0
  91. package/src/SummaryListItemValue/index.tsx +30 -2
  92. package/src/TableDataCell/__snapshots__/index.test.tsx.snap +77 -0
  93. package/src/TableDataCell/index.test.tsx +42 -0
  94. package/src/TableDataCell/index.tsx +33 -0
  95. package/src/TableRow/__snapshots__/index.test.tsx.snap +1 -1
  96. package/src/TableRow/index.test.tsx +1 -1
  97. package/src/index.ts +1 -1
  98. package/src/lazy.js +1 -1
  99. package/src/registry.js +4 -4
  100. package/CircularProgress/index.js.map +0 -7
  101. package/cjs/CircularProgress/index.js.map +0 -7
  102. package/src/CircularProgress/index.test.tsx +0 -34
  103. /package/{CircularProgress → CircularProgressBase}/index.test.d.ts +0 -0
package/src/SummaryListItemValue/index.test.tsx CHANGED
@@ -8,3 +8,17 @@ it('renders the SummaryListItemValue with no props', () => {
8
8
  render(<SummaryListItemValue>hello</SummaryListItemValue>).baseElement
9
9
  ).toMatchSnapshot();
10
10
  });
11
+ it('renders the SummaryListItemValue with error="true', () => {
12
+ expect(
13
+ render(<SummaryListItemValue error>hello</SummaryListItemValue>).baseElement
14
+ ).toMatchSnapshot();
15
+ });
16
+ it('renders the SummaryListItemValue with error="true and errorAssistiveText="wrong', () => {
17
+ expect(
18
+ render(
19
+ <SummaryListItemValue error errorAssistiveText="wrong">
20
+ hello
21
+ </SummaryListItemValue>
22
+ ).baseElement
23
+ ).toMatchSnapshot();
24
+ });
package/src/SummaryListItemValue/index.tsx CHANGED
@@ -1,24 +1,52 @@
1
1
  import React from 'react';
2
2
  import clsx from 'clsx';
3
3
  import Base, { BaseProps } from '@digigov/react-core/Base';
4
+ import VisuallyHidden from '@digigov/react-core/VisuallyHidden';
4
5
 
5
- export interface SummaryListItemValueProps extends BaseProps<'dd'> {}
6
+ export interface SummaryListItemValueProps extends BaseProps<'dd'> {
7
+ /**
8
+ * error is optional.
9
+ * Use error prop to highlight the SummaryListItemKey when there is an error in the corresponding field.
10
+ * @value true
11
+ * @value false
12
+ * @default false
13
+ */
14
+
15
+ error?: boolean;
16
+ /**
17
+ * errorAssistiveText is optional.
18
+ * Default value is "Λανθασμένο πεδίο".
19
+ * errorAssistiveText is used to provide a textual warning for assistive technologies like screen readers.
20
+ */
21
+ errorAssistiveText?: string;
22
+ }
6
23
  /**
7
24
  * Details for the SummaryListItemValue.
8
25
  */
9
26
  export const SummaryListItemValue = React.forwardRef<
10
27
  HTMLElement,
11
28
  SummaryListItemValueProps
12
- >(function SummaryListItemValue({ className, children, ...props }, ref) {
29
+ >(function SummaryListItemValue(
30
+ {
31
+ error,
32
+ errorAssistiveText = 'Λανθασμένο πεδίο',
33
+ className,
34
+ children,
35
+ ...props
36
+ },
37
+ ref
38
+ ) {
13
39
  return (
14
40
  <Base
15
41
  as="dd"
16
42
  ref={ref}
17
43
  className={clsx(className, {
18
44
  'ds-summary-list__value': true,
45
+ 'ds-summary-list__value--error': error === true,
19
46
  })}
20
47
  {...props}
21
48
  >
49
+ {error === true && <VisuallyHidden>{errorAssistiveText}</VisuallyHidden>}
22
50
  {children}
23
51
  </Base>
24
52
  );
package/src/TableDataCell/__snapshots__/index.test.tsx.snap CHANGED
@@ -24,6 +24,35 @@ exports[`renders the Table with dataType numeric prop 1`] = `
24
24
  </body>
25
25
  `;
26
26
 
27
+ exports[`renders the Table with highlight warning prop 1`] = `
28
+ <body>
29
+ <div>
30
+ <table
31
+ class="ds-table"
32
+ >
33
+ <tbody
34
+ class="ds-table__body"
35
+ >
36
+ <tr
37
+ class="ds-table__row"
38
+ >
39
+ <td
40
+ class="ds-table__cell ds-table__cell--border ds-table__cell--warning"
41
+ >
42
+ <span
43
+ class="ds-visually-hidden"
44
+ >
45
+ Προσοχή
46
+ </span>
47
+ hello
48
+ </td>
49
+ </tr>
50
+ </tbody>
51
+ </table>
52
+ </div>
53
+ </body>
54
+ `;
55
+
27
56
  exports[`renders the Table with no props 1`] = `
28
57
  <body>
29
58
  <div>
@@ -47,3 +76,51 @@ exports[`renders the Table with no props 1`] = `
47
76
  </div>
48
77
  </body>
49
78
  `;
79
+
80
+ exports[`renders the Table with variant border prop 1`] = `
81
+ <body>
82
+ <div>
83
+ <table
84
+ class="ds-table"
85
+ >
86
+ <tbody
87
+ class="ds-table__body"
88
+ >
89
+ <tr
90
+ class="ds-table__row"
91
+ >
92
+ <td
93
+ class="ds-table__cell ds-table__cell--border"
94
+ >
95
+ hello
96
+ </td>
97
+ </tr>
98
+ </tbody>
99
+ </table>
100
+ </div>
101
+ </body>
102
+ `;
103
+
104
+ exports[`renders the Table with wordBreak break-all prop 1`] = `
105
+ <body>
106
+ <div>
107
+ <table
108
+ class="ds-table"
109
+ >
110
+ <tbody
111
+ class="ds-table__body"
112
+ >
113
+ <tr
114
+ class="ds-table__row"
115
+ >
116
+ <td
117
+ class="ds-table__cell ds-table__cell--border ds-table__cell--break-all"
118
+ >
119
+ hello
120
+ </td>
121
+ </tr>
122
+ </tbody>
123
+ </table>
124
+ </div>
125
+ </body>
126
+ `;
package/src/TableDataCell/index.test.tsx CHANGED
@@ -33,3 +33,45 @@ it('renders the Table with dataType numeric prop', () => {
33
33
  ).baseElement
34
34
  ).toMatchSnapshot();
35
35
  });
36
+
37
+ it('renders the Table with variant border prop', () => {
38
+ expect(
39
+ render(
40
+ <Table>
41
+ <TableBody>
42
+ <TableRow>
43
+ <TableDataCell variant="border">hello</TableDataCell>
44
+ </TableRow>
45
+ </TableBody>
46
+ </Table>
47
+ ).baseElement
48
+ ).toMatchSnapshot();
49
+ });
50
+
51
+ it('renders the Table with wordBreak break-all prop', () => {
52
+ expect(
53
+ render(
54
+ <Table>
55
+ <TableBody>
56
+ <TableRow>
57
+ <TableDataCell wordBreak="break-all">hello</TableDataCell>
58
+ </TableRow>
59
+ </TableBody>
60
+ </Table>
61
+ ).baseElement
62
+ ).toMatchSnapshot();
63
+ });
64
+
65
+ it('renders the Table with highlight warning prop', () => {
66
+ expect(
67
+ render(
68
+ <Table>
69
+ <TableBody>
70
+ <TableRow>
71
+ <TableDataCell highlight="warning">hello</TableDataCell>
72
+ </TableRow>
73
+ </TableBody>
74
+ </Table>
75
+ ).baseElement
76
+ ).toMatchSnapshot();
77
+ });
package/src/TableDataCell/index.tsx CHANGED
@@ -1,6 +1,7 @@
1
1
  import React from 'react';
2
2
  import clsx from 'clsx';
3
3
  import Base, { BaseProps } from '@digigov/react-core/Base';
4
+ import VisuallyHidden from '@digigov/react-core/VisuallyHidden';
4
5
  // import PhaseBannerTag from '@digigov/react-core/PhaseBannerTag';
5
6
 
6
7
  export interface TableDataCellProps extends BaseProps<'td'> {
@@ -26,6 +27,23 @@ export interface TableDataCellProps extends BaseProps<'td'> {
26
27
  * Use this prop to control the word break of the table-cell contents.
27
28
  */
28
29
  wordBreak?: 'break-all' | 'none';
30
+
31
+ /**
32
+ * highlight is optional.
33
+ * Add the highlight prop to add a highlight line on the left of the row.
34
+ * @value 'warning' warning highlight line
35
+ * @value 'error' error highlight line
36
+ * @default undefined
37
+ */
38
+ highlight?: 'warning' | 'error';
39
+
40
+ /*
41
+ * highlightAssistiveText is optional.
42
+ * Use this prop to add assistive text for screen readers when the highlight prop is used.
43
+ * This text will be visually hidden.
44
+ * @default undefined
45
+ */
46
+ highlightAssistiveText?: string;
29
47
  }
30
48
  /**
31
49
  * Use TableDataCell inside the Table component to fill the data of a cell in a table.
@@ -38,12 +56,22 @@ export const TableDataCell = React.forwardRef<
38
56
  dataType = 'text',
39
57
  variant = 'border',
40
58
  wordBreak = 'none',
59
+ highlight,
60
+ highlightAssistiveText,
41
61
  className,
42
62
  children,
43
63
  ...props
44
64
  },
45
65
  ref
46
66
  ) {
67
+ const calculatedHighlightAssistiveText =
68
+ highlightAssistiveText ||
69
+ (highlight === 'warning'
70
+ ? 'Προσοχή'
71
+ : highlight === 'error'
72
+ ? 'Λανθασμένο πεδίο'
73
+ : undefined);
74
+
47
75
  return (
48
76
  <Base
49
77
  as="td"
@@ -53,9 +81,14 @@ export const TableDataCell = React.forwardRef<
53
81
  'ds-table__cell--border': variant === 'border',
54
82
  'ds-table__cell--break-all': wordBreak === 'break-all',
55
83
  'ds-table__cell--numeric': dataType === 'numeric',
84
+ 'ds-table__cell--warning': highlight === 'warning',
85
+ 'ds-table__cell--error': highlight === 'error',
56
86
  })}
57
87
  {...props}
58
88
  >
89
+ {calculatedHighlightAssistiveText && (
90
+ <VisuallyHidden>{calculatedHighlightAssistiveText}</VisuallyHidden>
91
+ )}
59
92
  {children}
60
93
  </Base>
61
94
  );
package/src/TableRow/__snapshots__/index.test.tsx.snap CHANGED
@@ -18,7 +18,7 @@ exports[`renders the Table with color="secondary" prop 1`] = `
18
18
  </body>
19
19
  `;
20
20
 
21
- exports[`renders the Table with highlight prop 1`] = `
21
+ exports[`renders the Table with highlight="true" prop 1`] = `
22
22
  <body>
23
23
  <div>
24
24
  <table
package/src/TableRow/index.test.tsx CHANGED
@@ -17,7 +17,7 @@ it('renders the Table with no props', () => {
17
17
  ).toMatchSnapshot();
18
18
  });
19
19
 
20
- it('renders the Table with highlight prop', () => {
20
+ it('renders the Table with highlight="true" prop', () => {
21
21
  expect(
22
22
  render(
23
23
  <Table>
package/src/index.ts CHANGED
@@ -190,7 +190,7 @@ export * from '@digigov/react-core/PaginationList';
190
190
  export * from '@digigov/react-core/PaginationListItem';
191
191
  export * from '@digigov/react-core/PaginationLabelContainer';
192
192
  export * from '@digigov/react-core/LoaderContainer';
193
- export * from '@digigov/react-core/CircularProgress';
193
+ export * from '@digigov/react-core/CircularProgressBase';
194
194
  export * from '@digigov/react-core/FullPageBackground';
195
195
  export * from '@digigov/react-core/StepNavCircleNumber';
196
196
  export * from '@digigov/react-core/StepNav';
package/src/lazy.js CHANGED
@@ -191,7 +191,7 @@ export default {
191
191
  'PaginationListItem': lazy(() => import('@digigov/react-core/PaginationListItem').then((module) => ({ default: module['PaginationListItem'] }))),
192
192
  'PaginationLabelContainer': lazy(() => import('@digigov/react-core/PaginationLabelContainer').then((module) => ({ default: module['PaginationLabelContainer'] }))),
193
193
  'LoaderContainer': lazy(() => import('@digigov/react-core/LoaderContainer').then((module) => ({ default: module['LoaderContainer'] }))),
194
- 'CircularProgress': lazy(() => import('@digigov/react-core/CircularProgress').then((module) => ({ default: module['CircularProgress'] }))),
194
+ 'CircularProgressBase': lazy(() => import('@digigov/react-core/CircularProgressBase').then((module) => ({ default: module['CircularProgressBase'] }))),
195
195
  'FullPageBackground': lazy(() => import('@digigov/react-core/FullPageBackground').then((module) => ({ default: module['FullPageBackground'] }))),
196
196
  'StepNavCircleNumber': lazy(() => import('@digigov/react-core/StepNavCircleNumber').then((module) => ({ default: module['StepNavCircleNumber'] }))),
197
197
  'StepNav': lazy(() => import('@digigov/react-core/StepNav').then((module) => ({ default: module['StepNav'] }))),
package/src/registry.js CHANGED
@@ -3,9 +3,9 @@ import * as _digigov_react_core from "@digigov/react-core";
3
3
  import * as _digigov_react_core_Accordion from "@digigov/react-core/Accordion";
4
4
  import * as _digigov_react_core_Accordion_index_web from "@digigov/react-core/Accordion/index.web";
5
5
  import * as _digigov_react_core_AccordionControls from "@digigov/react-core/AccordionControls";
6
- import * as _digigov_react_core_AccordionSectionContent from "@digigov/react-core/AccordionSectionContent";
7
6
  import * as _digigov_react_core_AccordionSection from "@digigov/react-core/AccordionSection";
8
7
  import * as _digigov_react_core_AccordionSection_index_web from "@digigov/react-core/AccordionSection/index.web";
8
+ import * as _digigov_react_core_AccordionSectionContent from "@digigov/react-core/AccordionSectionContent";
9
9
  import * as _digigov_react_core_AccordionSectionSummary from "@digigov/react-core/AccordionSectionSummary";
10
10
  import * as _digigov_react_core_AccordionSectionSummaryHeading from "@digigov/react-core/AccordionSectionSummaryHeading";
11
11
  import * as _digigov_react_core_AdminAside from "@digigov/react-core/AdminAside";
@@ -60,7 +60,7 @@ import * as _digigov_react_core_ChipContainer from "@digigov/react-core/ChipCont
60
60
  import * as _digigov_react_core_ChipHeading from "@digigov/react-core/ChipHeading";
61
61
  import * as _digigov_react_core_ChipKeyValue from "@digigov/react-core/ChipKeyValue";
62
62
  import * as _digigov_react_core_ChoiceDividerText from "@digigov/react-core/ChoiceDividerText";
63
- import * as _digigov_react_core_CircularProgress from "@digigov/react-core/CircularProgress";
63
+ import * as _digigov_react_core_CircularProgressBase from "@digigov/react-core/CircularProgressBase";
64
64
  import * as _digigov_react_core_CloseButton from "@digigov/react-core/CloseButton";
65
65
  import * as _digigov_react_core_Code from "@digigov/react-core/Code";
66
66
  import * as _digigov_react_core_CodeBlockContainer from "@digigov/react-core/CodeBlockContainer";
@@ -286,9 +286,9 @@ export default {
286
286
  '@digigov/react-core/Accordion': lazyImport(_digigov_react_core_Accordion),
287
287
  '@digigov/react-core/Accordion/index.web': lazyImport(_digigov_react_core_Accordion_index_web),
288
288
  '@digigov/react-core/AccordionControls': lazyImport(_digigov_react_core_AccordionControls),
289
- '@digigov/react-core/AccordionSectionContent': lazyImport(_digigov_react_core_AccordionSectionContent),
290
289
  '@digigov/react-core/AccordionSection': lazyImport(_digigov_react_core_AccordionSection),
291
290
  '@digigov/react-core/AccordionSection/index.web': lazyImport(_digigov_react_core_AccordionSection_index_web),
291
+ '@digigov/react-core/AccordionSectionContent': lazyImport(_digigov_react_core_AccordionSectionContent),
292
292
  '@digigov/react-core/AccordionSectionSummary': lazyImport(_digigov_react_core_AccordionSectionSummary),
293
293
  '@digigov/react-core/AccordionSectionSummaryHeading': lazyImport(_digigov_react_core_AccordionSectionSummaryHeading),
294
294
  '@digigov/react-core/AdminAside': lazyImport(_digigov_react_core_AdminAside),
@@ -343,7 +343,7 @@ export default {
343
343
  '@digigov/react-core/ChipHeading': lazyImport(_digigov_react_core_ChipHeading),
344
344
  '@digigov/react-core/ChipKeyValue': lazyImport(_digigov_react_core_ChipKeyValue),
345
345
  '@digigov/react-core/ChoiceDividerText': lazyImport(_digigov_react_core_ChoiceDividerText),
346
- '@digigov/react-core/CircularProgress': lazyImport(_digigov_react_core_CircularProgress),
346
+ '@digigov/react-core/CircularProgressBase': lazyImport(_digigov_react_core_CircularProgressBase),
347
347
  '@digigov/react-core/CloseButton': lazyImport(_digigov_react_core_CloseButton),
348
348
  '@digigov/react-core/Code': lazyImport(_digigov_react_core_Code),
349
349
  '@digigov/react-core/CodeBlockContainer': lazyImport(_digigov_react_core_CodeBlockContainer),
package/CircularProgress/index.js.map DELETED
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../src/CircularProgress/index.tsx"],
4
- "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface CircularProgressProps extends BaseProps<'svg'> {\n /**\n * color prop is optional.\n * color prop is used to change the color of the loader.\n * @value 'primary' is the default color.\n * @value 'secondary' recommended for dark backgrounds.\n * @default 'primary'\n */\n color?: 'primary' | 'secondary';\n /**\n * size prop is optional.\n * size prop is used to change the size of the loader.\n * @value 'sm'\n * @value 'md'\n * @value 'lg'\n * @default 'md'\n */\n size?: 'sm' | 'md' | 'lg';\n}\n/**\n * Use CircularProgress component as an animated loader.\n * CircularProgress can be used inside LoaderContainer component.\n */\nexport const CircularProgress = React.forwardRef<\n SVGSVGElement,\n CircularProgressProps\n>(function CircularProgress(\n { color = 'primary', size = 'md', className, ...props },\n ref\n) {\n return (\n <Base\n as=\"svg\"\n ref={ref}\n className={clsx(className, {\n 'ds-circular-progress': true,\n 'ds-circular-progress--secondary': color === 'secondary',\n 'ds-circular-progress--sm': size === 'sm',\n 'ds-circular-progress--md': size === 'md',\n 'ds-circular-progress--lg': size === 'lg',\n })}\n focusable=\"false\"\n viewBox=\"0 0 200 200\"\n aria-hidden=\"true\"\n {...props}\n >\n <path\n className=\"ds-circular-progress__circle ds-circular-progress__circle--1\"\n d=\"M26,99.551C26,55.478,60.246,27.5,99.85,27.5S174,55.478,174,99.551,139.455,172.5,99.85,172.5C60.273,172.473,26,143.6,26,99.551Z\"\n />\n <path\n className=\"ds-circular-progress__circle ds-circular-progress__circle--2\"\n d=\"M26,99.551C26,55.478,60.246,27.5,99.85,27.5S174,55.478,174,99.551,139.455,172.5,99.85,172.5C60.273,172.473,26,143.6,26,99.551Z\"\n />\n </Base>\n );\n});\n\nexport default CircularProgress;\n"],
5
- "mappings": "AAAA,OAAO,WAAW;AAClB,OAAO,UAAU;AACjB,OAAO,UAAyB;AAyBzB,MAAM,mBAAmB,MAAM,WAGpC,SAASA,kBACT,EAAE,QAAQ,WAAW,OAAO,MAAM,WAAW,GAAG,MAAM,GACtD,KACA;AACA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,IAAG;AAAA,MACH;AAAA,MACA,WAAW,KAAK,WAAW;AAAA,QACzB,wBAAwB;AAAA,QACxB,mCAAmC,UAAU;AAAA,QAC7C,4BAA4B,SAAS;AAAA,QACrC,4BAA4B,SAAS;AAAA,QACrC,4BAA4B,SAAS;AAAA,MACvC,CAAC;AAAA,MACD,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,eAAY;AAAA,MACX,GAAG;AAAA;AAAA,IAEJ;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,GAAE;AAAA;AAAA,IACJ;AAAA,IACA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,GAAE;AAAA;AAAA,IACJ;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,2BAAQ;",
6
- "names": ["CircularProgress"]
7
- }
package/cjs/CircularProgress/index.js.map DELETED
@@ -1,7 +0,0 @@
1
- {
2
- "version": 3,
3
- "sources": ["../../../src/CircularProgress/index.tsx"],
4
- "sourcesContent": ["import React from 'react';\nimport clsx from 'clsx';\nimport Base, { BaseProps } from '@digigov/react-core/Base';\n\nexport interface CircularProgressProps extends BaseProps<'svg'> {\n /**\n * color prop is optional.\n * color prop is used to change the color of the loader.\n * @value 'primary' is the default color.\n * @value 'secondary' recommended for dark backgrounds.\n * @default 'primary'\n */\n color?: 'primary' | 'secondary';\n /**\n * size prop is optional.\n * size prop is used to change the size of the loader.\n * @value 'sm'\n * @value 'md'\n * @value 'lg'\n * @default 'md'\n */\n size?: 'sm' | 'md' | 'lg';\n}\n/**\n * Use CircularProgress component as an animated loader.\n * CircularProgress can be used inside LoaderContainer component.\n */\nexport const CircularProgress = React.forwardRef<\n SVGSVGElement,\n CircularProgressProps\n>(function CircularProgress(\n { color = 'primary', size = 'md', className, ...props },\n ref\n) {\n return (\n <Base\n as=\"svg\"\n ref={ref}\n className={clsx(className, {\n 'ds-circular-progress': true,\n 'ds-circular-progress--secondary': color === 'secondary',\n 'ds-circular-progress--sm': size === 'sm',\n 'ds-circular-progress--md': size === 'md',\n 'ds-circular-progress--lg': size === 'lg',\n })}\n focusable=\"false\"\n viewBox=\"0 0 200 200\"\n aria-hidden=\"true\"\n {...props}\n >\n <path\n className=\"ds-circular-progress__circle ds-circular-progress__circle--1\"\n d=\"M26,99.551C26,55.478,60.246,27.5,99.85,27.5S174,55.478,174,99.551,139.455,172.5,99.85,172.5C60.273,172.473,26,143.6,26,99.551Z\"\n />\n <path\n className=\"ds-circular-progress__circle ds-circular-progress__circle--2\"\n d=\"M26,99.551C26,55.478,60.246,27.5,99.85,27.5S174,55.478,174,99.551,139.455,172.5,99.85,172.5C60.273,172.473,26,143.6,26,99.551Z\"\n />\n </Base>\n );\n});\n\nexport default CircularProgress;\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,kBAAiB;AACjB,kBAAgC;AAyBzB,MAAM,mBAAmB,aAAAA,QAAM,WAGpC,SAASC,kBACT,EAAE,QAAQ,WAAW,OAAO,MAAM,WAAW,GAAG,MAAM,GACtD,KACA;AACA,SACE,6BAAAD,QAAA;AAAA,IAAC,YAAAE;AAAA,IAAA;AAAA,MACC,IAAG;AAAA,MACH;AAAA,MACA,eAAW,YAAAC,SAAK,WAAW;AAAA,QACzB,wBAAwB;AAAA,QACxB,mCAAmC,UAAU;AAAA,QAC7C,4BAA4B,SAAS;AAAA,QACrC,4BAA4B,SAAS;AAAA,QACrC,4BAA4B,SAAS;AAAA,MACvC,CAAC;AAAA,MACD,WAAU;AAAA,MACV,SAAQ;AAAA,MACR,eAAY;AAAA,MACX,GAAG;AAAA;AAAA,IAEJ,6BAAAH,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,GAAE;AAAA;AAAA,IACJ;AAAA,IACA,6BAAAA,QAAA;AAAA,MAAC;AAAA;AAAA,QACC,WAAU;AAAA,QACV,GAAE;AAAA;AAAA,IACJ;AAAA,EACF;AAEJ,CAAC;AAED,IAAO,2BAAQ;",
6
- "names": ["React", "CircularProgress", "Base", "clsx"]
7
- }
package/src/CircularProgress/index.test.tsx DELETED
@@ -1,34 +0,0 @@
1
- import React from 'react';
2
- import { render } from '@testing-library/react';
3
-
4
- import CircularProgress from '@digigov/react-core/CircularProgress';
5
-
6
- it('renders the CircularProgress', () => {
7
- expect(render(<CircularProgress />).baseElement).toMatchSnapshot();
8
- });
9
-
10
- it('renders the CircularProgress with size sm', () => {
11
- expect(render(<CircularProgress size="sm" />).baseElement).toMatchSnapshot();
12
- });
13
-
14
- it('renders the CircularProgress with size lg', () => {
15
- expect(render(<CircularProgress size="lg" />).baseElement).toMatchSnapshot();
16
- });
17
-
18
- it('renders the CircularProgress with color=secondary prop', () => {
19
- expect(
20
- render(<CircularProgress color={'secondary'} />).baseElement
21
- ).toMatchSnapshot();
22
- });
23
-
24
- it('renders the CircularProgress with color=secondary and size sm props', () => {
25
- expect(
26
- render(<CircularProgress color={'secondary'} size="sm" />).baseElement
27
- ).toMatchSnapshot();
28
- });
29
-
30
- it('renders the CircularProgress with color=secondary and size lg props', () => {
31
- expect(
32
- render(<CircularProgress color={'secondary'} size="lg" />).baseElement
33
- ).toMatchSnapshot();
34
- });