@semcore/progress-bar 17.1.0-prerelease.3 → 17.2.0-prerelease.3
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/ProgressBar.js +21 -15
- package/lib/cjs/ProgressBar.js.map +1 -1
- package/lib/cjs/ProgressBar.type.js.map +1 -1
- package/lib/es6/ProgressBar.js +21 -15
- package/lib/es6/ProgressBar.js.map +1 -1
- package/lib/es6/ProgressBar.type.js.map +1 -1
- package/lib/esm/ProgressBar.mjs +17 -17
- package/lib/types/ProgressBar.d.ts +5 -0
- package/lib/types/ProgressBar.type.d.ts +6 -0
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
package/lib/cjs/ProgressBar.js
CHANGED
|
@@ -11,23 +11,23 @@ var _baseComponents = require("@semcore/base-components");
|
|
|
11
11
|
var _resolveColorEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/resolveColorEnhance"));
|
|
12
12
|
var _react = _interopRequireDefault(require("react"));
|
|
13
13
|
/*!__reshadow-styles__:"./style/progress-bar.shadow.css"*/
|
|
14
|
-
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/"
|
|
14
|
+
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SProgressBar_1u74u_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}.___SProgressBar_1u74u_gg_._theme_dark_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg-invert,#545654)}.___SValue_1u74u_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0));overflow:hidden;animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_1u74u);animation-duration:var(--duration_1u74u);transition-duration:var(--duration_1u74u)}@supports (color:color(display-p3 0 0 0%)){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0))}@media (color-gamut:p3){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,color(display-p3 .72564 .56096 .98326) 0,color(display-p3 .72564 .56096 .98326) 50%,#b17df1 0,#b17df1 75%,color(display-p3 .72564 .56096 .98326) 0))}}}.___SValue_1u74u_gg_.__theme_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}.___SProgressBar_1u74u_gg_._size_s_1u74u_gg_,.___SValue_1u74u_gg_._size_s_1u74u_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:8px 8px}.___SProgressBar_1u74u_gg_._size_m_1u74u_gg_,.___SValue_1u74u_gg_._size_m_1u74u_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:12px 12px}.___SProgressBar_1u74u_gg_._size_l_1u74u_gg_,.___SValue_1u74u_gg_._size_l_1u74u_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:16px 16px}.___SProgressBar_1u74u_gg_._theme_invert_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}@keyframes loading_1u74u{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_{background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-pattern-gradient,linear-gradient(-45deg,#0000001a 25%,#f1f2f2 0,#f1f2f2 50%,#0000001a 0,#0000001a 75%,#f1f2f2 0));animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_1u74u)}.___SProgressBar_1u74u_gg_._theme_custom_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}@media (prefers-reduced-motion){.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_,.___SValue_1u74u_gg_{animation-name:none}}", /*__inner_css_end__*/"1u74u_gg_"),
|
|
15
15
|
/*__reshadow_css_end__*/
|
|
16
16
|
{
|
|
17
|
-
"__SProgressBar": "
|
|
18
|
-
"_theme_dark": "
|
|
19
|
-
"__SValue": "
|
|
20
|
-
"--width": "--
|
|
21
|
-
"--duration": "--
|
|
22
|
-
"_theme": "
|
|
23
|
-
"--colorBg": "--
|
|
24
|
-
"_size_s": "
|
|
25
|
-
"_size_m": "
|
|
26
|
-
"_size_l": "
|
|
27
|
-
"_theme_invert": "
|
|
28
|
-
"@loading": "
|
|
29
|
-
"_animation": "
|
|
30
|
-
"_theme_custom": "
|
|
17
|
+
"__SProgressBar": "___SProgressBar_1u74u_gg_",
|
|
18
|
+
"_theme_dark": "_theme_dark_1u74u_gg_",
|
|
19
|
+
"__SValue": "___SValue_1u74u_gg_",
|
|
20
|
+
"--width": "--width_1u74u",
|
|
21
|
+
"--duration": "--duration_1u74u",
|
|
22
|
+
"_theme": "__theme_1u74u_gg_",
|
|
23
|
+
"--colorBg": "--colorBg_1u74u",
|
|
24
|
+
"_size_s": "_size_s_1u74u_gg_",
|
|
25
|
+
"_size_m": "_size_m_1u74u_gg_",
|
|
26
|
+
"_size_l": "_size_l_1u74u_gg_",
|
|
27
|
+
"_theme_invert": "_theme_invert_1u74u_gg_",
|
|
28
|
+
"@loading": "loading_1u74u",
|
|
29
|
+
"_animation": "__animation_1u74u_gg_",
|
|
30
|
+
"_theme_custom": "_theme_custom_1u74u_gg_"
|
|
31
31
|
});
|
|
32
32
|
function isCustomTheme(theme) {
|
|
33
33
|
if (!theme) return false;
|
|
@@ -102,6 +102,12 @@ function Value(props) {
|
|
|
102
102
|
}, _ref2)
|
|
103
103
|
}));
|
|
104
104
|
}
|
|
105
|
+
|
|
106
|
+
/**
|
|
107
|
+
* ProgressBar
|
|
108
|
+
*
|
|
109
|
+
* {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-api/|API} | {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-code/|Examples}
|
|
110
|
+
*/
|
|
105
111
|
const ProgressBar = (0, _core.createComponent)(ProgressBarRoot, {
|
|
106
112
|
Value
|
|
107
113
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","names":["_core","require","_baseComponents","_resolveColorEnhance","_interopRequireDefault","_react","style","sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","Component","getValueProps","value","duration","size","resolveColor","asProps","render","_ref","_ref3","SProgressBar","Box","Children","styles","useTheme","default","createElement","cn","assignProps","_defineProperty2","resolveColorEnhance","children","ProgressBar","Value","props","_ref2","arguments[0]","_ref4","SValue","width","createComponent","_default","exports"],"sources":["../../src/ProgressBar.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';\nimport React from 'react';\n\nimport type { NSProgressBar } from './ProgressBar.type';\nimport style from './style/progress-bar.shadow.css';\n\nfunction isCustomTheme(theme?: string) {\n if (!theme) return false;\n\n return !['dark', 'invert'].includes(theme);\n}\n\nclass ProgressBarRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSProgressBar.Component>,\n typeof ProgressBarRoot.enhance\n> {\n static displayName = 'ProgressBar';\n static style = style;\n static enhance = [resolveColorEnhance()] as const;\n static defaultProps = () => ({\n duration: 1000,\n size: 'm',\n theme: 'invert',\n children: <ProgressBar.Value />,\n });\n\n getValueProps() {\n const { value, duration, size, resolveColor } = this.asProps;\n return {\n value,\n duration,\n size,\n resolveColor,\n };\n }\n\n render() {\n const SProgressBar = Root;\n const { Children, styles, duration, theme, value, resolveColor } = this.asProps;\n const useTheme = isCustomTheme(theme) ? 'custom' : theme;\n\n return sstyled(styles)(\n <SProgressBar\n render={Box}\n use:theme={useTheme}\n use:animation={!value}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n role='progressbar'\n aria-valuenow={value}\n >\n <Children />\n </SProgressBar>,\n );\n }\n}\n\nfunction Value(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n NSProgressBar.Value.Component,\n typeof ProgressBarRoot,\n 'Value'\n >,\n) {\n const SValue = Root;\n const { styles, value, theme, duration, resolveColor } = props;\n const width = `${value}%`;\n\n return sstyled(styles)(\n <SValue\n render={Box}\n use:width={width}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n />,\n );\n}\n\nconst ProgressBar = createComponent(ProgressBarRoot, {\n Value,\n})
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","names":["_core","require","_baseComponents","_resolveColorEnhance","_interopRequireDefault","_react","style","sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","Component","getValueProps","value","duration","size","resolveColor","asProps","render","_ref","_ref3","SProgressBar","Box","Children","styles","useTheme","default","createElement","cn","assignProps","_defineProperty2","resolveColorEnhance","children","ProgressBar","Value","props","_ref2","arguments[0]","_ref4","SValue","width","createComponent","_default","exports"],"sources":["../../src/ProgressBar.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';\nimport React from 'react';\n\nimport type { NSProgressBar } from './ProgressBar.type';\nimport style from './style/progress-bar.shadow.css';\n\nfunction isCustomTheme(theme?: string) {\n if (!theme) return false;\n\n return !['dark', 'invert'].includes(theme);\n}\n\nclass ProgressBarRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSProgressBar.Component>,\n typeof ProgressBarRoot.enhance,\n {},\n {},\n {},\n NSProgressBar.DefaultProps\n> {\n static displayName = 'ProgressBar';\n static style = style;\n static enhance = [resolveColorEnhance()] as const;\n static defaultProps = () => ({\n duration: 1000,\n size: 'm',\n theme: 'invert',\n children: <ProgressBar.Value />,\n } as const);\n\n getValueProps() {\n const { value, duration, size, resolveColor } = this.asProps;\n return {\n value,\n duration,\n size,\n resolveColor,\n };\n }\n\n render() {\n const SProgressBar = Root;\n const { Children, styles, duration, theme, value, resolveColor } = this.asProps;\n const useTheme = isCustomTheme(theme) ? 'custom' : theme;\n\n return sstyled(styles)(\n <SProgressBar\n render={Box}\n use:theme={useTheme}\n use:animation={!value}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n role='progressbar'\n aria-valuenow={value}\n >\n <Children />\n </SProgressBar>,\n );\n }\n}\n\nfunction Value(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n NSProgressBar.Value.Component,\n typeof ProgressBarRoot,\n 'Value'\n >,\n) {\n const SValue = Root;\n const { styles, value, theme, duration, resolveColor } = props;\n const width = `${value}%`;\n\n return sstyled(styles)(\n <SValue\n render={Box}\n use:width={width}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n />,\n );\n}\n\n/**\n * ProgressBar\n *\n * {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-api/|API} | {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-code/|Examples}\n */\nconst ProgressBar = createComponent<\n NSProgressBar.Component,\n typeof ProgressBarRoot\n>(ProgressBarRoot, {\n Value,\n});\n\nexport default ProgressBar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.type.js","names":[],"sources":["../../src/ProgressBar.type.ts"],"sourcesContent":["import type { BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\n\ndeclare namespace NSProgressBar {\n type Props = BoxProps & {\n /**\n * Progress bar theme\n * @default invert\n */\n theme?: 'dark' | 'invert' | string;\n /**\n * Progress bar size\n * @default m\n */\n size?: 's' | 'm' | 'l';\n /** Value as a percentage */\n value?: number;\n /** Duration of animation, ms\n * @default 1000\n */\n duration?: number;\n };\n\n type Ctx = {\n getValueProps: PropGetterFn;\n };\n\n namespace Value {\n type Props = BoxProps & {\n /** Controls the size of the value bar */\n size?: 's' | 'm' | 'l';\n /** Progress value */\n value?: number;\n /** Animation diration in milliseconds for transitions */\n duration?: number;\n /** Color theme */\n theme?: string;\n };\n\n type Component = Intergalactic.Component<'div', Props>;\n }\n\n type Component = Intergalactic.Component<'div', Props, Ctx> & {\n Value: Value.Component;\n };\n}\n\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarProps = NSProgressBar.Props;\n/** @deprecated It will be removed in v18. */\nexport type ValueProps = NSProgressBar.Value.Props;\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarCxt = NSProgressBar.Ctx;\n\nexport type { NSProgressBar };\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ProgressBar.type.js","names":[],"sources":["../../src/ProgressBar.type.ts"],"sourcesContent":["import type { BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\n\ndeclare namespace NSProgressBar {\n type Props = BoxProps & {\n /**\n * Progress bar theme\n * @default invert\n */\n theme?: 'dark' | 'invert' | string;\n /**\n * Progress bar size\n * @default m\n */\n size?: 's' | 'm' | 'l';\n /** Value as a percentage */\n value?: number;\n /** Duration of animation, ms\n * @default 1000\n */\n duration?: number;\n };\n type DefaultProps = {\n duration: 1000;\n size: 'm';\n theme: 'invert';\n children: React.ReactNode;\n };\n\n type Ctx = {\n getValueProps: PropGetterFn;\n };\n\n namespace Value {\n type Props = BoxProps & {\n /** Controls the size of the value bar */\n size?: 's' | 'm' | 'l';\n /** Progress value */\n value?: number;\n /** Animation diration in milliseconds for transitions */\n duration?: number;\n /** Color theme */\n theme?: string;\n };\n\n type Component = Intergalactic.Component<'div', Props>;\n }\n\n type Component = Intergalactic.Component<'div', Props, Ctx> & {\n Value: Value.Component;\n };\n}\n\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarProps = NSProgressBar.Props;\n/** @deprecated It will be removed in v18. */\nexport type ValueProps = NSProgressBar.Value.Props;\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarCxt = NSProgressBar.Ctx;\n\nexport type { NSProgressBar };\n"],"mappings":"","ignoreList":[]}
|
package/lib/es6/ProgressBar.js
CHANGED
|
@@ -7,23 +7,23 @@ import { createComponent, Component, sstyled, Root } from '@semcore/core';
|
|
|
7
7
|
import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
|
|
8
8
|
import React from 'react';
|
|
9
9
|
/*!__reshadow-styles__:"./style/progress-bar.shadow.css"*/
|
|
10
|
-
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/"
|
|
10
|
+
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SProgressBar_1u74u_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}.___SProgressBar_1u74u_gg_._theme_dark_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg-invert,#545654)}.___SValue_1u74u_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0));overflow:hidden;animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_1u74u);animation-duration:var(--duration_1u74u);transition-duration:var(--duration_1u74u)}@supports (color:color(display-p3 0 0 0%)){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0))}@media (color-gamut:p3){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,color(display-p3 .72564 .56096 .98326) 0,color(display-p3 .72564 .56096 .98326) 50%,#b17df1 0,#b17df1 75%,color(display-p3 .72564 .56096 .98326) 0))}}}.___SValue_1u74u_gg_.__theme_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}.___SProgressBar_1u74u_gg_._size_s_1u74u_gg_,.___SValue_1u74u_gg_._size_s_1u74u_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:8px 8px}.___SProgressBar_1u74u_gg_._size_m_1u74u_gg_,.___SValue_1u74u_gg_._size_m_1u74u_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:12px 12px}.___SProgressBar_1u74u_gg_._size_l_1u74u_gg_,.___SValue_1u74u_gg_._size_l_1u74u_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:16px 16px}.___SProgressBar_1u74u_gg_._theme_invert_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}@keyframes loading_1u74u{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_{background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-pattern-gradient,linear-gradient(-45deg,#0000001a 25%,#f1f2f2 0,#f1f2f2 50%,#0000001a 0,#0000001a 75%,#f1f2f2 0));animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_1u74u)}.___SProgressBar_1u74u_gg_._theme_custom_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}@media (prefers-reduced-motion){.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_,.___SValue_1u74u_gg_{animation-name:none}}", /*__inner_css_end__*/"1u74u_gg_"),
|
|
11
11
|
/*__reshadow_css_end__*/
|
|
12
12
|
{
|
|
13
|
-
"__SProgressBar": "
|
|
14
|
-
"_theme_dark": "
|
|
15
|
-
"__SValue": "
|
|
16
|
-
"--width": "--
|
|
17
|
-
"--duration": "--
|
|
18
|
-
"_theme": "
|
|
19
|
-
"--colorBg": "--
|
|
20
|
-
"_size_s": "
|
|
21
|
-
"_size_m": "
|
|
22
|
-
"_size_l": "
|
|
23
|
-
"_theme_invert": "
|
|
24
|
-
"@loading": "
|
|
25
|
-
"_animation": "
|
|
26
|
-
"_theme_custom": "
|
|
13
|
+
"__SProgressBar": "___SProgressBar_1u74u_gg_",
|
|
14
|
+
"_theme_dark": "_theme_dark_1u74u_gg_",
|
|
15
|
+
"__SValue": "___SValue_1u74u_gg_",
|
|
16
|
+
"--width": "--width_1u74u",
|
|
17
|
+
"--duration": "--duration_1u74u",
|
|
18
|
+
"_theme": "__theme_1u74u_gg_",
|
|
19
|
+
"--colorBg": "--colorBg_1u74u",
|
|
20
|
+
"_size_s": "_size_s_1u74u_gg_",
|
|
21
|
+
"_size_m": "_size_m_1u74u_gg_",
|
|
22
|
+
"_size_l": "_size_l_1u74u_gg_",
|
|
23
|
+
"_theme_invert": "_theme_invert_1u74u_gg_",
|
|
24
|
+
"@loading": "loading_1u74u",
|
|
25
|
+
"_animation": "__animation_1u74u_gg_",
|
|
26
|
+
"_theme_custom": "_theme_custom_1u74u_gg_"
|
|
27
27
|
});
|
|
28
28
|
function isCustomTheme(theme) {
|
|
29
29
|
if (!theme) return false;
|
|
@@ -98,6 +98,12 @@ function Value(props) {
|
|
|
98
98
|
}, _ref2)
|
|
99
99
|
}));
|
|
100
100
|
}
|
|
101
|
+
|
|
102
|
+
/**
|
|
103
|
+
* ProgressBar
|
|
104
|
+
*
|
|
105
|
+
* {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-api/|API} | {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-code/|Examples}
|
|
106
|
+
*/
|
|
101
107
|
const ProgressBar = createComponent(ProgressBarRoot, {
|
|
102
108
|
Value
|
|
103
109
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","names":["Box","createComponent","Component","sstyled","Root","resolveColorEnhance","React","style","_sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","getValueProps","value","duration","size","resolveColor","asProps","render","_ref","_ref3","SProgressBar","Children","styles","useTheme","createElement","cn","_assignProps","_defineProperty","children","ProgressBar","Value","props","_ref2","arguments[0]","_ref4","SValue","width","_assignProps2"],"sources":["../../src/ProgressBar.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';\nimport React from 'react';\n\nimport type { NSProgressBar } from './ProgressBar.type';\nimport style from './style/progress-bar.shadow.css';\n\nfunction isCustomTheme(theme?: string) {\n if (!theme) return false;\n\n return !['dark', 'invert'].includes(theme);\n}\n\nclass ProgressBarRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSProgressBar.Component>,\n typeof ProgressBarRoot.enhance\n> {\n static displayName = 'ProgressBar';\n static style = style;\n static enhance = [resolveColorEnhance()] as const;\n static defaultProps = () => ({\n duration: 1000,\n size: 'm',\n theme: 'invert',\n children: <ProgressBar.Value />,\n });\n\n getValueProps() {\n const { value, duration, size, resolveColor } = this.asProps;\n return {\n value,\n duration,\n size,\n resolveColor,\n };\n }\n\n render() {\n const SProgressBar = Root;\n const { Children, styles, duration, theme, value, resolveColor } = this.asProps;\n const useTheme = isCustomTheme(theme) ? 'custom' : theme;\n\n return sstyled(styles)(\n <SProgressBar\n render={Box}\n use:theme={useTheme}\n use:animation={!value}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n role='progressbar'\n aria-valuenow={value}\n >\n <Children />\n </SProgressBar>,\n );\n }\n}\n\nfunction Value(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n NSProgressBar.Value.Component,\n typeof ProgressBarRoot,\n 'Value'\n >,\n) {\n const SValue = Root;\n const { styles, value, theme, duration, resolveColor } = props;\n const width = `${value}%`;\n\n return sstyled(styles)(\n <SValue\n render={Box}\n use:width={width}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n />,\n );\n}\n\nconst ProgressBar = createComponent(ProgressBarRoot, {\n Value,\n})
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","names":["Box","createComponent","Component","sstyled","Root","resolveColorEnhance","React","style","_sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","getValueProps","value","duration","size","resolveColor","asProps","render","_ref","_ref3","SProgressBar","Children","styles","useTheme","createElement","cn","_assignProps","_defineProperty","children","ProgressBar","Value","props","_ref2","arguments[0]","_ref4","SValue","width","_assignProps2"],"sources":["../../src/ProgressBar.tsx"],"sourcesContent":["import { Box } from '@semcore/base-components';\nimport type { Intergalactic } from '@semcore/core';\nimport { createComponent, Component, sstyled, Root } from '@semcore/core';\nimport resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';\nimport React from 'react';\n\nimport type { NSProgressBar } from './ProgressBar.type';\nimport style from './style/progress-bar.shadow.css';\n\nfunction isCustomTheme(theme?: string) {\n if (!theme) return false;\n\n return !['dark', 'invert'].includes(theme);\n}\n\nclass ProgressBarRoot extends Component<\n Intergalactic.InternalTypings.InferComponentProps<NSProgressBar.Component>,\n typeof ProgressBarRoot.enhance,\n {},\n {},\n {},\n NSProgressBar.DefaultProps\n> {\n static displayName = 'ProgressBar';\n static style = style;\n static enhance = [resolveColorEnhance()] as const;\n static defaultProps = () => ({\n duration: 1000,\n size: 'm',\n theme: 'invert',\n children: <ProgressBar.Value />,\n } as const);\n\n getValueProps() {\n const { value, duration, size, resolveColor } = this.asProps;\n return {\n value,\n duration,\n size,\n resolveColor,\n };\n }\n\n render() {\n const SProgressBar = Root;\n const { Children, styles, duration, theme, value, resolveColor } = this.asProps;\n const useTheme = isCustomTheme(theme) ? 'custom' : theme;\n\n return sstyled(styles)(\n <SProgressBar\n render={Box}\n use:theme={useTheme}\n use:animation={!value}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n role='progressbar'\n aria-valuenow={value}\n >\n <Children />\n </SProgressBar>,\n );\n }\n}\n\nfunction Value(\n props: Intergalactic.InternalTypings.InferChildComponentProps<\n NSProgressBar.Value.Component,\n typeof ProgressBarRoot,\n 'Value'\n >,\n) {\n const SValue = Root;\n const { styles, value, theme, duration, resolveColor } = props;\n const width = `${value}%`;\n\n return sstyled(styles)(\n <SValue\n render={Box}\n use:width={width}\n use:duration={`${duration}ms`}\n colorBg={resolveColor(theme)}\n />,\n );\n}\n\n/**\n * ProgressBar\n *\n * {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-api/|API} | {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-code/|Examples}\n */\nconst ProgressBar = createComponent<\n NSProgressBar.Component,\n typeof ProgressBarRoot\n>(ProgressBarRoot, {\n Value,\n});\n\nexport default ProgressBar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.type.js","names":[],"sources":["../../src/ProgressBar.type.ts"],"sourcesContent":["import type { BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\n\ndeclare namespace NSProgressBar {\n type Props = BoxProps & {\n /**\n * Progress bar theme\n * @default invert\n */\n theme?: 'dark' | 'invert' | string;\n /**\n * Progress bar size\n * @default m\n */\n size?: 's' | 'm' | 'l';\n /** Value as a percentage */\n value?: number;\n /** Duration of animation, ms\n * @default 1000\n */\n duration?: number;\n };\n\n type Ctx = {\n getValueProps: PropGetterFn;\n };\n\n namespace Value {\n type Props = BoxProps & {\n /** Controls the size of the value bar */\n size?: 's' | 'm' | 'l';\n /** Progress value */\n value?: number;\n /** Animation diration in milliseconds for transitions */\n duration?: number;\n /** Color theme */\n theme?: string;\n };\n\n type Component = Intergalactic.Component<'div', Props>;\n }\n\n type Component = Intergalactic.Component<'div', Props, Ctx> & {\n Value: Value.Component;\n };\n}\n\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarProps = NSProgressBar.Props;\n/** @deprecated It will be removed in v18. */\nexport type ValueProps = NSProgressBar.Value.Props;\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarCxt = NSProgressBar.Ctx;\n\nexport type { NSProgressBar };\n"],"mappings":"","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"ProgressBar.type.js","names":[],"sources":["../../src/ProgressBar.type.ts"],"sourcesContent":["import type { BoxProps } from '@semcore/base-components';\nimport type { PropGetterFn, Intergalactic } from '@semcore/core';\n\ndeclare namespace NSProgressBar {\n type Props = BoxProps & {\n /**\n * Progress bar theme\n * @default invert\n */\n theme?: 'dark' | 'invert' | string;\n /**\n * Progress bar size\n * @default m\n */\n size?: 's' | 'm' | 'l';\n /** Value as a percentage */\n value?: number;\n /** Duration of animation, ms\n * @default 1000\n */\n duration?: number;\n };\n type DefaultProps = {\n duration: 1000;\n size: 'm';\n theme: 'invert';\n children: React.ReactNode;\n };\n\n type Ctx = {\n getValueProps: PropGetterFn;\n };\n\n namespace Value {\n type Props = BoxProps & {\n /** Controls the size of the value bar */\n size?: 's' | 'm' | 'l';\n /** Progress value */\n value?: number;\n /** Animation diration in milliseconds for transitions */\n duration?: number;\n /** Color theme */\n theme?: string;\n };\n\n type Component = Intergalactic.Component<'div', Props>;\n }\n\n type Component = Intergalactic.Component<'div', Props, Ctx> & {\n Value: Value.Component;\n };\n}\n\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarProps = NSProgressBar.Props;\n/** @deprecated It will be removed in v18. */\nexport type ValueProps = NSProgressBar.Value.Props;\n/** @deprecated It will be removed in v18. */\nexport type ProgressBarCxt = NSProgressBar.Ctx;\n\nexport type { NSProgressBar };\n"],"mappings":"","ignoreList":[]}
|
package/lib/esm/ProgressBar.mjs
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import _defineProperty from "@babel/runtime/helpers/
|
|
1
|
+
import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
2
2
|
import { sstyled, Component, assignProps, createComponent } from "@semcore/core";
|
|
3
3
|
import { Box } from "@semcore/base-components";
|
|
4
4
|
import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
|
|
@@ -8,25 +8,25 @@ const style = (
|
|
|
8
8
|
/*__reshadow_css_start__*/
|
|
9
9
|
(sstyled.insert(
|
|
10
10
|
/*__inner_css_start__*/
|
|
11
|
-
"
|
|
11
|
+
".___SProgressBar_1u74u_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}.___SProgressBar_1u74u_gg_._theme_dark_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg-invert,#545654)}.___SValue_1u74u_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0));overflow:hidden;animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_1u74u);animation-duration:var(--duration_1u74u);transition-duration:var(--duration_1u74u)}@supports (color:color(display-p3 0 0 0%)){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,#c08eff 0,#c08eff 50%,#b17df1 0,#b17df1 75%,#c08eff 0))}@media (color-gamut:p3){.___SValue_1u74u_gg_{background-image:var(--intergalactic-progress-bar-value-gradient,linear-gradient(-45deg,#b17df1 25%,color(display-p3 .72564 .56096 .98326) 0,color(display-p3 .72564 .56096 .98326) 50%,#b17df1 0,#b17df1 75%,color(display-p3 .72564 .56096 .98326) 0))}}}.___SValue_1u74u_gg_.__theme_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}.___SProgressBar_1u74u_gg_._size_s_1u74u_gg_,.___SValue_1u74u_gg_._size_s_1u74u_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:8px 8px}.___SProgressBar_1u74u_gg_._size_m_1u74u_gg_,.___SValue_1u74u_gg_._size_m_1u74u_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:12px 12px}.___SProgressBar_1u74u_gg_._size_l_1u74u_gg_,.___SValue_1u74u_gg_._size_l_1u74u_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded,6px);background-size:16px 16px}.___SProgressBar_1u74u_gg_._theme_invert_1u74u_gg_{background-color:var(--intergalactic-progress-bar-bg,#f1f2f2)}@keyframes loading_1u74u{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_{background-color:var(--intergalactic-progress-bar-value-bg,#fff);background-image:var(--intergalactic-progress-bar-pattern-gradient,linear-gradient(-45deg,#0000001a 25%,#f1f2f2 0,#f1f2f2 50%,#0000001a 0,#0000001a 75%,#f1f2f2 0));animation-name:loading_1u74u;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_1u74u)}.___SProgressBar_1u74u_gg_._theme_custom_1u74u_gg_{background-color:var(--colorBg_1u74u);background-image:var(--colorBg_1u74u)}@media (prefers-reduced-motion){.___SProgressBar_1u74u_gg_.__animation_1u74u_gg_,.___SValue_1u74u_gg_{animation-name:none}}",
|
|
12
12
|
/*__inner_css_end__*/
|
|
13
|
-
"
|
|
13
|
+
"1u74u_gg_"
|
|
14
14
|
), /*__reshadow_css_end__*/
|
|
15
15
|
{
|
|
16
|
-
"__SProgressBar": "
|
|
17
|
-
"_theme_dark": "
|
|
18
|
-
"__SValue": "
|
|
19
|
-
"--width": "--
|
|
20
|
-
"--duration": "--
|
|
21
|
-
"_theme": "
|
|
22
|
-
"--colorBg": "--
|
|
23
|
-
"_size_s": "
|
|
24
|
-
"_size_m": "
|
|
25
|
-
"_size_l": "
|
|
26
|
-
"_theme_invert": "
|
|
27
|
-
"@loading": "
|
|
28
|
-
"_animation": "
|
|
29
|
-
"_theme_custom": "
|
|
16
|
+
"__SProgressBar": "___SProgressBar_1u74u_gg_",
|
|
17
|
+
"_theme_dark": "_theme_dark_1u74u_gg_",
|
|
18
|
+
"__SValue": "___SValue_1u74u_gg_",
|
|
19
|
+
"--width": "--width_1u74u",
|
|
20
|
+
"--duration": "--duration_1u74u",
|
|
21
|
+
"_theme": "__theme_1u74u_gg_",
|
|
22
|
+
"--colorBg": "--colorBg_1u74u",
|
|
23
|
+
"_size_s": "_size_s_1u74u_gg_",
|
|
24
|
+
"_size_m": "_size_m_1u74u_gg_",
|
|
25
|
+
"_size_l": "_size_l_1u74u_gg_",
|
|
26
|
+
"_theme_invert": "_theme_invert_1u74u_gg_",
|
|
27
|
+
"@loading": "loading_1u74u",
|
|
28
|
+
"_animation": "__animation_1u74u_gg_",
|
|
29
|
+
"_theme_custom": "_theme_custom_1u74u_gg_"
|
|
30
30
|
})
|
|
31
31
|
);
|
|
32
32
|
function isCustomTheme(theme) {
|
|
@@ -1,3 +1,8 @@
|
|
|
1
1
|
import type { NSProgressBar } from './ProgressBar.type';
|
|
2
|
+
/**
|
|
3
|
+
* ProgressBar
|
|
4
|
+
*
|
|
5
|
+
* {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-api/|API} | {@link https://developer.semrush.com/intergalactic/components/progress-bar/progress-bar-code/|Examples}
|
|
6
|
+
*/
|
|
2
7
|
declare const ProgressBar: NSProgressBar.Component;
|
|
3
8
|
export default ProgressBar;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/progress-bar",
|
|
3
3
|
"description": "Semrush ProgressBar Component",
|
|
4
|
-
"version": "17.
|
|
4
|
+
"version": "17.2.0-prerelease.3",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"require": "./lib/cjs/index.js"
|
|
15
15
|
},
|
|
16
16
|
"peerDependencies": {
|
|
17
|
-
"@semcore/base-components": "^17.0
|
|
17
|
+
"@semcore/base-components": "^17.2.0"
|
|
18
18
|
},
|
|
19
19
|
"repository": {
|
|
20
20
|
"type": "git",
|
|
@@ -22,8 +22,8 @@
|
|
|
22
22
|
"directory": "semcore/progress-bar"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
|
-
"@semcore/
|
|
26
|
-
"@semcore/
|
|
25
|
+
"@semcore/base-components": "17.2.0-prerelease.3",
|
|
26
|
+
"@semcore/core": "17.2.0-prerelease.3",
|
|
27
27
|
"@semcore/testing-utils": "1.0.0"
|
|
28
28
|
},
|
|
29
29
|
"scripts": {
|