@semcore/skeleton 4.1.0 → 4.1.1
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/CHANGELOG.md +6 -0
- package/lib/cjs/Skeleton.js +8 -8
- package/lib/cjs/index.d.js +2 -0
- package/lib/cjs/index.d.js.map +1 -0
- package/lib/es6/Skeleton.js +8 -8
- package/lib/es6/index.d.js +2 -0
- package/lib/es6/index.d.js.map +1 -0
- package/package.json +3 -2
- package/lib/cjs/index.d.ts +0 -72
- package/lib/es6/index.d.ts +0 -72
package/CHANGELOG.md
CHANGED
|
@@ -2,6 +2,12 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [4.1.1] - 2022-10-04
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version patch update due to children dependencies update (`@semcore/utils` [3.37.1 ~> 3.37.2], `@semcore/flex-box` [4.5.11 ~> 4.5.12]).
|
|
10
|
+
|
|
5
11
|
## [4.1.0] - 2022-09-22
|
|
6
12
|
|
|
7
13
|
### Changed
|
package/lib/cjs/Skeleton.js
CHANGED
|
@@ -52,17 +52,17 @@ var style = (
|
|
|
52
52
|
/*__reshadow_css_start__*/
|
|
53
53
|
_core.sstyled.insert(
|
|
54
54
|
/*__inner_css_start__*/
|
|
55
|
-
".
|
|
55
|
+
".___SSkeleton_1ybn6_gg_{animation-name:pulse_1ybn6;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:var(--durationAnim_1ybn6);will-change:opacity}@keyframes pulse_1ybn6{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.___SSkeleton_1ybn6_gg_._theme_invert_1ybn6_gg_{fill:rgba(224,225,233,.8)}.___SSkeleton_1ybn6_gg_._theme_dark_1ybn6_gg_{fill:hsla(0,0%,100%,.3)}.___SText_1ybn6_gg_{box-sizing:border-box}@media (prefers-reduced-motion){.___SSkeleton_1ybn6_gg_{animation-name:none}}"
|
|
56
56
|
/*__inner_css_end__*/
|
|
57
|
-
, "
|
|
57
|
+
, "1ybn6_gg_")
|
|
58
58
|
/*__reshadow_css_end__*/
|
|
59
59
|
, {
|
|
60
|
-
"__SSkeleton": "
|
|
61
|
-
"--durationAnim": "--
|
|
62
|
-
"@pulse": "
|
|
63
|
-
"_theme_invert": "
|
|
64
|
-
"_theme_dark": "
|
|
65
|
-
"__SText": "
|
|
60
|
+
"__SSkeleton": "___SSkeleton_1ybn6_gg_",
|
|
61
|
+
"--durationAnim": "--durationAnim_1ybn6",
|
|
62
|
+
"@pulse": "pulse_1ybn6",
|
|
63
|
+
"_theme_invert": "_theme_invert_1ybn6_gg_",
|
|
64
|
+
"_theme_dark": "_theme_dark_1ybn6_gg_",
|
|
65
|
+
"__SText": "___SText_1ybn6_gg_"
|
|
66
66
|
});
|
|
67
67
|
var MAP_COLOR_THEME = {
|
|
68
68
|
dark: 'rgba(255, 255, 255, 0.3)',
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { IBoxProps } from '@semcore/flex-box';\nimport { IUniqueIDProps } from '@semcore/utils/lib/uniqueID';\nimport { CProps, ReturnEl } from '@semcore/core';\n\nexport interface ISkeletonProps extends IBoxProps, IUniqueIDProps {\n /**\n * Skeleton visibility control property\n */\n hidden?: boolean;\n /**\n * Animation speed in ms\n * @default 2000\n */\n duration?: string | number;\n /**\n * Skeleton theme\n * @default invert\n */\n theme?: 'dark' | 'invert';\n}\n\nexport interface ISkeletonCtx {\n gradientUrl: 'string';\n}\n\nexport interface ISkeletonTextProps extends IBoxProps {\n /**\n * Number of items to be returned\n * @default 1\n */\n amount?: string | number;\n}\n\nexport interface AreaChartSkeletonProps extends ISkeletonProps {\n type?: 'linear' | 'monotone';\n}\n\nexport interface BarChartSkeletonProps extends ISkeletonProps {\n layout?: 'horizontal' | 'vertical';\n}\n\nexport interface HistogramChartSkeletonProps extends ISkeletonProps {\n layout?: 'horizontal' | 'vertical';\n}\n\nexport interface LineChartSkeletonProps extends ISkeletonProps {\n type?: 'linear' | 'monotone';\n}\n\ndeclare const Skeleton: (<T>(props: CProps<ISkeletonProps & T, ISkeletonCtx>) => ReturnEl) & {\n Text: <T>(props: ISkeletonTextProps & T) => ReturnEl;\n};\ndeclare const AreaChartSkeleton: <T>(props: AreaChartSkeletonProps & T) => ReturnEl;\ndeclare const BarChartSkeleton: <T>(props: BarChartSkeletonProps & T) => ReturnEl;\ndeclare const HistogramChartSkeleton: <T>(props: HistogramChartSkeletonProps & T) => ReturnEl;\ndeclare const LineChartSkeleton: <T>(props: LineChartSkeletonProps & T) => ReturnEl;\ndeclare const PieChartSkeleton: typeof Skeleton;\ndeclare const VennChartSkeleton: typeof Skeleton;\ndeclare const BubbleChartSkeleton: typeof Skeleton;\ndeclare const ScatterPlotChartSkeleton: typeof Skeleton;\n\nexport default Skeleton;\nexport {\n AreaChartSkeleton,\n BarChartSkeleton,\n HistogramChartSkeleton,\n LineChartSkeleton,\n PieChartSkeleton,\n VennChartSkeleton,\n BubbleChartSkeleton,\n ScatterPlotChartSkeleton,\n};\n"],"mappings":""}
|
package/lib/es6/Skeleton.js
CHANGED
|
@@ -28,17 +28,17 @@ var style = (
|
|
|
28
28
|
/*__reshadow_css_start__*/
|
|
29
29
|
_sstyled.insert(
|
|
30
30
|
/*__inner_css_start__*/
|
|
31
|
-
".
|
|
31
|
+
".___SSkeleton_1ybn6_gg_{animation-name:pulse_1ybn6;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:var(--durationAnim_1ybn6);will-change:opacity}@keyframes pulse_1ybn6{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.___SSkeleton_1ybn6_gg_._theme_invert_1ybn6_gg_{fill:rgba(224,225,233,.8)}.___SSkeleton_1ybn6_gg_._theme_dark_1ybn6_gg_{fill:hsla(0,0%,100%,.3)}.___SText_1ybn6_gg_{box-sizing:border-box}@media (prefers-reduced-motion){.___SSkeleton_1ybn6_gg_{animation-name:none}}"
|
|
32
32
|
/*__inner_css_end__*/
|
|
33
|
-
, "
|
|
33
|
+
, "1ybn6_gg_")
|
|
34
34
|
/*__reshadow_css_end__*/
|
|
35
35
|
, {
|
|
36
|
-
"__SSkeleton": "
|
|
37
|
-
"--durationAnim": "--
|
|
38
|
-
"@pulse": "
|
|
39
|
-
"_theme_invert": "
|
|
40
|
-
"_theme_dark": "
|
|
41
|
-
"__SText": "
|
|
36
|
+
"__SSkeleton": "___SSkeleton_1ybn6_gg_",
|
|
37
|
+
"--durationAnim": "--durationAnim_1ybn6",
|
|
38
|
+
"@pulse": "pulse_1ybn6",
|
|
39
|
+
"_theme_invert": "_theme_invert_1ybn6_gg_",
|
|
40
|
+
"_theme_dark": "_theme_dark_1ybn6_gg_",
|
|
41
|
+
"__SText": "___SText_1ybn6_gg_"
|
|
42
42
|
});
|
|
43
43
|
var MAP_COLOR_THEME = {
|
|
44
44
|
dark: 'rgba(255, 255, 255, 0.3)',
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { IBoxProps } from '@semcore/flex-box';\nimport { IUniqueIDProps } from '@semcore/utils/lib/uniqueID';\nimport { CProps, ReturnEl } from '@semcore/core';\n\nexport interface ISkeletonProps extends IBoxProps, IUniqueIDProps {\n /**\n * Skeleton visibility control property\n */\n hidden?: boolean;\n /**\n * Animation speed in ms\n * @default 2000\n */\n duration?: string | number;\n /**\n * Skeleton theme\n * @default invert\n */\n theme?: 'dark' | 'invert';\n}\n\nexport interface ISkeletonCtx {\n gradientUrl: 'string';\n}\n\nexport interface ISkeletonTextProps extends IBoxProps {\n /**\n * Number of items to be returned\n * @default 1\n */\n amount?: string | number;\n}\n\nexport interface AreaChartSkeletonProps extends ISkeletonProps {\n type?: 'linear' | 'monotone';\n}\n\nexport interface BarChartSkeletonProps extends ISkeletonProps {\n layout?: 'horizontal' | 'vertical';\n}\n\nexport interface HistogramChartSkeletonProps extends ISkeletonProps {\n layout?: 'horizontal' | 'vertical';\n}\n\nexport interface LineChartSkeletonProps extends ISkeletonProps {\n type?: 'linear' | 'monotone';\n}\n\ndeclare const Skeleton: (<T>(props: CProps<ISkeletonProps & T, ISkeletonCtx>) => ReturnEl) & {\n Text: <T>(props: ISkeletonTextProps & T) => ReturnEl;\n};\ndeclare const AreaChartSkeleton: <T>(props: AreaChartSkeletonProps & T) => ReturnEl;\ndeclare const BarChartSkeleton: <T>(props: BarChartSkeletonProps & T) => ReturnEl;\ndeclare const HistogramChartSkeleton: <T>(props: HistogramChartSkeletonProps & T) => ReturnEl;\ndeclare const LineChartSkeleton: <T>(props: LineChartSkeletonProps & T) => ReturnEl;\ndeclare const PieChartSkeleton: typeof Skeleton;\ndeclare const VennChartSkeleton: typeof Skeleton;\ndeclare const BubbleChartSkeleton: typeof Skeleton;\ndeclare const ScatterPlotChartSkeleton: typeof Skeleton;\n\nexport default Skeleton;\nexport {\n AreaChartSkeleton,\n BarChartSkeleton,\n HistogramChartSkeleton,\n LineChartSkeleton,\n PieChartSkeleton,\n VennChartSkeleton,\n BubbleChartSkeleton,\n ScatterPlotChartSkeleton,\n};\n"],"mappings":""}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/skeleton",
|
|
3
3
|
"description": "Semrush Skeleton Component",
|
|
4
|
-
"version": "4.1.
|
|
4
|
+
"version": "4.1.1",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"types": "lib/types/index.d.ts",
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
"author": "UI-kit team <ui-kit-team@semrush.com>",
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"scripts": {
|
|
12
|
-
"build": "
|
|
12
|
+
"build": "pnpm semcore-builder --source=js",
|
|
13
13
|
"test": "jest"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
@@ -29,6 +29,7 @@
|
|
|
29
29
|
"directory": "semcore/skeleton"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
32
|
+
"@types/react": "16.8 - 17",
|
|
32
33
|
"@semcore/jest-preset-ui": "1.0.0"
|
|
33
34
|
}
|
|
34
35
|
}
|
package/lib/cjs/index.d.ts
DELETED
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { IBoxProps } from '@semcore/flex-box';
|
|
2
|
-
import { IUniqueIDProps } from '@semcore/utils/lib/uniqueID';
|
|
3
|
-
import { CProps, ReturnEl } from '@semcore/core';
|
|
4
|
-
|
|
5
|
-
export interface ISkeletonProps extends IBoxProps, IUniqueIDProps {
|
|
6
|
-
/**
|
|
7
|
-
* Skeleton visibility control property
|
|
8
|
-
*/
|
|
9
|
-
hidden?: boolean;
|
|
10
|
-
/**
|
|
11
|
-
* Animation speed in ms
|
|
12
|
-
* @default 2000
|
|
13
|
-
*/
|
|
14
|
-
duration?: string | number;
|
|
15
|
-
/**
|
|
16
|
-
* Skeleton theme
|
|
17
|
-
* @default invert
|
|
18
|
-
*/
|
|
19
|
-
theme?: 'dark' | 'invert';
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export interface ISkeletonCtx {
|
|
23
|
-
gradientUrl: 'string';
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
export interface ISkeletonTextProps extends IBoxProps {
|
|
27
|
-
/**
|
|
28
|
-
* Number of items to be returned
|
|
29
|
-
* @default 1
|
|
30
|
-
*/
|
|
31
|
-
amount?: string | number;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
export interface AreaChartSkeletonProps extends ISkeletonProps {
|
|
35
|
-
type?: 'linear' | 'monotone';
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
export interface BarChartSkeletonProps extends ISkeletonProps {
|
|
39
|
-
layout?: 'horizontal' | 'vertical';
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
export interface HistogramChartSkeletonProps extends ISkeletonProps {
|
|
43
|
-
layout?: 'horizontal' | 'vertical';
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export interface LineChartSkeletonProps extends ISkeletonProps {
|
|
47
|
-
type?: 'linear' | 'monotone';
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
declare const Skeleton: (<T>(props: CProps<ISkeletonProps & T, ISkeletonCtx>) => ReturnEl) & {
|
|
51
|
-
Text: <T>(props: ISkeletonTextProps & T) => ReturnEl;
|
|
52
|
-
};
|
|
53
|
-
declare const AreaChartSkeleton: <T>(props: AreaChartSkeletonProps & T) => ReturnEl;
|
|
54
|
-
declare const BarChartSkeleton: <T>(props: BarChartSkeletonProps & T) => ReturnEl;
|
|
55
|
-
declare const HistogramChartSkeleton: <T>(props: HistogramChartSkeletonProps & T) => ReturnEl;
|
|
56
|
-
declare const LineChartSkeleton: <T>(props: LineChartSkeletonProps & T) => ReturnEl;
|
|
57
|
-
declare const PieChartSkeleton: typeof Skeleton;
|
|
58
|
-
declare const VennChartSkeleton: typeof Skeleton;
|
|
59
|
-
declare const BubbleChartSkeleton: typeof Skeleton;
|
|
60
|
-
declare const ScatterPlotChartSkeleton: typeof Skeleton;
|
|
61
|
-
|
|
62
|
-
export default Skeleton;
|
|
63
|
-
export {
|
|
64
|
-
AreaChartSkeleton,
|
|
65
|
-
BarChartSkeleton,
|
|
66
|
-
HistogramChartSkeleton,
|
|
67
|
-
LineChartSkeleton,
|
|
68
|
-
PieChartSkeleton,
|
|
69
|
-
VennChartSkeleton,
|
|
70
|
-
BubbleChartSkeleton,
|
|
71
|
-
ScatterPlotChartSkeleton,
|
|
72
|
-
};
|
package/lib/es6/index.d.ts
DELETED
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
import { IBoxProps } from '@semcore/flex-box';
|
|
2
|
-
import { IUniqueIDProps } from '@semcore/utils/lib/uniqueID';
|
|
3
|
-
import { CProps, ReturnEl } from '@semcore/core';
|
|
4
|
-
|
|
5
|
-
export interface ISkeletonProps extends IBoxProps, IUniqueIDProps {
|
|
6
|
-
/**
|
|
7
|
-
* Skeleton visibility control property
|
|
8
|
-
*/
|
|
9
|
-
hidden?: boolean;
|
|
10
|
-
/**
|
|
11
|
-
* Animation speed in ms
|
|
12
|
-
* @default 2000
|
|
13
|
-
*/
|
|
14
|
-
duration?: string | number;
|
|
15
|
-
/**
|
|
16
|
-
* Skeleton theme
|
|
17
|
-
* @default invert
|
|
18
|
-
*/
|
|
19
|
-
theme?: 'dark' | 'invert';
|
|
20
|
-
}
|
|
21
|
-
|
|
22
|
-
export interface ISkeletonCtx {
|
|
23
|
-
gradientUrl: 'string';
|
|
24
|
-
}
|
|
25
|
-
|
|
26
|
-
export interface ISkeletonTextProps extends IBoxProps {
|
|
27
|
-
/**
|
|
28
|
-
* Number of items to be returned
|
|
29
|
-
* @default 1
|
|
30
|
-
*/
|
|
31
|
-
amount?: string | number;
|
|
32
|
-
}
|
|
33
|
-
|
|
34
|
-
export interface AreaChartSkeletonProps extends ISkeletonProps {
|
|
35
|
-
type?: 'linear' | 'monotone';
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
export interface BarChartSkeletonProps extends ISkeletonProps {
|
|
39
|
-
layout?: 'horizontal' | 'vertical';
|
|
40
|
-
}
|
|
41
|
-
|
|
42
|
-
export interface HistogramChartSkeletonProps extends ISkeletonProps {
|
|
43
|
-
layout?: 'horizontal' | 'vertical';
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
export interface LineChartSkeletonProps extends ISkeletonProps {
|
|
47
|
-
type?: 'linear' | 'monotone';
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
declare const Skeleton: (<T>(props: CProps<ISkeletonProps & T, ISkeletonCtx>) => ReturnEl) & {
|
|
51
|
-
Text: <T>(props: ISkeletonTextProps & T) => ReturnEl;
|
|
52
|
-
};
|
|
53
|
-
declare const AreaChartSkeleton: <T>(props: AreaChartSkeletonProps & T) => ReturnEl;
|
|
54
|
-
declare const BarChartSkeleton: <T>(props: BarChartSkeletonProps & T) => ReturnEl;
|
|
55
|
-
declare const HistogramChartSkeleton: <T>(props: HistogramChartSkeletonProps & T) => ReturnEl;
|
|
56
|
-
declare const LineChartSkeleton: <T>(props: LineChartSkeletonProps & T) => ReturnEl;
|
|
57
|
-
declare const PieChartSkeleton: typeof Skeleton;
|
|
58
|
-
declare const VennChartSkeleton: typeof Skeleton;
|
|
59
|
-
declare const BubbleChartSkeleton: typeof Skeleton;
|
|
60
|
-
declare const ScatterPlotChartSkeleton: typeof Skeleton;
|
|
61
|
-
|
|
62
|
-
export default Skeleton;
|
|
63
|
-
export {
|
|
64
|
-
AreaChartSkeleton,
|
|
65
|
-
BarChartSkeleton,
|
|
66
|
-
HistogramChartSkeleton,
|
|
67
|
-
LineChartSkeleton,
|
|
68
|
-
PieChartSkeleton,
|
|
69
|
-
VennChartSkeleton,
|
|
70
|
-
BubbleChartSkeleton,
|
|
71
|
-
ScatterPlotChartSkeleton,
|
|
72
|
-
};
|