@semcore/skeleton 17.2.2 → 18.0.0-prerelease.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.
- package/CHANGELOG.md +6 -0
- package/lib/cjs/Skeleton.js +11 -22
- package/lib/cjs/Skeleton.js.map +1 -1
- package/lib/cjs/Skeleton.type.js.map +1 -1
- package/lib/cjs/charts/Area/Area.js +12 -11
- package/lib/cjs/charts/Area/Area.js.map +1 -1
- package/lib/cjs/charts/Area/Area.type.js.map +1 -1
- package/lib/cjs/charts/Bar/Bar.js +12 -11
- package/lib/cjs/charts/Bar/Bar.js.map +1 -1
- package/lib/cjs/charts/Bar/Bar.type.js.map +1 -1
- package/lib/cjs/charts/Bubble/Bubble.js +11 -10
- package/lib/cjs/charts/Bubble/Bubble.js.map +1 -1
- package/lib/cjs/charts/CompactHorizontalBar/CompactHorizontalBar.js +11 -10
- package/lib/cjs/charts/CompactHorizontalBar/CompactHorizontalBar.js.map +1 -1
- package/lib/cjs/charts/Donut/Donut.js +12 -11
- package/lib/cjs/charts/Donut/Donut.js.map +1 -1
- package/lib/cjs/charts/Donut/Donut.type.js.map +1 -1
- package/lib/cjs/charts/Histogram/Histogram.js +12 -11
- package/lib/cjs/charts/Histogram/Histogram.js.map +1 -1
- package/lib/cjs/charts/Histogram/Histogram.type.js.map +1 -1
- package/lib/cjs/charts/Line/Line.js +12 -11
- package/lib/cjs/charts/Line/Line.js.map +1 -1
- package/lib/cjs/charts/Line/Line.type.js.map +1 -1
- package/lib/cjs/charts/RadialTree/RadialTree.js +11 -10
- package/lib/cjs/charts/RadialTree/RadialTree.js.map +1 -1
- package/lib/cjs/charts/ScatterPlot/ScatterPlot.js +11 -10
- package/lib/cjs/charts/ScatterPlot/ScatterPlot.js.map +1 -1
- package/lib/cjs/charts/Venn/Venn.js +11 -10
- package/lib/cjs/charts/Venn/Venn.js.map +1 -1
- package/lib/cjs/style/chart.shadow.css +10 -5
- package/lib/cjs/style/skeleton.shadow.css +3 -3
- package/lib/cjs/svg/area-chart-linear.svg +2 -2
- package/lib/cjs/svg/area-chart-monotone.svg +2 -2
- package/lib/cjs/svg/bar-chart-horizontal.svg +4 -4
- package/lib/cjs/svg/bar-chart-vertical.svg +5 -5
- package/lib/cjs/svg/bubble-chart.svg +5 -5
- package/lib/cjs/svg/compact-horizontal-bar-chart.svg +5 -6
- package/lib/cjs/svg/donut-chart-halfsize.svg +2 -2
- package/lib/cjs/svg/donut-chart.svg +3 -7
- package/lib/cjs/svg/histogram-chart-horizontal.svg +4 -4
- package/lib/cjs/svg/histogram-chart-vertical.svg +5 -5
- package/lib/cjs/svg/line-chart-linear.svg +1 -8
- package/lib/cjs/svg/line-chart-monotone.svg +2 -2
- package/lib/cjs/svg/radial-chart.svg +17 -17
- package/lib/cjs/svg/scatter-plot-chart.svg +7 -14
- package/lib/cjs/svg/venn-chart.svg +2 -11
- package/lib/es6/Skeleton.js +11 -22
- package/lib/es6/Skeleton.js.map +1 -1
- package/lib/es6/Skeleton.type.js.map +1 -1
- package/lib/es6/charts/Area/Area.js +12 -11
- package/lib/es6/charts/Area/Area.js.map +1 -1
- package/lib/es6/charts/Area/Area.type.js.map +1 -1
- package/lib/es6/charts/Bar/Bar.js +12 -11
- package/lib/es6/charts/Bar/Bar.js.map +1 -1
- package/lib/es6/charts/Bar/Bar.type.js.map +1 -1
- package/lib/es6/charts/Bubble/Bubble.js +11 -10
- package/lib/es6/charts/Bubble/Bubble.js.map +1 -1
- package/lib/es6/charts/CompactHorizontalBar/CompactHorizontalBar.js +11 -10
- package/lib/es6/charts/CompactHorizontalBar/CompactHorizontalBar.js.map +1 -1
- package/lib/es6/charts/Donut/Donut.js +12 -11
- package/lib/es6/charts/Donut/Donut.js.map +1 -1
- package/lib/es6/charts/Donut/Donut.type.js.map +1 -1
- package/lib/es6/charts/Histogram/Histogram.js +12 -11
- package/lib/es6/charts/Histogram/Histogram.js.map +1 -1
- package/lib/es6/charts/Histogram/Histogram.type.js.map +1 -1
- package/lib/es6/charts/Line/Line.js +12 -11
- package/lib/es6/charts/Line/Line.js.map +1 -1
- package/lib/es6/charts/Line/Line.type.js.map +1 -1
- package/lib/es6/charts/RadialTree/RadialTree.js +11 -10
- package/lib/es6/charts/RadialTree/RadialTree.js.map +1 -1
- package/lib/es6/charts/ScatterPlot/ScatterPlot.js +11 -10
- package/lib/es6/charts/ScatterPlot/ScatterPlot.js.map +1 -1
- package/lib/es6/charts/Venn/Venn.js +11 -10
- package/lib/es6/charts/Venn/Venn.js.map +1 -1
- package/lib/es6/style/chart.shadow.css +10 -5
- package/lib/es6/style/skeleton.shadow.css +3 -3
- package/lib/es6/svg/area-chart-linear.svg +2 -2
- package/lib/es6/svg/area-chart-monotone.svg +2 -2
- package/lib/es6/svg/bar-chart-horizontal.svg +4 -4
- package/lib/es6/svg/bar-chart-vertical.svg +5 -5
- package/lib/es6/svg/bubble-chart.svg +5 -5
- package/lib/es6/svg/compact-horizontal-bar-chart.svg +5 -6
- package/lib/es6/svg/donut-chart-halfsize.svg +2 -2
- package/lib/es6/svg/donut-chart.svg +3 -7
- package/lib/es6/svg/histogram-chart-horizontal.svg +4 -4
- package/lib/es6/svg/histogram-chart-vertical.svg +5 -5
- package/lib/es6/svg/line-chart-linear.svg +1 -8
- package/lib/es6/svg/line-chart-monotone.svg +2 -2
- package/lib/es6/svg/radial-chart.svg +17 -17
- package/lib/es6/svg/scatter-plot-chart.svg +7 -14
- package/lib/es6/svg/venn-chart.svg +2 -11
- package/lib/esm/Skeleton.mjs +12 -23
- package/lib/esm/charts/Area/Area.mjs +13 -12
- package/lib/esm/charts/Bar/Bar.mjs +13 -12
- package/lib/esm/charts/Bubble/Bubble.mjs +12 -11
- package/lib/esm/charts/CompactHorizontalBar/CompactHorizontalBar.mjs +12 -11
- package/lib/esm/charts/Donut/Donut.mjs +13 -12
- package/lib/esm/charts/Histogram/Histogram.mjs +13 -12
- package/lib/esm/charts/Line/Line.mjs +13 -12
- package/lib/esm/charts/RadialTree/RadialTree.mjs +12 -11
- package/lib/esm/charts/ScatterPlot/ScatterPlot.mjs +12 -11
- package/lib/esm/charts/Venn/Venn.mjs +12 -11
- package/lib/esm/style/chart.shadow.css +10 -5
- package/lib/esm/style/skeleton.shadow.css +3 -3
- package/lib/types/Skeleton.d.ts +1 -0
- package/lib/types/Skeleton.d.ts.map +1 -0
- package/lib/types/Skeleton.type.d.ts +11 -15
- package/lib/types/Skeleton.type.d.ts.map +1 -0
- package/lib/types/charts/Area/Area.d.ts +1 -0
- package/lib/types/charts/Area/Area.d.ts.map +1 -0
- package/lib/types/charts/Area/Area.type.d.ts +2 -1
- package/lib/types/charts/Area/Area.type.d.ts.map +1 -0
- package/lib/types/charts/Bar/Bar.d.ts +1 -0
- package/lib/types/charts/Bar/Bar.d.ts.map +1 -0
- package/lib/types/charts/Bar/Bar.type.d.ts +2 -1
- package/lib/types/charts/Bar/Bar.type.d.ts.map +1 -0
- package/lib/types/charts/Bubble/Bubble.d.ts +1 -0
- package/lib/types/charts/Bubble/Bubble.d.ts.map +1 -0
- package/lib/types/charts/Bubble/Bubble.type.d.ts +1 -0
- package/lib/types/charts/Bubble/Bubble.type.d.ts.map +1 -0
- package/lib/types/charts/CompactHorizontalBar/CompactHorizontalBar.d.ts +1 -0
- package/lib/types/charts/CompactHorizontalBar/CompactHorizontalBar.d.ts.map +1 -0
- package/lib/types/charts/CompactHorizontalBar/CompactHorizontalBar.type.d.ts +1 -0
- package/lib/types/charts/CompactHorizontalBar/CompactHorizontalBar.type.d.ts.map +1 -0
- package/lib/types/charts/Donut/Donut.d.ts +1 -0
- package/lib/types/charts/Donut/Donut.d.ts.map +1 -0
- package/lib/types/charts/Donut/Donut.type.d.ts +2 -1
- package/lib/types/charts/Donut/Donut.type.d.ts.map +1 -0
- package/lib/types/charts/Histogram/Histogram.d.ts +1 -0
- package/lib/types/charts/Histogram/Histogram.d.ts.map +1 -0
- package/lib/types/charts/Histogram/Histogram.type.d.ts +2 -1
- package/lib/types/charts/Histogram/Histogram.type.d.ts.map +1 -0
- package/lib/types/charts/Line/Line.d.ts +1 -0
- package/lib/types/charts/Line/Line.d.ts.map +1 -0
- package/lib/types/charts/Line/Line.type.d.ts +2 -1
- package/lib/types/charts/Line/Line.type.d.ts.map +1 -0
- package/lib/types/charts/RadialTree/RadialTree.d.ts +1 -0
- package/lib/types/charts/RadialTree/RadialTree.d.ts.map +1 -0
- package/lib/types/charts/RadialTree/RadialTree.type.d.ts +1 -0
- package/lib/types/charts/RadialTree/RadialTree.type.d.ts.map +1 -0
- package/lib/types/charts/ScatterPlot/ScatterPlot.d.ts +1 -0
- package/lib/types/charts/ScatterPlot/ScatterPlot.d.ts.map +1 -0
- package/lib/types/charts/ScatterPlot/ScatterPlot.type.d.ts +1 -0
- package/lib/types/charts/ScatterPlot/ScatterPlot.type.d.ts.map +1 -0
- package/lib/types/charts/Venn/Venn.d.ts +1 -0
- package/lib/types/charts/Venn/Venn.d.ts.map +1 -0
- package/lib/types/charts/Venn/Venn.type.d.ts +1 -0
- package/lib/types/charts/Venn/Venn.type.d.ts.map +1 -0
- package/lib/types/index.d.ts +1 -0
- package/lib/types/index.d.ts.map +1 -0
- package/lib/types/translations/__intergalactic-dynamic-locales.d.ts +1 -0
- package/lib/types/translations/__intergalactic-dynamic-locales.d.ts.map +1 -0
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
package/lib/cjs/Skeleton.js
CHANGED
|
@@ -14,21 +14,17 @@ var _uniqueID = _interopRequireDefault(require("@semcore/core/lib/utils/uniqueID
|
|
|
14
14
|
var _react = _interopRequireDefault(require("react"));
|
|
15
15
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
16
16
|
/*!__reshadow-styles__:"./style/skeleton.shadow.css"*/
|
|
17
|
-
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
17
|
+
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SSkeleton_1me8d_gg_{animation-name:pulse_1me8d;animation-iteration-count:infinite;animation-timing-function:ease-in-out;animation-duration:var(--durationAnim_1me8d);will-change:opacity}@keyframes pulse_1me8d{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.___SSkeletonSVG_1me8d_gg_._theme_default_1me8d_gg_{fill:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SSkeletonSVG_1me8d_gg_._theme_invert_1me8d_gg_{fill:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SText_1me8d_gg_{box-sizing:border-box}@media (prefers-reduced-motion){.___SSkeleton_1me8d_gg_{animation-name:none}}", /*__inner_css_end__*/"1me8d_gg_"),
|
|
18
18
|
/*__reshadow_css_end__*/
|
|
19
19
|
{
|
|
20
|
-
"__SSkeleton": "
|
|
21
|
-
"--durationAnim": "--
|
|
22
|
-
"@pulse": "
|
|
23
|
-
"__SSkeletonSVG": "
|
|
24
|
-
"
|
|
25
|
-
"
|
|
26
|
-
"__SText": "
|
|
20
|
+
"__SSkeleton": "___SSkeleton_1me8d_gg_",
|
|
21
|
+
"--durationAnim": "--durationAnim_1me8d",
|
|
22
|
+
"@pulse": "pulse_1me8d",
|
|
23
|
+
"__SSkeletonSVG": "___SSkeletonSVG_1me8d_gg_",
|
|
24
|
+
"_theme_default": "_theme_default_1me8d_gg_",
|
|
25
|
+
"_theme_invert": "_theme_invert_1me8d_gg_",
|
|
26
|
+
"__SText": "___SText_1me8d_gg_"
|
|
27
27
|
});
|
|
28
|
-
const MAP_COLOR_THEME = {
|
|
29
|
-
dark: 'rgba(255, 255, 255, 0.3)',
|
|
30
|
-
invert: 'rgba(224, 225, 233, 0.8)'
|
|
31
|
-
};
|
|
32
28
|
class SkeletonRoot extends _core.Component {
|
|
33
29
|
render() {
|
|
34
30
|
var _ref = this.asProps,
|
|
@@ -56,6 +52,7 @@ class SkeletonRoot extends _core.Component {
|
|
|
56
52
|
(0, _defineProperty2.default)(SkeletonRoot, "style", style);
|
|
57
53
|
(0, _defineProperty2.default)(SkeletonRoot, "enhance", [(0, _i18nEnhance.default)(_intergalacticDynamicLocales.localizedMessages)]);
|
|
58
54
|
(0, _defineProperty2.default)(SkeletonRoot, "defaultProps", {
|
|
55
|
+
theme: 'default',
|
|
59
56
|
duration: 2000
|
|
60
57
|
});
|
|
61
58
|
class SkeletonSVG extends _core.Component {
|
|
@@ -85,15 +82,6 @@ class SkeletonSVG extends _core.Component {
|
|
|
85
82
|
svg.setAttribute('width', '100%');
|
|
86
83
|
}
|
|
87
84
|
}
|
|
88
|
-
setContext() {
|
|
89
|
-
const {
|
|
90
|
-
theme
|
|
91
|
-
} = this.asProps;
|
|
92
|
-
if (!theme) return {};
|
|
93
|
-
return {
|
|
94
|
-
gradientUrl: MAP_COLOR_THEME[theme]
|
|
95
|
-
};
|
|
96
|
-
}
|
|
97
85
|
render() {
|
|
98
86
|
var _ref2 = this.asProps,
|
|
99
87
|
_ref4;
|
|
@@ -128,7 +116,7 @@ class SkeletonSVG extends _core.Component {
|
|
|
128
116
|
(0, _defineProperty2.default)(SkeletonSVG, "enhance", [(0, _uniqueID.default)()]);
|
|
129
117
|
(0, _defineProperty2.default)(SkeletonSVG, "style", style);
|
|
130
118
|
(0, _defineProperty2.default)(SkeletonSVG, "defaultProps", {
|
|
131
|
-
theme: '
|
|
119
|
+
theme: 'default',
|
|
132
120
|
duration: 2000
|
|
133
121
|
});
|
|
134
122
|
function Text(props) {
|
|
@@ -146,6 +134,7 @@ function Text(props) {
|
|
|
146
134
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, [...Array(amountLine)].map((_el, index) => {
|
|
147
135
|
var _ref5;
|
|
148
136
|
return _ref5 = (0, _core.sstyled)(styles), /*#__PURE__*/_react.default.createElement(SText, _ref5.cn("SText", {
|
|
137
|
+
"fill": '#fff',
|
|
149
138
|
"tag": 'rect',
|
|
150
139
|
"rx": '4',
|
|
151
140
|
"ry": '4',
|
package/lib/cjs/Skeleton.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.js","names":["_core","require","_baseComponents","_canUseDOM","_interopRequireDefault","_i18nEnhance","_uniqueID","_react","_intergalacticDynamicLocales","style","sstyled","insert","MAP_COLOR_THEME","dark","invert","SkeletonRoot","Component","render","_ref","asProps","_ref3","SSkeleton","Box","styles","duration","hidden","getI18nText","default","createElement","cn","assignProps","_defineProperty2","i18nEnhance","localizedMessages","SkeletonSVG","constructor","props","React","createRef","canUseDOM","observeParentSize","observer","ResizeObserver","handleResize","bind","componentDidMount","current","svgRef","parentElement","observe","componentWillUnmount","disconnect","entries","target","svg","setAttribute","setContext","theme","gradientUrl","_ref2","_ref4","Children","uid","SSkeletonSVG","Skeleton","uniqueIDEnhancement","Text","SText","y","x","amount","width","forwardRef","other","amountLine","Number","Fragment","Array","map","_el","index","_ref5","exports","createComponent","_default"],"sources":["../../src/Skeleton.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport React from 'react';\n\nimport type { NSSkeleton } from './Skeleton.type';\nimport style from './style/skeleton.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nconst MAP_COLOR_THEME = {\n dark: 'rgba(255, 255, 255, 0.3)',\n invert: 'rgba(224, 225, 233, 0.8)',\n};\n\nclass SkeletonRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.RenderComponent>,\n typeof SkeletonRoot.enhance,\n {},\n {},\n {},\n NSSkeleton.DefaultProps\n> {\n static displayName = 'Skeleton';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages)] as const;\n static defaultProps = {\n duration: 2000,\n } as const;\n\n render() {\n const SSkeleton = Root;\n const { styles, duration, hidden, getI18nText } = this.asProps;\n\n if (hidden) return null;\n\n return sstyled(styles)(\n <SSkeleton\n render={Box}\n width='100%'\n height='100%'\n durationAnim={`${duration}ms`}\n role='img'\n aria-label={getI18nText('loading')}\n />,\n );\n }\n}\n\nclass SkeletonSVG extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.Component>,\n typeof SkeletonRoot.enhance,\n never,\n {},\n {},\n NSSkeleton.DefaultProps\n> {\n static displayName = 'SkeletonSVG';\n static enhance = [uniqueIDEnhancement()];\n static style = style;\n\n static defaultProps = {\n theme: 'invert',\n duration: 2000,\n } as const;\n\n svgRef = React.createRef<SVGElement>();\n private observer: ResizeObserver | null = null;\n\n constructor(props: NSSkeleton.Props) {\n super(props);\n\n if (canUseDOM() && props.observeParentSize) {\n this.observer = new ResizeObserver(this.handleResize.bind(this));\n }\n }\n\n componentDidMount() {\n const { current } = this.svgRef;\n\n if (current && current.parentElement) {\n this.observer?.observe(current.parentElement);\n }\n }\n\n componentWillUnmount() {\n this.observer?.disconnect();\n }\n\n handleResize(entries: ResizeObserverEntry[]) {\n const target = entries[0].target;\n const svg = this.svgRef.current;\n\n if (target && svg) {\n svg.setAttribute('width', '100%');\n }\n }\n\n setContext() {\n const { theme } = this.asProps;\n\n if (!theme) return {};\n\n return {\n gradientUrl: MAP_COLOR_THEME[theme],\n };\n }\n\n render() {\n const { Children, styles, uid, theme, duration } = this.asProps;\n const SSkeletonSVG = Root;\n\n return sstyled(styles)(\n <SSkeletonSVG\n render={Skeleton}\n tag='svg'\n ref={this.svgRef}\n preserveAspectRatio='none'\n theme={theme}\n durationAnim={`${duration}ms`}\n >\n <defs>\n <mask id={uid}>\n <Children />\n </mask>\n </defs>\n <rect x='0' y='0' width='100%' height='100%' mask={`url(#${uid})`} />\n </SSkeletonSVG>,\n );\n }\n}\n\nfunction Text(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.Text.Component>,\n) {\n const SText = Box;\n const { y = 0, x = 0, amount = 1, width = '100%', styles, forwardRef, ...other } = props;\n const amountLine = Number(amount);\n\n return (\n <React.Fragment>\n {[...Array(amountLine)].map((_el, index) =>\n sstyled(styles)(\n <SText\n tag='rect'\n rx='4'\n ry='4'\n height='8'\n key={index}\n y={y || 20 * index}\n x={x}\n ref={forwardRef}\n width={width}\n {...other}\n />,\n ),\n )}\n </React.Fragment>\n );\n}\n\n/**\n * Skeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nconst Skeleton = createComponent<\n NSSkeleton.RenderComponent,\n typeof SkeletonRoot\n>(SkeletonRoot);\n\nexport { Skeleton };\n\n/**\n * Skeleton SVG\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeleton.Component,\n typeof SkeletonSVG\n>(SkeletonSVG, {\n Text,\n});\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Skeleton.js","names":["_core","require","_baseComponents","_canUseDOM","_interopRequireDefault","_i18nEnhance","_uniqueID","_react","_intergalacticDynamicLocales","style","sstyled","insert","SkeletonRoot","Component","render","_ref","asProps","_ref3","SSkeleton","Box","styles","duration","hidden","getI18nText","default","createElement","cn","assignProps","_defineProperty2","i18nEnhance","localizedMessages","theme","SkeletonSVG","constructor","props","React","createRef","canUseDOM","observeParentSize","observer","ResizeObserver","handleResize","bind","componentDidMount","current","svgRef","parentElement","observe","componentWillUnmount","disconnect","entries","target","svg","setAttribute","_ref2","_ref4","Children","uid","SSkeletonSVG","Skeleton","uniqueIDEnhancement","Text","SText","y","x","amount","width","forwardRef","other","amountLine","Number","Fragment","Array","map","_el","index","_ref5","exports","createComponent","_default"],"sources":["../../src/Skeleton.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport i18nEnhance from '@semcore/core/lib/utils/enhances/i18nEnhance';\nimport uniqueIDEnhancement from '@semcore/core/lib/utils/uniqueID';\nimport React from 'react';\n\nimport type { NSSkeleton } from './Skeleton.type';\nimport style from './style/skeleton.shadow.css';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\n\nclass SkeletonRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.RenderComponent>,\n typeof SkeletonRoot.enhance,\n {},\n {},\n {},\n NSSkeleton.DefaultProps\n> {\n static displayName = 'Skeleton';\n static style = style;\n static enhance = [i18nEnhance(localizedMessages)] as const;\n static defaultProps = {\n theme: 'default',\n duration: 2000,\n } as const;\n\n render() {\n const SSkeleton = Root;\n const { styles, duration, hidden, getI18nText } = this.asProps;\n\n if (hidden) return null;\n\n return sstyled(styles)(\n <SSkeleton\n render={Box}\n width='100%'\n height='100%'\n durationAnim={`${duration}ms`}\n role='img'\n aria-label={getI18nText('loading')}\n />,\n );\n }\n}\n\nclass SkeletonSVG extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.Component>,\n typeof SkeletonRoot.enhance,\n never,\n {},\n {},\n NSSkeleton.DefaultProps\n> {\n static displayName = 'SkeletonSVG';\n static enhance = [uniqueIDEnhancement()];\n static style = style;\n\n static defaultProps = {\n theme: 'default',\n duration: 2000,\n } as const;\n\n svgRef = React.createRef<SVGElement>();\n private observer: ResizeObserver | null = null;\n\n constructor(props: NSSkeleton.Props) {\n super(props);\n\n if (canUseDOM() && props.observeParentSize) {\n this.observer = new ResizeObserver(this.handleResize.bind(this));\n }\n }\n\n componentDidMount() {\n const { current } = this.svgRef;\n\n if (current && current.parentElement) {\n this.observer?.observe(current.parentElement);\n }\n }\n\n componentWillUnmount() {\n this.observer?.disconnect();\n }\n\n handleResize(entries: ResizeObserverEntry[]) {\n const target = entries[0].target;\n const svg = this.svgRef.current;\n\n if (target && svg) {\n svg.setAttribute('width', '100%');\n }\n }\n\n render() {\n const { Children, styles, uid, theme, duration } = this.asProps;\n const SSkeletonSVG = Root;\n\n return sstyled(styles)(\n <SSkeletonSVG\n render={Skeleton}\n tag='svg'\n ref={this.svgRef}\n preserveAspectRatio='none'\n theme={theme}\n durationAnim={`${duration}ms`}\n >\n <defs>\n <mask id={uid}>\n <Children />\n </mask>\n </defs>\n <rect x='0' y='0' width='100%' height='100%' mask={`url(#${uid})`} />\n </SSkeletonSVG>,\n );\n }\n}\n\nfunction Text(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeleton.Text.Component>,\n) {\n const SText = Box;\n const { y = 0, x = 0, amount = 1, width = '100%', styles, forwardRef, ...other } = props;\n const amountLine = Number(amount);\n\n return (\n <React.Fragment>\n {[...Array(amountLine)].map((_el, index) =>\n sstyled(styles)(\n <SText\n fill='#fff'\n tag='rect'\n rx='4'\n ry='4'\n height='8'\n key={index}\n y={y || 20 * index}\n x={x}\n ref={forwardRef}\n width={width}\n {...other}\n />,\n ),\n )}\n </React.Fragment>\n );\n}\n\n/**\n * Skeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nconst Skeleton = createComponent<\n NSSkeleton.RenderComponent,\n typeof SkeletonRoot\n>(SkeletonRoot);\n\nexport { Skeleton };\n\n/**\n * Skeleton SVG\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeleton.Component,\n typeof SkeletonSVG\n>(SkeletonSVG, {\n Text,\n});\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Skeleton.type.js","names":[],"sources":["../../src/Skeleton.type.ts"],"sourcesContent":["import type {
|
|
1
|
+
{"version":3,"file":"Skeleton.type.js","names":[],"sources":["../../src/Skeleton.type.ts"],"sourcesContent":["import type { NSBox } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport type { UniqueIDProps } from '@semcore/core/lib/utils/uniqueID';\n\ndeclare namespace NSSkeleton {\n type Props = NSBox.Props & UniqueIDProps & {\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 default\n */\n theme?: 'default' | 'invert';\n /** Specifies the locale for i18n support */\n locale?: string;\n /**\n * Enable ResizeObserver for parent Element to recalculate skeleton size.\n * @default false\n */\n observeParentSize?: boolean;\n };\n\n type DefaultProps = {\n theme: 'default';\n duration: 2000;\n };\n\n namespace Text {\n type Props = NSBox.Props & {\n // TODO: It looks like it should be number (def. not a string...)\n /**\n * Number of items to be returned\n * @default 1\n */\n amount?: string | number;\n };\n\n type Component = Intergalactic.Component<'rect', Props>;\n }\n\n type RenderComponent = Intergalactic.Component<'div', Props>;\n\n type Component = Intergalactic.Component<'svg', Props> & {\n Text: Text.Component;\n };\n}\n\n/** @deprecated It will be removed in v19. */\nexport type SkeletonProps = NSSkeleton.Props;\n/** @deprecated It will be removed in v19. */\nexport type SkeletonTextProps = NSSkeleton.Text.Props;\n\nexport type { NSSkeleton };\n"],"mappings":"","ignoreList":[]}
|
|
@@ -9,23 +9,24 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const areaLinearSvg = "
|
|
26
|
+
const areaLinearSvg = "PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjY0IiB2aWV3Qm94PSIwIDAgMTI4IDY0IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNjMuOTk5OCAzMy45Mzk0TDAgMFY2NEgxMjhWMEw2My45OTk4IDMzLjkzOTRaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiLz4KPC9zdmc+Cg==";
|
|
26
27
|
// TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
27
28
|
// @ts-ignore
|
|
28
|
-
const areaMonotoneSvg = "
|
|
29
|
+
const areaMonotoneSvg = "PHN2ZyB3aWR0aD0iMTI4IiBoZWlnaHQ9IjY0IiB2aWV3Qm94PSIwIDAgMTI4IDY0IiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNNjMuOTk5OCAzMy45Mzk0QzMyLjAwMDEgMzMuOTM5NCAzMi4wMDAxIDAgMCAwVjY0SDEyOFYwQzk1Ljk5OTkgMCA5NS45OTk5IDMzLjkzOTQgNjMuOTk5OCAzMy45Mzk0WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIi8+Cjwvc3ZnPgo=";
|
|
29
30
|
const pattern = {
|
|
30
31
|
linear: areaLinearSvg,
|
|
31
32
|
monotone: areaMonotoneSvg
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Area.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","areaLinearSvg","areaMonotoneSvg","pattern","linear","monotone","AreaChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","type","_default","exports","createComponent"],"sources":["../../../../src/charts/Area/Area.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonAreaChart } from './Area.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst areaLinearSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/area-chart-linear.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst areaMonotoneSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/area-chart-monotone.svg'))\n`;\n\nconst pattern = {\n linear: areaLinearSvg,\n monotone: areaMonotoneSvg,\n};\n\nfunction AreaChartSkeleton(props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonAreaChart.Component>) {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-x'\n bgPosition='left bottom'\n bgSize='auto 50%'\n bgPattern={`url(data:image/svg+xml;base64,${pattern[props.type ?? 'linear']})`}\n />,\n );\n}\n\n/**\n * AreaChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#areachartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonAreaChart.Component,\n typeof AreaChartSkeleton\n>(AreaChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,aAAa,
|
|
1
|
+
{"version":3,"file":"Area.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","areaLinearSvg","areaMonotoneSvg","pattern","linear","monotone","AreaChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","type","_default","exports","createComponent"],"sources":["../../../../src/charts/Area/Area.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonAreaChart } from './Area.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst areaLinearSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/area-chart-linear.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst areaMonotoneSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/area-chart-monotone.svg'))\n`;\n\nconst pattern = {\n linear: areaLinearSvg,\n monotone: areaMonotoneSvg,\n};\n\nfunction AreaChartSkeleton(props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonAreaChart.Component>) {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-x'\n bgPosition='left bottom'\n bgSize='auto 50%'\n bgPattern={`url(data:image/svg+xml;base64,${pattern[props.type ?? 'linear']})`}\n />,\n );\n}\n\n/**\n * AreaChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#areachartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonAreaChart.Component,\n typeof AreaChartSkeleton\n>(AreaChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,aAAa,yQAElB;AACD;AACA;AACA,MAAMC,eAAe,6UAEpB;AAED,MAAMC,OAAO,GAAG;EACdC,MAAM,EAAEH,aAAa;EACrBI,QAAQ,EAAEH;AACZ,CAAC;AAED,SAASI,iBAAiBA,CAACC,KAAuF,EAAE;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAClH,MAAMC,cAAc,GAGRC,kBAAQ;EAFpB,OAAAF,KAAA,GAAO,IAAAX,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAkB,OAAA,CAAAC,aAAA,CAACH,cAAc,EAAAD,KAAA,CAAAK,EAAA;IAAA,OAAAtB,KAAA,CAAAuB,WAAA;MAAA,YAEJ,UAAU;MAAA,cACR,aAAa;MAAA,UACjB,UAAU;MAAA,aACN,iCAAiCb,OAAO,CAACI,KAAK,CAACU,IAAI,IAAI,QAAQ,CAAC;IAAG,GAAAT,IAAA;EAAA,EAC/E,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAU,QAAA,GAAAC,OAAA,CAAAN,OAAA,GAKe,IAAAO,qBAAe,EAG5Bd,iBAAiB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Area.type.js","names":[],"sources":["../../../../src/charts/Area/Area.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonAreaChart {\n type Props = NSSkeleton.Props & {\n /** Controls the area curve interpolation style for the skeleton pattern */\n type?: 'linear' | 'monotone';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in
|
|
1
|
+
{"version":3,"file":"Area.type.js","names":[],"sources":["../../../../src/charts/Area/Area.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonAreaChart {\n type Props = NSSkeleton.Props & {\n /** Controls the area curve interpolation style for the skeleton pattern */\n type?: 'linear' | 'monotone';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in v19. */\nexport type AreaChartSkeletonProps = NSSkeletonAreaChart.Props;\n\nexport type { NSSkeletonAreaChart };\n"],"mappings":"","ignoreList":[]}
|
|
@@ -9,23 +9,24 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const barVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
26
|
+
const barVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0wIDBIMTIwQzEyMi4yMDkgMCAxMjQgMS43OTA4NiAxMjQgNFYxMkMxMjQgMTQuMjA5MSAxMjIuMjA5IDE2IDEyMCAxNkgwVjBaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiLz4KPHBhdGggZD0iTTAgMjhIMTU2QzE1OC4yMDkgMjggMTYwIDI5Ljc5MDkgMTYwIDMyVjQwQzE2MCA0Mi4yMDkxIDE1OC4yMDkgNDQgMTU2IDQ0SDBWMjhaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0wIDU2SDEzOEMxNDAuMjA5IDU2IDE0MiA1Ny43OTA5IDE0MiA2MFY2OEMxNDIgNzAuMjA5MSAxNDAuMjA5IDcyIDEzOCA3MkgwVjU2WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgo8cGF0aCBkPSJNMCA4NEgxNTZDMTU4LjIwOSA4NCAxNjAgODUuNzkwOSAxNjAgODhWOTZDMTYwIDk4LjIwOTEgMTU4LjIwOSAxMDAgMTU2IDEwMEgwVjg0WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgo8cGF0aCBkPSJNMCAxMTJIMTE2QzExOC4yMDkgMTEyIDEyMCAxMTMuNzkxIDEyMCAxMTZWMTI0QzEyMCAxMjYuMjA5IDExOC4yMDkgMTI4IDExNiAxMjhIMFYxMTJaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+Cjwvc3ZnPgo=";
|
|
26
27
|
// TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
27
28
|
// @ts-ignore
|
|
28
|
-
const barHorizontalSvg = "PHN2ZyB3aWR0aD0iMTU2IiBoZWlnaHQ9IjE2MCIgdmlld0JveD0iMCAwIDE1NiAxNjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
29
|
+
const barHorizontalSvg = "PHN2ZyB3aWR0aD0iMTU2IiBoZWlnaHQ9IjE2MCIgdmlld0JveD0iMCAwIDE1NiAxNjAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xMiAxNkMxMiAxMy43OTA5IDEzLjc5MDkgMTIgMTYgMTJIMjNDMjUuMjA5MSAxMiAyNyAxMy43OTA5IDI3IDE2VjE0OEgxMlYxNloiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIvPgo8cGF0aCBkPSJNNTEgNDJDNTEgMzkuNzkwOSA1Mi43OTA5IDM4IDU1IDM4SDYyQzY0LjIwOTEgMzggNjYgMzkuNzkwOSA2NiA0MlYxNDhINTFWNDJaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiLz4KPHBhdGggZD0iTTkwIDYzQzkwIDYwLjc5MDkgOTEuNzkwOSA1OSA5NCA1OUgxMDFDMTAzLjIwOSA1OSAxMDUgNjAuNzkwOSAxMDUgNjNWMTQ4SDkwVjYzWiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIi8+CjxwYXRoIGQ9Ik0xMjkgMzBDMTI5IDI3Ljc5MDkgMTMwLjc5MSAyNiAxMzMgMjZIMTQwQzE0Mi4yMDkgMjYgMTQ0IDI3Ljc5MDkgMTQ0IDMwVjE0OEgxMjlWMzBaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiLz4KPC9zdmc+Cg==";
|
|
29
30
|
const pattern = {
|
|
30
31
|
vertical: barVerticalSvg,
|
|
31
32
|
horizontal: barHorizontalSvg
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bar.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","barVerticalSvg","barHorizontalSvg","pattern","vertical","horizontal","repeat","position","size","BarChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","layout","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Bar/Bar.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonBarChart } from './Bar.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\n\nconst barVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bar-chart-vertical.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst barHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bar-chart-horizontal.svg'))\n`;\n\nconst pattern = { vertical: barVerticalSvg, horizontal: barHorizontalSvg };\nconst repeat = { vertical: 'repeat-y', horizontal: 'repeat-x' };\nconst position = { vertical: 'left top', horizontal: 'left bottom' };\nconst size = { vertical: 'contain', horizontal: 'auto 50%' };\n\nfunction BarChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonBarChart.Component>,\n) {\n const SChartSkeleton = Root;\n const layout = props.layout ?? 'horizontal';\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat={repeat[layout]}\n bgPosition={position[layout]}\n bgSize={size[layout]}\n bgPattern={`url(data:image/svg+xml;base64,${pattern[layout]})`}\n />,\n );\n}\n\n/**\n * BarChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#barchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonBarChart.Component,\n typeof BarChartSkeleton\n>(BarChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AAEA,MAAMC,cAAc,
|
|
1
|
+
{"version":3,"file":"Bar.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","barVerticalSvg","barHorizontalSvg","pattern","vertical","horizontal","repeat","position","size","BarChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","layout","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Bar/Bar.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonBarChart } from './Bar.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\n\nconst barVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bar-chart-vertical.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst barHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bar-chart-horizontal.svg'))\n`;\n\nconst pattern = { vertical: barVerticalSvg, horizontal: barHorizontalSvg };\nconst repeat = { vertical: 'repeat-y', horizontal: 'repeat-x' };\nconst position = { vertical: 'left top', horizontal: 'left bottom' };\nconst size = { vertical: 'contain', horizontal: 'auto 50%' };\n\nfunction BarChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonBarChart.Component>,\n) {\n const SChartSkeleton = Root;\n const layout = props.layout ?? 'horizontal';\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat={repeat[layout]}\n bgPosition={position[layout]}\n bgSize={size[layout]}\n bgPattern={`url(data:image/svg+xml;base64,${pattern[layout]})`}\n />,\n );\n}\n\n/**\n * BarChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#barchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonBarChart.Component,\n typeof BarChartSkeleton\n>(BarChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AAEA,MAAMC,cAAc,i8BAEnB;AACD;AACA;AACA,MAAMC,gBAAgB,yxBAErB;AAED,MAAMC,OAAO,GAAG;EAAEC,QAAQ,EAAEH,cAAc;EAAEI,UAAU,EAAEH;AAAiB,CAAC;AAC1E,MAAMI,MAAM,GAAG;EAAEF,QAAQ,EAAE,UAAU;EAAEC,UAAU,EAAE;AAAW,CAAC;AAC/D,MAAME,QAAQ,GAAG;EAAEH,QAAQ,EAAE,UAAU;EAAEC,UAAU,EAAE;AAAc,CAAC;AACpE,MAAMG,IAAI,GAAG;EAAEJ,QAAQ,EAAE,SAAS;EAAEC,UAAU,EAAE;AAAW,CAAC;AAE5D,SAASI,gBAAgBA,CACvBC,KAAsF,EACtF;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EACA,MAAMC,cAAc,GAIRC,kBAAQ;EAHpB,MAAMC,MAAM,GAAGN,KAAK,CAACM,MAAM,IAAI,YAAY;EAC3C,OAAAH,KAAA,GAAO,IAAAd,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACJ,cAAc,EAAAD,KAAA,CAAAM,EAAA;IAAA,OAAA1B,KAAA,CAAA2B,WAAA;MAAA,YAEHd,MAAM,CAACU,MAAM,CAAC;MAAA,cACZT,QAAQ,CAACS,MAAM,CAAC;MAAA,UACpBR,IAAI,CAACQ,MAAM,CAAC;MAAA,aACT,iCAAiCb,OAAO,CAACa,MAAM,CAAC;IAAG,GAAAL,IAAA;EAAA,EAC/D,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAU,QAAA,GAAAC,OAAA,CAAAL,OAAA,GAKe,IAAAM,qBAAe,EAG5Bd,gBAAgB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bar.type.js","names":[],"sources":["../../../../src/charts/Bar/Bar.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonBarChart {\n type Props = NSSkeleton.Props & {\n /** Controls the orientation of the bar chart skeleton */\n layout?: 'horizontal' | 'vertical';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in
|
|
1
|
+
{"version":3,"file":"Bar.type.js","names":[],"sources":["../../../../src/charts/Bar/Bar.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonBarChart {\n type Props = NSSkeleton.Props & {\n /** Controls the orientation of the bar chart skeleton */\n layout?: 'horizontal' | 'vertical';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in v19. */\nexport type BarChartSkeletonProps = NSSkeletonBarChart.Props;\n\nexport type { NSSkeletonBarChart };\n"],"mappings":"","ignoreList":[]}
|
|
@@ -9,20 +9,21 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const bubbleSvg = "PHN2ZyB3aWR0aD0iMzc2IiBoZWlnaHQ9IjE2NCIgdmlld0JveD0iMCAwIDM3NiAxNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
26
|
+
const bubbleSvg = "PHN2ZyB3aWR0aD0iMzc2IiBoZWlnaHQ9IjE2NCIgdmlld0JveD0iMCAwIDM3NiAxNjQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik00OCAxNjRDNzAuMDkxNCAxNjQgODggMTQ2LjA5MSA4OCAxMjRDODggMTAxLjkwOSA3MC4wOTE0IDg0IDQ4IDg0QzI1LjkwODYgODQgOCAxMDEuOTA5IDggMTI0QzggMTQ2LjA5MSAyNS45MDg2IDE2NCA0OCAxNjRaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik04OCA0OEMxMDEuMjU1IDQ4IDExMiAzNy4yNTQ4IDExMiAyNEMxMTIgMTAuNzQ1MiAxMDEuMjU1IDAgODggMEM3NC43NDUyIDAgNjQgMTAuNzQ1MiA2NCAyNEM2NCAzNy4yNTQ4IDc0Ljc0NTIgNDggODggNDhaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0yOTIuNSA1NUMzMDUuNDc5IDU1IDMxNiA0NC40Nzg3IDMxNiAzMS41QzMxNiAxOC41MjEzIDMwNS40NzkgOCAyOTIuNSA4QzI3OS41MjEgOCAyNjkgMTguNTIxMyAyNjkgMzEuNUMyNjkgNDQuNDc4NyAyNzkuNTIxIDU1IDI5Mi41IDU1WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgo8cGF0aCBkPSJNMzQ0IDk4QzM1Mi44MzcgOTggMzYwIDkwLjgzNjYgMzYwIDgyQzM2MCA3My4xNjM0IDM1Mi44MzcgNjYgMzQ0IDY2QzMzNS4xNjMgNjYgMzI4IDczLjE2MzQgMzI4IDgyQzMyOCA5MC44MzY2IDMzNS4xNjMgOTggMzQ0IDk4WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgo8cGF0aCBkPSJNMTg4IDEzNEMyMTYuNzE5IDEzNCAyNDAgMTEwLjcxOSAyNDAgODJDMjQwIDUzLjI4MTIgMjE2LjcxOSAzMCAxODggMzBDMTU5LjI4MSAzMCAxMzYgNTMuMjgxMiAxMzYgODJDMTM2IDExMC43MTkgMTU5LjI4MSAxMzQgMTg4IDEzNFoiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPC9zdmc+Cg==";
|
|
26
27
|
function BubbleChartSkeleton() {
|
|
27
28
|
var _ref = arguments[0],
|
|
28
29
|
_ref2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Bubble.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","bubbleSvg","BubbleChartSkeleton","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Bubble/Bubble.tsx"],"sourcesContent":["import { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonBubbleChart } from './Bubble.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst bubbleSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bubble-chart.svg'))\n`;\n\nfunction BubbleChartSkeleton() {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-x'\n bgPosition='left center'\n bgSize='auto 50%'\n bgPattern={`url(data:image/svg+xml;base64,${bubbleSvg})`}\n />,\n );\n}\n\n/**\n * BubbleChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeletonBubbleChart.Component,\n typeof BubbleChartSkeleton\n>(BubbleChartSkeleton);\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,SAAS,
|
|
1
|
+
{"version":3,"file":"Bubble.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","bubbleSvg","BubbleChartSkeleton","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Bubble/Bubble.tsx"],"sourcesContent":["import { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonBubbleChart } from './Bubble.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst bubbleSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/bubble-chart.svg'))\n`;\n\nfunction BubbleChartSkeleton() {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-x'\n bgPosition='left center'\n bgSize='auto 50%'\n bgPattern={`url(data:image/svg+xml;base64,${bubbleSvg})`}\n />,\n );\n}\n\n/**\n * BubbleChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeletonBubbleChart.Component,\n typeof BubbleChartSkeleton\n>(BubbleChartSkeleton);\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,SAAS,qwCAEd;AAED,SAASC,mBAAmBA,CAAA,EAAG;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAC7B,MAAMC,cAAc,GAGRC,kBAAQ;EAFpB,OAAAF,KAAA,GAAO,IAAAN,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAa,OAAA,CAAAC,aAAA,CAACH,cAAc,EAAAD,KAAA,CAAAK,EAAA;IAAA,OAAAjB,KAAA,CAAAkB,WAAA;MAAA,YAEJ,UAAU;MAAA,cACR,aAAa;MAAA,UACjB,UAAU;MAAA,aACN,iCAAiCV,SAAS;IAAG,GAAAE,IAAA;EAAA,EACzD,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAS,QAAA,GAAAC,OAAA,CAAAL,OAAA,GAKe,IAAAM,qBAAe,EAG5BZ,mBAAmB,CAAC","ignoreList":[]}
|
|
@@ -9,20 +9,21 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const patternBase64 = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE1NiIgdmlld0JveD0iMCAwIDE3MiAxNTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
26
|
+
const patternBase64 = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE1NiIgdmlld0JveD0iMCAwIDE3MiAxNTYiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGggZD0iTTAgMEgxMjBDMTIyLjIwOSAwIDEyNCAxLjc5MDg2IDEyNCA0VjEyQzEyNCAxNC4yMDkxIDEyMi4yMDkgMTYgMTIwIDE2SDBWMFoiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KICA8cGF0aCBkPSJNMCAzMkgxNTZDMTU4LjIwOSAzMiAxNjAgMzMuNzkwOSAxNjAgMzZWNDRDMTYwIDQ2LjIwOTEgMTU4LjIwOSA0OCAxNTYgNDhIMFYzMloiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KICA8cGF0aCBkPSJNMCA2NEgxMzhDMTQwLjIwOSA2NCAxNDIgNjUuNzkwOSAxNDIgNjhWNzZDMTQyIDc4LjIwOTEgMTQwLjIwOSA4MCAxMzggODBIMFY2NFoiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KICA8cGF0aCBkPSJNMCA5NkgxNTZDMTU4LjIwOSA5NiAxNjAgOTcuNzkwOSAxNjAgMTAwVjEwOEMxNjAgMTEwLjIwOSAxNTguMjA5IDExMiAxNTYgMTEySDBWOTZaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CiAgPHBhdGggZD0iTTAgMTI4SDExNkMxMTguMjA5IDEyOCAxMjAgMTI5Ljc5MSAxMjAgMTMyVjE0MEMxMjAgMTQyLjIwOSAxMTguMjA5IDE0NCAxMTYgMTQ0SDBWMTI4WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgogIDwvc3ZnPgo=";
|
|
26
27
|
function CompactHorizontalBarChartSkeleton() {
|
|
27
28
|
var _ref = arguments[0],
|
|
28
29
|
_ref2;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CompactHorizontalBar.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","patternBase64","CompactHorizontalBarChartSkeleton","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/CompactHorizontalBar/CompactHorizontalBar.tsx"],"sourcesContent":["import { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonCompactHorizontalBar } from './CompactHorizontalBar.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst patternBase64 = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/compact-horizontal-bar-chart.svg'))\n`;\n\nfunction CompactHorizontalBarChartSkeleton() {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-y'\n bgPosition='left top'\n bgSize='contain'\n bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n />,\n );\n}\n\n/**\n * CompactHorizontalBarChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeletonCompactHorizontalBar.Component,\n typeof CompactHorizontalBarChartSkeleton\n>(CompactHorizontalBarChartSkeleton);\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,aAAa,
|
|
1
|
+
{"version":3,"file":"CompactHorizontalBar.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","patternBase64","CompactHorizontalBarChartSkeleton","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/CompactHorizontalBar/CompactHorizontalBar.tsx"],"sourcesContent":["import { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonCompactHorizontalBar } from './CompactHorizontalBar.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst patternBase64 = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/compact-horizontal-bar-chart.svg'))\n`;\n\nfunction CompactHorizontalBarChartSkeleton() {\n const SChartSkeleton = Root;\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='repeat-y'\n bgPosition='left top'\n bgSize='contain'\n bgPattern={`url(data:image/svg+xml;base64,${patternBase64})`}\n />,\n );\n}\n\n/**\n * CompactHorizontalBarChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api/|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code/|Examples}\n */\nexport default createComponent<\n NSSkeletonCompactHorizontalBar.Component,\n typeof CompactHorizontalBarChartSkeleton\n>(CompactHorizontalBarChartSkeleton);\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,aAAa,q9BAElB;AAED,SAASC,iCAAiCA,CAAA,EAAG;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EAC3C,MAAMC,cAAc,GAGRC,kBAAQ;EAFpB,OAAAF,KAAA,GAAO,IAAAN,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAa,OAAA,CAAAC,aAAA,CAACH,cAAc,EAAAD,KAAA,CAAAK,EAAA;IAAA,OAAAjB,KAAA,CAAAkB,WAAA;MAAA,YAEJ,UAAU;MAAA,cACR,UAAU;MAAA,UACd,SAAS;MAAA,aACL,iCAAiCV,aAAa;IAAG,GAAAE,IAAA;EAAA,EAC7D,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAS,QAAA,GAAAC,OAAA,CAAAL,OAAA,GAKe,IAAAM,qBAAe,EAG5BZ,iCAAiC,CAAC","ignoreList":[]}
|
|
@@ -9,23 +9,24 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const donutFullSvg = "PHN2ZyB3aWR0aD0iMTgwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDE4MCAxODAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
26
|
+
const donutFullSvg = "PHN2ZyB3aWR0aD0iMTgwIiBoZWlnaHQ9IjE4MCIgdmlld0JveD0iMCAwIDE4MCAxODAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0xNTguODYzIDE0NS43NDJDMTcxLjQ1MyAxMzAuMjU5IDE4MCAxMTEuNTExIDE4MCA5MEMxODAgNjguNjE2OCAxNzIuNTQzIDQ4Ljk3NTMgMTYwLjA4NyAzMy41MzQzTDEzNy43MzEgNTUuMTQ1OUMxNTEuNzk5IDgyLjA2NzMgMTUxLjQ3NSA5NS40NDAzIDEzNy43OTMgMTIzLjcyNEwxNTguODYzIDE0NS43NDJaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik05MCAxODBDMTE3LjExMiAxODAgMTQwLjQyNSAxNjcuMDExIDE1Ni45MjUgMTQ4LjA0NkwxMzUuODI3IDEyNkMxMjQuODI3IDEzOS41NyAxMDguMzMgMTQ5IDg5LjUgMTQ5QzU2LjM2MjkgMTQ5IDI5IDEyMy4xMzcgMjkgOTBDMjguNTYzMSA1Ny44NTc2IDU0Ljg3NjIgMzEuNTc5OSA4NyAzMFYwLjA0OTA1OEMzOC42ODMxIDEuNjMxNTIgMCA0MS4yOTgzIDAgOTBDMCAxMzkuNzA2IDQwLjI5NDQgMTgwIDkwIDE4MFoiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPHBhdGggZD0iTTE1OC4wNDYgMzEuMzMyN0wxMzUuNjM0IDUzQzEyNS4xMzIgMzkuNjE2MSAxMDkuODc0IDMwLjQ1NTIgOTAgMzBWMEMxMTcuOTE1IDAgMTQxLjUzOCAxMS4zODUxIDE1OC4wNDYgMzEuMzMyN1oiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPC9zdmc+Cg==";
|
|
26
27
|
// TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
27
28
|
// @ts-ignore
|
|
28
|
-
const donutHalfSvg = "
|
|
29
|
+
const donutHalfSvg = "PHN2ZyB3aWR0aD0iMTgwIiBoZWlnaHQ9IjkwIiB2aWV3Qm94PSIwIDAgMTgwIDkwIiBmaWxsPSJub25lIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgo8cGF0aCBkPSJNMTU2LjkyNSAzMS45NTM4QzE0MC40MjUgMTIuOTg4NiAxMTcuMTEyIDAgOTAgMEM0MC4yOTQ0IDAgMCA0MC4yOTQ0IDAgOTBIMjlDMjkgNTYuODYyOSA1Ni4zNjI5IDMxIDg5LjUgMzFDMTA4LjMzIDMxIDEyNC44MjcgNDAuNDI5NiAxMzUuODI3IDU0TDE1Ni45MjUgMzEuOTUzOFoiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPHBhdGggZD0iTTE4MCA5MEgxNDguMTUyQzE0Ny44ODYgODAuMDk4OSAxNDQuMzk1IDY5LjkyMzMgMTM3Ljc5MyA1Ni4yNzY0TDE1OC44NjMgMzQuMjU4MUMxNzEuNDUzIDQ5Ljc0MDcgMTgwIDY4LjQ4OSAxODAgOTBaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+Cjwvc3ZnPgo=";
|
|
29
30
|
const pattern = {
|
|
30
31
|
true: donutHalfSvg,
|
|
31
32
|
false: donutFullSvg
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Donut.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","donutFullSvg","donutHalfSvg","pattern","true","false","position","DonutChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","halfsize","toString","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Donut/Donut.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonDonutChart } from './Donut.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import or vite plugin.\n// @ts-ignore\nconst donutFullSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/donut-chart.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst donutHalfSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/donut-chart-halfsize.svg'))\n`;\n\nconst pattern: Record<string, string> = {\n true: donutHalfSvg,\n false: donutFullSvg,\n};\nconst position: Record<string, string> = {\n true: 'center bottom',\n false: 'center',\n};\n\nfunction DonutChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonDonutChart.Component>,\n) {\n const SChartSkeleton = Root;\n const halfsize = (props.halfsize ?? false).toString();\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='no-repeat'\n bgPosition={position[halfsize]}\n bgSize='contain'\n bgPattern={`url(data:image/svg+xml;base64,${pattern[halfsize]})`}\n />,\n );\n}\n\n/**\n * DonutChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#donutchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonDonutChart.Component,\n typeof DonutChartSkeleton\n>(DonutChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,YAAY,
|
|
1
|
+
{"version":3,"file":"Donut.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","donutFullSvg","donutHalfSvg","pattern","true","false","position","DonutChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","halfsize","toString","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Donut/Donut.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonDonutChart } from './Donut.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import or vite plugin.\n// @ts-ignore\nconst donutFullSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/donut-chart.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst donutHalfSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/donut-chart-halfsize.svg'))\n`;\n\nconst pattern: Record<string, string> = {\n true: donutHalfSvg,\n false: donutFullSvg,\n};\nconst position: Record<string, string> = {\n true: 'center bottom',\n false: 'center',\n};\n\nfunction DonutChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonDonutChart.Component>,\n) {\n const SChartSkeleton = Root;\n const halfsize = (props.halfsize ?? false).toString();\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat='no-repeat'\n bgPosition={position[halfsize]}\n bgSize='contain'\n bgPattern={`url(data:image/svg+xml;base64,${pattern[halfsize]})`}\n />,\n );\n}\n\n/**\n * DonutChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#donutchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonDonutChart.Component,\n typeof DonutChartSkeleton\n>(DonutChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,YAAY,y/BAEjB;AACD;AACA;AACA,MAAMC,YAAY,inBAEjB;AAED,MAAMC,OAA+B,GAAG;EACtCC,IAAI,EAAEF,YAAY;EAClBG,KAAK,EAAEJ;AACT,CAAC;AACD,MAAMK,QAAgC,GAAG;EACvCF,IAAI,EAAE,eAAe;EACrBC,KAAK,EAAE;AACT,CAAC;AAED,SAASE,kBAAkBA,CACzBC,KAAwF,EACxF;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EACA,MAAMC,cAAc,GAIRC,kBAAQ;EAHpB,MAAMC,QAAQ,GAAG,CAACN,KAAK,CAACM,QAAQ,IAAI,KAAK,EAAEC,QAAQ,CAAC,CAAC;EACrD,OAAAJ,KAAA,GAAO,IAAAZ,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAqB,OAAA,CAAAC,aAAA,CAACL,cAAc,EAAAD,KAAA,CAAAO,EAAA;IAAA,OAAAzB,KAAA,CAAA0B,WAAA;MAAA,YAEJ,WAAW;MAAA,cACRb,QAAQ,CAACQ,QAAQ,CAAC;MAAA,UACvB,SAAS;MAAA,aACL,iCAAiCX,OAAO,CAACW,QAAQ,CAAC;IAAG,GAAAL,IAAA;EAAA,EACjE,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAW,QAAA,GAAAC,OAAA,CAAAL,OAAA,GAKe,IAAAM,qBAAe,EAG5Bf,kBAAkB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Donut.type.js","names":[],"sources":["../../../../src/charts/Donut/Donut.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonDonutChart {\n type Props = NSSkeleton.Props & {\n /** Semi donut */\n halfsize?: boolean;\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in
|
|
1
|
+
{"version":3,"file":"Donut.type.js","names":[],"sources":["../../../../src/charts/Donut/Donut.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonDonutChart {\n type Props = NSSkeleton.Props & {\n /** Semi donut */\n halfsize?: boolean;\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in v19. */\nexport type DonutChartSkeletonProps = NSSkeletonDonutChart.Props;\n\nexport type { NSSkeletonDonutChart };\n"],"mappings":"","ignoreList":[]}
|
|
@@ -9,23 +9,24 @@ var _core = require("@semcore/core");
|
|
|
9
9
|
var _react = _interopRequireDefault(require("react"));
|
|
10
10
|
var _Skeleton = require("../../Skeleton");
|
|
11
11
|
/*!__reshadow-styles__:"../../style/chart.shadow.css"*/
|
|
12
|
-
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
12
|
+
const styles = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SChartSkeleton_12qq0_gg_{height:200px;width:100%;-webkit-mask-image:var(--bgPattern_12qq0);mask-image:var(--bgPattern_12qq0);background-color:var(--intergalactic-skeleton-bg,oklch(.94 .002 180))}.___SChartSkeleton_12qq0_gg_._theme_invert_12qq0_gg_{background-color:var(--intergalactic-skeleton-bg-invert,oklch(.5 .004 147.4))}.___SChartSkeleton_12qq0_gg_.__bgPosition_12qq0_gg_{-webkit-mask-position:var(--bgPosition_12qq0);mask-position:var(--bgPosition_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgSize_12qq0_gg_{-webkit-mask-size:var(--bgSize_12qq0);mask-size:var(--bgSize_12qq0)}.___SChartSkeleton_12qq0_gg_.__bgRepeat_12qq0_gg_{-webkit-mask-repeat:var(--bgRepeat_12qq0);mask-repeat:var(--bgRepeat_12qq0)}", /*__inner_css_end__*/"12qq0_gg_"),
|
|
13
13
|
/*__reshadow_css_end__*/
|
|
14
14
|
{
|
|
15
|
-
"__SChartSkeleton": "
|
|
16
|
-
"--bgPattern": "--
|
|
17
|
-
"
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
"
|
|
21
|
-
"
|
|
22
|
-
"
|
|
15
|
+
"__SChartSkeleton": "___SChartSkeleton_12qq0_gg_",
|
|
16
|
+
"--bgPattern": "--bgPattern_12qq0",
|
|
17
|
+
"_theme_invert": "_theme_invert_12qq0_gg_",
|
|
18
|
+
"_bgPosition": "__bgPosition_12qq0_gg_",
|
|
19
|
+
"--bgPosition": "--bgPosition_12qq0",
|
|
20
|
+
"_bgSize": "__bgSize_12qq0_gg_",
|
|
21
|
+
"--bgSize": "--bgSize_12qq0",
|
|
22
|
+
"_bgRepeat": "__bgRepeat_12qq0_gg_",
|
|
23
|
+
"--bgRepeat": "--bgRepeat_12qq0"
|
|
23
24
|
}); // TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
24
25
|
// @ts-ignore
|
|
25
|
-
const histogramVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
26
|
+
const histogramVerticalSvg = "PHN2ZyB3aWR0aD0iMTcyIiBoZWlnaHQ9IjE0MCIgdmlld0JveD0iMCAwIDE3MiAxNDAiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0wIDBIMTIwQzEyMi4yMDkgMCAxMjQgMS43OTA4NiAxMjQgNFYyMEMxMjQgMjIuMjA5MSAxMjIuMjA5IDI0IDEyMCAyNEgwVjBaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0wIDI4SDE1NkMxNTguMjA5IDI4IDE2MCAyOS43OTA5IDE2MCAzMlY0OEMxNjAgNTAuMjA5MSAxNTguMjA5IDUyIDE1NiA1MkgwVjI4WiIgZmlsbD0ib2tsY2goMC45NCAwLjAwMiAxODApIiAvPgo8cGF0aCBkPSJNMCA1NkgxMzhDMTQwLjIwOSA1NiAxNDIgNTcuNzkwOSAxNDIgNjBWNzZDMTQyIDc4LjIwOTEgMTQwLjIwOSA4MCAxMzggODBIMFY1NloiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPHBhdGggZD0iTTAgODRIMTU2QzE1OC4yMDkgODQgMTYwIDg1Ljc5MDkgMTYwIDg4VjEwNEMxNjAgMTA2LjIwOSAxNTguMjA5IDEwOCAxNTYgMTA4SDBWODRaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0wIDExMkgxMTZDMTE4LjIwOSAxMTIgMTIwIDExMy43OTEgMTIwIDExNlYxMzJDMTIwIDEzNC4yMDkgMTE4LjIwOSAxMzYgMTE2IDEzNkgwVjExMloiIGZpbGw9Im9rbGNoKDAuOTQgMC4wMDIgMTgwKSIgLz4KPC9zdmc+Cg==";
|
|
26
27
|
// TODO: replace it with babel-plugin-inline-import/or vite plugin.
|
|
27
28
|
// @ts-ignore
|
|
28
|
-
const histogramHorizontalSvg = "PHN2ZyB3aWR0aD0iNDU2IiBoZWlnaHQ9IjEwNCIgdmlld0JveD0iMCAwIDQ1NiAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+
|
|
29
|
+
const histogramHorizontalSvg = "PHN2ZyB3aWR0aD0iNDU2IiBoZWlnaHQ9IjEwNCIgdmlld0JveD0iMCAwIDQ1NiAxMDQiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik0yIDE0QzIgMTIuODk1NCAyLjg5NTQzIDEyIDQgMTJIMTEwLjkwMUMxMTIuMDA1IDEyIDExMi45MDEgMTIuODk1NCAxMTIuOTAxIDE0VjkySDJWMTRaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0xMTYuOTAxIDMwQzExNi45MDEgMjguODk1NCAxMTcuNzk2IDI4IDExOC45MDEgMjhIMjI0LjgwMkMyMjUuOTA2IDI4IDIyNi44MDIgMjguODk1NCAyMjYuODAyIDMwVjkySDExNi45MDFWMzBaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0yMzAuODAyIDYyQzIzMC44MDIgNjAuODk1NCAyMzEuNjk3IDYwIDIzMi44MDIgNjBIMzM4LjcwMkMzMzkuODA3IDYwIDM0MC43MDIgNjAuODk1NCAzNDAuNzAyIDYyVjkySDIzMC44MDJWNjJaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+CjxwYXRoIGQ9Ik0zNDQuNzAyIDQ0QzM0NC43MDIgNDIuODk1NCAzNDUuNTk4IDQyIDM0Ni43MDIgNDJINDUxLjYwM0M0NTIuNzA4IDQyIDQ1My42MDMgNDIuODk1NCA0NTMuNjAzIDQ0VjkySDM0NC43MDJWNDRaIiBmaWxsPSJva2xjaCgwLjk0IDAuMDAyIDE4MCkiIC8+Cjwvc3ZnPgo=";
|
|
29
30
|
const repeat = {
|
|
30
31
|
vertical: 'repeat-y',
|
|
31
32
|
horizontal: 'repeat-x'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Histogram.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","histogramVerticalSvg","histogramHorizontalSvg","repeat","vertical","horizontal","position","size","pattern","HistogramChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","layout","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Histogram/Histogram.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonHistogramChart } from './Histogram.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst histogramVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/histogram-chart-vertical.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst histogramHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/histogram-chart-horizontal.svg'))\n`;\n\nconst repeat = { vertical: 'repeat-y', horizontal: 'repeat-x' };\nconst position = { vertical: 'left top', horizontal: 'left bottom' };\nconst size = { vertical: 'contain', horizontal: 'auto 50%' };\nconst pattern = { vertical: histogramVerticalSvg, horizontal: histogramHorizontalSvg };\n\nfunction HistogramChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonHistogramChart.Component>,\n) {\n const SChartSkeleton = Root;\n const layout = props.layout ?? 'horizontal';\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat={repeat[layout]}\n bgPosition={position[layout]}\n bgSize={size[layout]}\n bgPattern={`url(data:image/svg+xml;base64,${pattern[layout]})`}\n />,\n );\n}\n\n/**\n * HistogramChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#histogramchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonHistogramChart.Component,\n typeof HistogramChartSkeleton\n>(HistogramChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,oBAAoB,
|
|
1
|
+
{"version":3,"file":"Histogram.js","names":["_core","require","_react","_interopRequireDefault","_Skeleton","styles","sstyled","insert","histogramVerticalSvg","histogramHorizontalSvg","repeat","vertical","horizontal","position","size","pattern","HistogramChartSkeleton","props","_ref","arguments[0]","_ref2","SChartSkeleton","Skeleton","layout","default","createElement","cn","assignProps","_default","exports","createComponent"],"sources":["../../../../src/charts/Histogram/Histogram.tsx"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\nimport { createComponent, Root, sstyled } from '@semcore/core';\nimport React from 'react';\n\nimport type { NSSkeletonHistogramChart } from './Histogram.type';\nimport { Skeleton } from '../../Skeleton';\nimport styles from '../../style/chart.shadow.css';\n\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst histogramVerticalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/histogram-chart-vertical.svg'))\n`;\n// TODO: replace it with babel-plugin-inline-import/or vite plugin.\n// @ts-ignore\nconst histogramHorizontalSvg = preval`\nmodule.exports = btoa(require('fs').readFileSync(__dirname + '/../../svg/histogram-chart-horizontal.svg'))\n`;\n\nconst repeat = { vertical: 'repeat-y', horizontal: 'repeat-x' };\nconst position = { vertical: 'left top', horizontal: 'left bottom' };\nconst size = { vertical: 'contain', horizontal: 'auto 50%' };\nconst pattern = { vertical: histogramVerticalSvg, horizontal: histogramHorizontalSvg };\n\nfunction HistogramChartSkeleton(\n props: Intergalactic.InternalTypings.InferComponentProps<NSSkeletonHistogramChart.Component>,\n) {\n const SChartSkeleton = Root;\n const layout = props.layout ?? 'horizontal';\n return sstyled(styles)(\n <SChartSkeleton\n render={Skeleton}\n bgRepeat={repeat[layout]}\n bgPosition={position[layout]}\n bgSize={size[layout]}\n bgPattern={`url(data:image/svg+xml;base64,${pattern[layout]})`}\n />,\n );\n}\n\n/**\n * HistogramChartSkeleton\n *\n * {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-api#histogramchartskeleton|API} | {@link https://developer.semrush.com/intergalactic/components/skeleton/skeleton-code#chart-skeleton|Examples}\n */\nexport default createComponent<\n NSSkeletonHistogramChart.Component,\n typeof HistogramChartSkeleton\n>(HistogramChartSkeleton);\n"],"mappings":";;;;;;;AACA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AAA0C;AAAA,MAAAI,MAAA,8BAAAL,KAAA,CAAAM,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA,IAG1C;AACA;AACA,MAAMC,oBAAoB,q8BAEzB;AACD;AACA;AACA,MAAMC,sBAAsB,q6BAE3B;AAED,MAAMC,MAAM,GAAG;EAAEC,QAAQ,EAAE,UAAU;EAAEC,UAAU,EAAE;AAAW,CAAC;AAC/D,MAAMC,QAAQ,GAAG;EAAEF,QAAQ,EAAE,UAAU;EAAEC,UAAU,EAAE;AAAc,CAAC;AACpE,MAAME,IAAI,GAAG;EAAEH,QAAQ,EAAE,SAAS;EAAEC,UAAU,EAAE;AAAW,CAAC;AAC5D,MAAMG,OAAO,GAAG;EAAEJ,QAAQ,EAAEH,oBAAoB;EAAEI,UAAU,EAAEH;AAAuB,CAAC;AAEtF,SAASO,sBAAsBA,CAC7BC,KAA4F,EAC5F;EAAA,IAAAC,IAAA,GAAAC,YAAA;IAAAC,KAAA;EACA,MAAMC,cAAc,GAIRC,kBAAQ;EAHpB,MAAMC,MAAM,GAAGN,KAAK,CAACM,MAAM,IAAI,YAAY;EAC3C,OAAAH,KAAA,GAAO,IAAAd,aAAO,EAACD,MAAM,CAAC,eACpBH,MAAA,CAAAsB,OAAA,CAAAC,aAAA,CAACJ,cAAc,EAAAD,KAAA,CAAAM,EAAA;IAAA,OAAA1B,KAAA,CAAA2B,WAAA;MAAA,YAEHjB,MAAM,CAACa,MAAM,CAAC;MAAA,cACZV,QAAQ,CAACU,MAAM,CAAC;MAAA,UACpBT,IAAI,CAACS,MAAM,CAAC;MAAA,aACT,iCAAiCR,OAAO,CAACQ,MAAM,CAAC;IAAG,GAAAL,IAAA;EAAA,EAC/D,CAAC;AAEN;;AAEA;AACA;AACA;AACA;AACA;AAJA,IAAAU,QAAA,GAAAC,OAAA,CAAAL,OAAA,GAKe,IAAAM,qBAAe,EAG5Bd,sBAAsB,CAAC","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Histogram.type.js","names":[],"sources":["../../../../src/charts/Histogram/Histogram.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonHistogramChart {\n type Props = NSSkeleton.Props & {\n /** Controls the orientation of the histogram chart skeleton */\n layout?: 'horizontal' | 'vertical';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in
|
|
1
|
+
{"version":3,"file":"Histogram.type.js","names":[],"sources":["../../../../src/charts/Histogram/Histogram.type.ts"],"sourcesContent":["import type { Intergalactic } from '@semcore/core';\n\nimport type { NSSkeleton } from '../../Skeleton.type';\n\ndeclare namespace NSSkeletonHistogramChart {\n type Props = NSSkeleton.Props & {\n /** Controls the orientation of the histogram chart skeleton */\n layout?: 'horizontal' | 'vertical';\n };\n type Component = Intergalactic.Component<'svg', Props>;\n}\n\n/** @deprecated It will be removed in v19. */\nexport type HistogramChartSkeletonProps = NSSkeletonHistogramChart.Props;\n\nexport type { NSSkeletonHistogramChart };\n"],"mappings":"","ignoreList":[]}
|