@digigov/react-core 2.0.0-a402a664 → 2.0.0-abd768eb
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/AccordionSectionSummaryHeading/index.d.ts +1 -0
- package/AccordionSectionSummaryHeading/index.js +3 -2
- package/AccordionSectionSummaryHeading/index.js.map +2 -2
- package/{CircularProgress → CircularProgressBase}/index.d.ts +5 -5
- package/{CircularProgress → CircularProgressBase}/index.js +4 -4
- package/CircularProgressBase/index.js.map +7 -0
- package/{CircularProgress → CircularProgressBase}/package.json +1 -1
- package/DetailsContent/index.d.ts +1 -0
- package/DetailsContent/index.js +3 -2
- package/DetailsContent/index.js.map +2 -2
- package/cjs/AccordionSectionSummaryHeading/index.js +3 -2
- package/cjs/AccordionSectionSummaryHeading/index.js.map +2 -2
- package/cjs/{CircularProgress → CircularProgressBase}/index.js +8 -8
- package/cjs/CircularProgressBase/index.js.map +7 -0
- package/cjs/DetailsContent/index.js +3 -2
- package/cjs/DetailsContent/index.js.map +2 -2
- package/cjs/index.js +2 -2
- package/cjs/index.js.map +2 -2
- package/cjs/lazy/index.js +1 -1
- package/cjs/lazy.js.map +2 -2
- package/cjs/registry/index.js +8 -8
- package/cjs/registry.js.map +2 -2
- package/index.d.ts +1 -1
- package/index.js +2 -2
- package/index.js.map +1 -1
- package/lazy/index.js +1 -1
- package/package.json +3 -3
- package/registry/index.js +8 -8
- package/src/AccordionSectionSummaryHeading/index.tsx +9 -2
- package/src/{CircularProgress → CircularProgressBase}/__snapshots__/index.test.tsx.snap +6 -6
- package/src/CircularProgressBase/index.test.tsx +38 -0
- package/src/{CircularProgress → CircularProgressBase}/index.tsx +7 -7
- package/src/DetailsContent/index.tsx +11 -2
- package/src/index.ts +1 -1
- package/src/lazy.js +1 -1
- package/src/registry.js +8 -8
- package/CircularProgress/index.js.map +0 -7
- package/cjs/CircularProgress/index.js.map +0 -7
- package/src/CircularProgress/index.test.tsx +0 -34
- /package/{CircularProgress → CircularProgressBase}/index.test.d.ts +0 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
|
|
2
2
|
|
|
3
|
-
exports[`renders the
|
|
3
|
+
exports[`renders the CircularProgressBase 1`] = `
|
|
4
4
|
<body>
|
|
5
5
|
<div>
|
|
6
6
|
<svg
|
|
@@ -22,7 +22,7 @@ exports[`renders the CircularProgress 1`] = `
|
|
|
22
22
|
</body>
|
|
23
23
|
`;
|
|
24
24
|
|
|
25
|
-
exports[`renders the
|
|
25
|
+
exports[`renders the CircularProgressBase with color=secondary and size lg props 1`] = `
|
|
26
26
|
<body>
|
|
27
27
|
<div>
|
|
28
28
|
<svg
|
|
@@ -44,7 +44,7 @@ exports[`renders the CircularProgress with color=secondary and size lg props 1`]
|
|
|
44
44
|
</body>
|
|
45
45
|
`;
|
|
46
46
|
|
|
47
|
-
exports[`renders the
|
|
47
|
+
exports[`renders the CircularProgressBase with color=secondary and size sm props 1`] = `
|
|
48
48
|
<body>
|
|
49
49
|
<div>
|
|
50
50
|
<svg
|
|
@@ -66,7 +66,7 @@ exports[`renders the CircularProgress with color=secondary and size sm props 1`]
|
|
|
66
66
|
</body>
|
|
67
67
|
`;
|
|
68
68
|
|
|
69
|
-
exports[`renders the
|
|
69
|
+
exports[`renders the CircularProgressBase with color=secondary prop 1`] = `
|
|
70
70
|
<body>
|
|
71
71
|
<div>
|
|
72
72
|
<svg
|
|
@@ -88,7 +88,7 @@ exports[`renders the CircularProgress with color=secondary prop 1`] = `
|
|
|
88
88
|
</body>
|
|
89
89
|
`;
|
|
90
90
|
|
|
91
|
-
exports[`renders the
|
|
91
|
+
exports[`renders the CircularProgressBase with size lg 1`] = `
|
|
92
92
|
<body>
|
|
93
93
|
<div>
|
|
94
94
|
<svg
|
|
@@ -110,7 +110,7 @@ exports[`renders the CircularProgress with size lg 1`] = `
|
|
|
110
110
|
</body>
|
|
111
111
|
`;
|
|
112
112
|
|
|
113
|
-
exports[`renders the
|
|
113
|
+
exports[`renders the CircularProgressBase with size sm 1`] = `
|
|
114
114
|
<body>
|
|
115
115
|
<div>
|
|
116
116
|
<svg
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { render } from '@testing-library/react';
|
|
3
|
+
|
|
4
|
+
import CircularProgressBase from '@digigov/react-core/CircularProgressBase';
|
|
5
|
+
|
|
6
|
+
it('renders the CircularProgressBase', () => {
|
|
7
|
+
expect(render(<CircularProgressBase />).baseElement).toMatchSnapshot();
|
|
8
|
+
});
|
|
9
|
+
|
|
10
|
+
it('renders the CircularProgressBase with size sm', () => {
|
|
11
|
+
expect(
|
|
12
|
+
render(<CircularProgressBase size="sm" />).baseElement
|
|
13
|
+
).toMatchSnapshot();
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
it('renders the CircularProgressBase with size lg', () => {
|
|
17
|
+
expect(
|
|
18
|
+
render(<CircularProgressBase size="lg" />).baseElement
|
|
19
|
+
).toMatchSnapshot();
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
it('renders the CircularProgressBase with color=secondary prop', () => {
|
|
23
|
+
expect(
|
|
24
|
+
render(<CircularProgressBase color={'secondary'} />).baseElement
|
|
25
|
+
).toMatchSnapshot();
|
|
26
|
+
});
|
|
27
|
+
|
|
28
|
+
it('renders the CircularProgressBase with color=secondary and size sm props', () => {
|
|
29
|
+
expect(
|
|
30
|
+
render(<CircularProgressBase color={'secondary'} size="sm" />).baseElement
|
|
31
|
+
).toMatchSnapshot();
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
it('renders the CircularProgressBase with color=secondary and size lg props', () => {
|
|
35
|
+
expect(
|
|
36
|
+
render(<CircularProgressBase color={'secondary'} size="lg" />).baseElement
|
|
37
|
+
).toMatchSnapshot();
|
|
38
|
+
});
|
|
@@ -2,7 +2,7 @@ import React from 'react';
|
|
|
2
2
|
import clsx from 'clsx';
|
|
3
3
|
import Base, { BaseProps } from '@digigov/react-core/Base';
|
|
4
4
|
|
|
5
|
-
export interface
|
|
5
|
+
export interface CircularProgressBaseProps extends BaseProps<'svg'> {
|
|
6
6
|
/**
|
|
7
7
|
* color prop is optional.
|
|
8
8
|
* color prop is used to change the color of the loader.
|
|
@@ -22,12 +22,12 @@ export interface CircularProgressProps extends BaseProps<'svg'> {
|
|
|
22
22
|
size?: 'sm' | 'md' | 'lg';
|
|
23
23
|
}
|
|
24
24
|
/**
|
|
25
|
-
* Use
|
|
26
|
-
*
|
|
25
|
+
* Use CircularProgressBase component as an animated loader.
|
|
26
|
+
* CircularProgressBase can be used inside LoaderContainer component.
|
|
27
27
|
*/
|
|
28
|
-
export const
|
|
29
|
-
|
|
30
|
-
|
|
28
|
+
export const CircularProgressBase = React.forwardRef<
|
|
29
|
+
SVGElement,
|
|
30
|
+
CircularProgressBaseProps
|
|
31
31
|
>(function CircularProgress(
|
|
32
32
|
{ color = 'primary', size = 'md', className, ...props },
|
|
33
33
|
ref
|
|
@@ -60,4 +60,4 @@ export const CircularProgress = React.forwardRef<
|
|
|
60
60
|
);
|
|
61
61
|
});
|
|
62
62
|
|
|
63
|
-
export default
|
|
63
|
+
export default CircularProgressBase;
|
|
@@ -2,7 +2,15 @@ import React from 'react';
|
|
|
2
2
|
import clsx from 'clsx';
|
|
3
3
|
import Base, { BaseProps } from '@digigov/react-core/Base';
|
|
4
4
|
|
|
5
|
-
export interface DetailsContentProps extends BaseProps<'div'> {
|
|
5
|
+
export interface DetailsContentProps extends BaseProps<'div'> {
|
|
6
|
+
/*
|
|
7
|
+
** color is optional. Default value is 'primary'.
|
|
8
|
+
* @value 'primary'
|
|
9
|
+
* @value 'secondary'
|
|
10
|
+
* @default 'primary'
|
|
11
|
+
* */
|
|
12
|
+
color?: 'primary' | 'secondary';
|
|
13
|
+
}
|
|
6
14
|
/**
|
|
7
15
|
*DetailsContent component wraps the content text.
|
|
8
16
|
*It is used inside Details component as children
|
|
@@ -10,13 +18,14 @@ export interface DetailsContentProps extends BaseProps<'div'> {}
|
|
|
10
18
|
export const DetailsContent = React.forwardRef<
|
|
11
19
|
HTMLDivElement,
|
|
12
20
|
DetailsContentProps
|
|
13
|
-
>(function DetailsContent({ className, children, ...props }, ref) {
|
|
21
|
+
>(function DetailsContent({ color, className, children, ...props }, ref) {
|
|
14
22
|
return (
|
|
15
23
|
<Base
|
|
16
24
|
as="div"
|
|
17
25
|
ref={ref}
|
|
18
26
|
className={clsx(className, {
|
|
19
27
|
'ds-details__content': true,
|
|
28
|
+
'ds-details__content--secondary': color === 'secondary',
|
|
20
29
|
})}
|
|
21
30
|
{...props}
|
|
22
31
|
>
|
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/
|
|
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
|
-
'
|
|
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,11 +3,11 @@ 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";
|
|
9
|
-
import * as
|
|
8
|
+
import * as _digigov_react_core_AccordionSectionContent from "@digigov/react-core/AccordionSectionContent";
|
|
10
9
|
import * as _digigov_react_core_AccordionSectionSummaryHeading from "@digigov/react-core/AccordionSectionSummaryHeading";
|
|
10
|
+
import * as _digigov_react_core_AccordionSectionSummary from "@digigov/react-core/AccordionSectionSummary";
|
|
11
11
|
import * as _digigov_react_core_AdminAside from "@digigov/react-core/AdminAside";
|
|
12
12
|
import * as _digigov_react_core_AdminContainer from "@digigov/react-core/AdminContainer";
|
|
13
13
|
import * as _digigov_react_core_AdminHeader from "@digigov/react-core/AdminHeader";
|
|
@@ -17,8 +17,8 @@ import * as _digigov_react_core_AdminMain from "@digigov/react-core/AdminMain";
|
|
|
17
17
|
import * as _digigov_react_core_AdminTopSection from "@digigov/react-core/AdminTopSection";
|
|
18
18
|
import * as _digigov_react_core_Aside from "@digigov/react-core/Aside";
|
|
19
19
|
import * as _digigov_react_core_AutoCompleteAssistiveHint from "@digigov/react-core/AutoCompleteAssistiveHint";
|
|
20
|
-
import * as _digigov_react_core_AutoCompleteContainer from "@digigov/react-core/AutoCompleteContainer";
|
|
21
20
|
import * as _digigov_react_core_AutoCompleteInputBase from "@digigov/react-core/AutoCompleteInputBase";
|
|
21
|
+
import * as _digigov_react_core_AutoCompleteContainer from "@digigov/react-core/AutoCompleteContainer";
|
|
22
22
|
import * as _digigov_react_core_AutoCompleteMultipleInput from "@digigov/react-core/AutoCompleteMultipleInput";
|
|
23
23
|
import * as _digigov_react_core_AutoCompleteMultipleInputContainer from "@digigov/react-core/AutoCompleteMultipleInputContainer";
|
|
24
24
|
import * as _digigov_react_core_AutoCompleteResultList from "@digigov/react-core/AutoCompleteResultList";
|
|
@@ -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
|
|
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,11 +286,11 @@ 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),
|
|
292
|
-
'@digigov/react-core/
|
|
291
|
+
'@digigov/react-core/AccordionSectionContent': lazyImport(_digigov_react_core_AccordionSectionContent),
|
|
293
292
|
'@digigov/react-core/AccordionSectionSummaryHeading': lazyImport(_digigov_react_core_AccordionSectionSummaryHeading),
|
|
293
|
+
'@digigov/react-core/AccordionSectionSummary': lazyImport(_digigov_react_core_AccordionSectionSummary),
|
|
294
294
|
'@digigov/react-core/AdminAside': lazyImport(_digigov_react_core_AdminAside),
|
|
295
295
|
'@digigov/react-core/AdminContainer': lazyImport(_digigov_react_core_AdminContainer),
|
|
296
296
|
'@digigov/react-core/AdminHeader': lazyImport(_digigov_react_core_AdminHeader),
|
|
@@ -300,8 +300,8 @@ export default {
|
|
|
300
300
|
'@digigov/react-core/AdminTopSection': lazyImport(_digigov_react_core_AdminTopSection),
|
|
301
301
|
'@digigov/react-core/Aside': lazyImport(_digigov_react_core_Aside),
|
|
302
302
|
'@digigov/react-core/AutoCompleteAssistiveHint': lazyImport(_digigov_react_core_AutoCompleteAssistiveHint),
|
|
303
|
-
'@digigov/react-core/AutoCompleteContainer': lazyImport(_digigov_react_core_AutoCompleteContainer),
|
|
304
303
|
'@digigov/react-core/AutoCompleteInputBase': lazyImport(_digigov_react_core_AutoCompleteInputBase),
|
|
304
|
+
'@digigov/react-core/AutoCompleteContainer': lazyImport(_digigov_react_core_AutoCompleteContainer),
|
|
305
305
|
'@digigov/react-core/AutoCompleteMultipleInput': lazyImport(_digigov_react_core_AutoCompleteMultipleInput),
|
|
306
306
|
'@digigov/react-core/AutoCompleteMultipleInputContainer': lazyImport(_digigov_react_core_AutoCompleteMultipleInputContainer),
|
|
307
307
|
'@digigov/react-core/AutoCompleteResultList': lazyImport(_digigov_react_core_AutoCompleteResultList),
|
|
@@ -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/
|
|
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),
|
|
@@ -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
|
-
}
|
|
@@ -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
|
-
}
|
|
@@ -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
|
-
});
|
|
File without changes
|