@semcore/progress-bar 16.1.0-prerelease.1 → 16.1.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/lib/cjs/ProgressBar.js +19 -18
- package/lib/cjs/ProgressBar.js.map +1 -1
- package/lib/cjs/ProgressBar.type.js +2 -0
- package/lib/cjs/ProgressBar.type.js.map +1 -0
- package/lib/cjs/index.js +13 -0
- package/lib/cjs/index.js.map +1 -1
- package/lib/es6/ProgressBar.js +17 -16
- package/lib/es6/ProgressBar.js.map +1 -1
- package/lib/es6/ProgressBar.type.js +2 -0
- package/lib/es6/ProgressBar.type.js.map +1 -0
- package/lib/es6/index.js +1 -0
- package/lib/es6/index.js.map +1 -1
- package/lib/esm/ProgressBar.mjs +19 -18
- package/lib/esm/ProgressBar.type.mjs +1 -0
- package/lib/esm/index.mjs +1 -0
- package/lib/types/ProgressBar.d.ts +3 -0
- package/lib/types/ProgressBar.type.d.ts +48 -0
- package/lib/types/index.d.ts +2 -48
- package/package.json +4 -4
- package/lib/cjs/index.d.js +0 -2
- package/lib/cjs/index.d.js.map +0 -1
- package/lib/es6/index.d.js +0 -2
- package/lib/es6/index.d.js.map +0 -1
package/lib/cjs/ProgressBar.js
CHANGED
|
@@ -12,29 +12,30 @@ var _callSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/callSup
|
|
|
12
12
|
var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
|
|
13
13
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
14
14
|
var _core = require("@semcore/core");
|
|
15
|
+
var _baseComponents = require("@semcore/base-components");
|
|
15
16
|
var _resolveColorEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/resolveColorEnhance"));
|
|
16
|
-
var _flexBox = require("@semcore/flex-box");
|
|
17
17
|
var _react = _interopRequireDefault(require("react"));
|
|
18
18
|
/*!__reshadow-styles__:"./style/progress-bar.shadow.css"*/
|
|
19
|
-
var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/"@keyframes
|
|
19
|
+
var style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/"@keyframes loading_176xh{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_176xh_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_._theme_dark_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg-invert, rgb(84, 86, 84))}.___SValue_176xh_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%));overflow:hidden;animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_176xh);animation-duration:var(--duration_176xh);transition-duration:var(--duration_176xh)}@supports (color:color(display-p3 0 0 0%)){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%))}@media (color-gamut:p3){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, color(display-p3 0.72564 0.56096 0.98326) 0%, color(display-p3 0.72564 0.56096 0.98326) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, color(display-p3 0.72564 0.56096 0.98326) 0%))}}}.___SValue_176xh_gg_.__theme_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}.___SProgressBar_176xh_gg_._size_s_176xh_gg_,.___SValue_176xh_gg_._size_s_176xh_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:8px 8px}.___SProgressBar_176xh_gg_._size_m_176xh_gg_,.___SValue_176xh_gg_._size_m_176xh_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:12px 12px}.___SProgressBar_176xh_gg_._size_l_176xh_gg_,.___SValue_176xh_gg_._size_l_176xh_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:16px 16px}.___SProgressBar_176xh_gg_._theme_invert_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_.__animation_176xh_gg_{background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-pattern-gradient, linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, rgb(241, 242, 242) 0%, rgb(241, 242, 242) 50%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 75%, rgb(241, 242, 242) 0%));animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_176xh)}.___SProgressBar_176xh_gg_._theme_custom_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}@media (prefers-reduced-motion){.___SProgressBar_176xh_gg_.__animation_176xh_gg_,.___SValue_176xh_gg_{animation-name:none}}", /*__inner_css_end__*/"176xh_gg_"),
|
|
20
20
|
/*__reshadow_css_end__*/
|
|
21
21
|
{
|
|
22
|
-
"__SProgressBar": "
|
|
23
|
-
"_theme_dark": "
|
|
24
|
-
"__SValue": "
|
|
25
|
-
"--width": "--
|
|
26
|
-
"--duration": "--
|
|
27
|
-
"_theme": "
|
|
28
|
-
"--colorBg": "--
|
|
29
|
-
"_size_s": "
|
|
30
|
-
"_size_m": "
|
|
31
|
-
"_size_l": "
|
|
32
|
-
"_theme_invert": "
|
|
33
|
-
"@loading": "
|
|
34
|
-
"_animation": "
|
|
35
|
-
"_theme_custom": "
|
|
22
|
+
"__SProgressBar": "___SProgressBar_176xh_gg_",
|
|
23
|
+
"_theme_dark": "_theme_dark_176xh_gg_",
|
|
24
|
+
"__SValue": "___SValue_176xh_gg_",
|
|
25
|
+
"--width": "--width_176xh",
|
|
26
|
+
"--duration": "--duration_176xh",
|
|
27
|
+
"_theme": "__theme_176xh_gg_",
|
|
28
|
+
"--colorBg": "--colorBg_176xh",
|
|
29
|
+
"_size_s": "_size_s_176xh_gg_",
|
|
30
|
+
"_size_m": "_size_m_176xh_gg_",
|
|
31
|
+
"_size_l": "_size_l_176xh_gg_",
|
|
32
|
+
"_theme_invert": "_theme_invert_176xh_gg_",
|
|
33
|
+
"@loading": "loading_176xh",
|
|
34
|
+
"_animation": "__animation_176xh_gg_",
|
|
35
|
+
"_theme_custom": "_theme_custom_176xh_gg_"
|
|
36
36
|
});
|
|
37
37
|
function isCustomTheme(theme) {
|
|
38
|
+
if (!theme) return false;
|
|
38
39
|
return !['dark', 'invert'].includes(theme);
|
|
39
40
|
}
|
|
40
41
|
var ProgressBarRoot = /*#__PURE__*/function (_Component) {
|
|
@@ -63,7 +64,7 @@ var ProgressBarRoot = /*#__PURE__*/function (_Component) {
|
|
|
63
64
|
value: function render() {
|
|
64
65
|
var _ref = this.asProps,
|
|
65
66
|
_ref3;
|
|
66
|
-
var SProgressBar =
|
|
67
|
+
var SProgressBar = _baseComponents.Box;
|
|
67
68
|
var _this$asProps2 = this.asProps,
|
|
68
69
|
Children = _this$asProps2.Children,
|
|
69
70
|
styles = _this$asProps2.styles,
|
|
@@ -97,7 +98,7 @@ var ProgressBarRoot = /*#__PURE__*/function (_Component) {
|
|
|
97
98
|
function Value(props) {
|
|
98
99
|
var _ref2 = arguments[0],
|
|
99
100
|
_ref4;
|
|
100
|
-
var SValue =
|
|
101
|
+
var SValue = _baseComponents.Box;
|
|
101
102
|
var styles = props.styles,
|
|
102
103
|
value = props.value,
|
|
103
104
|
theme = props.theme,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","names":["_core","require","
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","names":["_core","require","_baseComponents","_resolveColorEnhance","_interopRequireDefault","_react","style","sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","_Component","_classCallCheck2","_callSuper2","arguments","_inherits2","_createClass2","key","value","getValueProps","_this$asProps","asProps","duration","size","resolveColor","render","_ref","_ref3","SProgressBar","Box","_this$asProps2","Children","styles","useTheme","createElement","cn","_objectSpread2","assignProps","concat","Component","_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}) as NSProgressBar.Component;\n\nexport default ProgressBar;\n"],"mappings":";;;;;;;;;;;;;AAEA,IAAAA,KAAA,GAAAC,OAAA;AAFA,IAAAC,eAAA,GAAAD,OAAA;AAGA,IAAAE,oBAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,MAAA,GAAAD,sBAAA,CAAAH,OAAA;AAA0B;AAAA,IAAAK,KAAA,8BAAAN,KAAA,CAAAO,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAK1B,SAASC,aAAaA,CAACC,KAAc,EAAE;EACrC,IAAI,CAACA,KAAK,EAAE,OAAO,KAAK;EAExB,OAAO,CAAC,CAAC,MAAM,EAAE,QAAQ,CAAC,CAACC,QAAQ,CAACD,KAAK,CAAC;AAC5C;AAAC,IAEKE,eAAe,0BAAAC,UAAA;EAAA,SAAAD,gBAAA;IAAA,IAAAE,gBAAA,mBAAAF,eAAA;IAAA,WAAAG,WAAA,mBAAAH,eAAA,EAAAI,SAAA;EAAA;EAAA,IAAAC,UAAA,aAAAL,eAAA,EAAAC,UAAA;EAAA,WAAAK,aAAA,aAAAN,eAAA;IAAAO,GAAA;IAAAC,KAAA,EAcnB,SAAAC,aAAaA,CAAA,EAAG;MACd,IAAAC,aAAA,GAAgD,IAAI,CAACC,OAAO;QAApDH,KAAK,GAAAE,aAAA,CAALF,KAAK;QAAEI,QAAQ,GAAAF,aAAA,CAARE,QAAQ;QAAEC,IAAI,GAAAH,aAAA,CAAJG,IAAI;QAAEC,YAAY,GAAAJ,aAAA,CAAZI,YAAY;MAC3C,OAAO;QACLN,KAAK,EAALA,KAAK;QACLI,QAAQ,EAARA,QAAQ;QACRC,IAAI,EAAJA,IAAI;QACJC,YAAY,EAAZA;MACF,CAAC;IACH;EAAC;IAAAP,GAAA;IAAAC,KAAA,EAED,SAAAO,MAAMA,CAAA,EAAG;MAAA,IAAAC,IAAA,QAAAL,OAAA;QAAAM,KAAA;MACP,IAAMC,YAAY,GAMNC,mBAAG;MALf,IAAAC,cAAA,GAAmE,IAAI,CAACT,OAAO;QAAvEU,QAAQ,GAAAD,cAAA,CAARC,QAAQ;QAAEC,MAAM,GAAAF,cAAA,CAANE,MAAM;QAAEV,QAAQ,GAAAQ,cAAA,CAARR,QAAQ;QAAEd,KAAK,GAAAsB,cAAA,CAALtB,KAAK;QAAEU,KAAK,GAAAY,cAAA,CAALZ,KAAK;QAAEM,YAAY,GAAAM,cAAA,CAAZN,YAAY;MAC9D,IAAMS,QAAQ,GAAG1B,aAAa,CAACC,KAAK,CAAC,GAAG,QAAQ,GAAGA,KAAK;MAExD,OAAAmB,KAAA,GAAO,IAAAtB,aAAO,EAAC2B,MAAM,CAAC,eACpB7B,MAAA,YAAA+B,aAAA,CAACN,YAAY,EAAAD,KAAA,CAAAQ,EAAA,qBAAAC,cAAA,qBAAAtC,KAAA,CAAAuC,WAAA;QAAA,aAEAJ,QAAQ;QAAA,iBACJ,CAACf,KAAK;QAAA,mBAAAoB,MAAA,CACJhB,QAAQ;QAAA,WAChBE,YAAY,CAAChB,KAAK,CAAC;QAAA,QACvB,aAAa;QAAA,iBACHU;MAAK,GAAAQ,IAAA,kBAEpBvB,MAAA,YAAA+B,aAAA,CAACH,QAAQ,EAAAJ,KAAA,CAAAQ,EAAA,gBAAE,CACC,CAAC;IAEnB;EAAC;AAAA,EA1C2BI,eAAS;AAAA,IAAAC,gBAAA,aAAjC9B,eAAe,iBAIE,aAAa;AAAA,IAAA8B,gBAAA,aAJ9B9B,eAAe,WAKJN,KAAK;AAAA,IAAAoC,gBAAA,aALhB9B,eAAe,aAMF,CAAC,IAAA+B,+BAAmB,EAAC,CAAC,CAAC;AAAA,IAAAD,gBAAA,aANpC9B,eAAe,kBAOG;EAAA,OAAO;IAC3BY,QAAQ,EAAE,IAAI;IACdC,IAAI,EAAE,GAAG;IACTf,KAAK,EAAE,QAAQ;IACfkC,QAAQ,eAAEvC,MAAA,YAAA+B,aAAA,CAACS,WAAW,CAACC,KAAK,MAAE;EAChC,CAAC;AAAA,CAAC;AAiCJ,SAASA,KAAKA,CACZC,KAIC,EACD;EAAA,IAAAC,KAAA,GAAAC,YAAA;IAAAC,KAAA;EACA,IAAMC,MAAM,GAMApB,mBAAG;EALf,IAAQG,MAAM,GAA2Ca,KAAK,CAAtDb,MAAM;IAAEd,KAAK,GAAoC2B,KAAK,CAA9C3B,KAAK;IAAEV,KAAK,GAA6BqC,KAAK,CAAvCrC,KAAK;IAAEc,QAAQ,GAAmBuB,KAAK,CAAhCvB,QAAQ;IAAEE,YAAY,GAAKqB,KAAK,CAAtBrB,YAAY;EACpD,IAAM0B,KAAK,MAAAZ,MAAA,CAAMpB,KAAK,MAAG;EAEzB,OAAA8B,KAAA,GAAO,IAAA3C,aAAO,EAAC2B,MAAM,CAAC,eACpB7B,MAAA,YAAA+B,aAAA,CAACe,MAAM,EAAAD,KAAA,CAAAb,EAAA,eAAAC,cAAA,qBAAAtC,KAAA,CAAAuC,WAAA;IAAA,aAEMa,KAAK;IAAA,mBAAAZ,MAAA,CACChB,QAAQ;IAAA,WAChBE,YAAY,CAAChB,KAAK;EAAC,GAAAsC,KAAA,GAC7B,CAAC;AAEN;AAEA,IAAMH,WAAW,GAAG,IAAAQ,qBAAe,EAACzC,eAAe,EAAE;EACnDkC,KAAK,EAALA;AACF,CAAC,CAA4B;AAAC,IAAAQ,QAAA,GAAAC,OAAA,cAEfV,WAAW","ignoreList":[]}
|
|
@@ -0,0 +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":[]}
|
package/lib/cjs/index.js
CHANGED
|
@@ -4,6 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
+
var _exportNames = {};
|
|
7
8
|
Object.defineProperty(exports, "default", {
|
|
8
9
|
enumerable: true,
|
|
9
10
|
get: function get() {
|
|
@@ -11,4 +12,16 @@ Object.defineProperty(exports, "default", {
|
|
|
11
12
|
}
|
|
12
13
|
});
|
|
13
14
|
var _ProgressBar = _interopRequireDefault(require("./ProgressBar"));
|
|
15
|
+
var _ProgressBar2 = require("./ProgressBar.type");
|
|
16
|
+
Object.keys(_ProgressBar2).forEach(function (key) {
|
|
17
|
+
if (key === "default" || key === "__esModule") return;
|
|
18
|
+
if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
|
|
19
|
+
if (key in exports && exports[key] === _ProgressBar2[key]) return;
|
|
20
|
+
Object.defineProperty(exports, key, {
|
|
21
|
+
enumerable: true,
|
|
22
|
+
get: function get() {
|
|
23
|
+
return _ProgressBar2[key];
|
|
24
|
+
}
|
|
25
|
+
});
|
|
26
|
+
});
|
|
14
27
|
//# sourceMappingURL=index.js.map
|
package/lib/cjs/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["_ProgressBar","_interopRequireDefault","require"],"sources":["../../src/index.
|
|
1
|
+
{"version":3,"file":"index.js","names":["_ProgressBar","_interopRequireDefault","require","_ProgressBar2","Object","keys","forEach","key","prototype","hasOwnProperty","call","_exportNames","exports","defineProperty","enumerable","get"],"sources":["../../src/index.ts"],"sourcesContent":["export { default } from './ProgressBar';\nexport * from './ProgressBar.type';\n"],"mappings":";;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAAAE,MAAA,CAAAC,IAAA,CAAAF,aAAA,EAAAG,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAC,YAAA,EAAAJ,GAAA;EAAA,IAAAA,GAAA,IAAAK,OAAA,IAAAA,OAAA,CAAAL,GAAA,MAAAJ,aAAA,CAAAI,GAAA;EAAAH,MAAA,CAAAS,cAAA,CAAAD,OAAA,EAAAL,GAAA;IAAAO,UAAA;IAAAC,GAAA,WAAAA,IAAA;MAAA,OAAAZ,aAAA,CAAAI,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
|
package/lib/es6/ProgressBar.js
CHANGED
|
@@ -7,30 +7,31 @@ import _defineProperty from "@babel/runtime/helpers/defineProperty";
|
|
|
7
7
|
import { sstyled as _sstyled } from "@semcore/core";
|
|
8
8
|
import { assignProps as _assignProps2 } from "@semcore/core";
|
|
9
9
|
import { assignProps as _assignProps } from "@semcore/core";
|
|
10
|
+
import { Box } from '@semcore/base-components';
|
|
10
11
|
import { createComponent, Component, sstyled, Root } from '@semcore/core';
|
|
11
12
|
import resolveColorEnhance from '@semcore/core/lib/utils/enhances/resolveColorEnhance';
|
|
12
|
-
import { Box } from '@semcore/flex-box';
|
|
13
13
|
import React from 'react';
|
|
14
14
|
/*!__reshadow-styles__:"./style/progress-bar.shadow.css"*/
|
|
15
|
-
var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/"@keyframes
|
|
15
|
+
var style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/"@keyframes loading_176xh{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_176xh_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_._theme_dark_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg-invert, rgb(84, 86, 84))}.___SValue_176xh_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%));overflow:hidden;animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_176xh);animation-duration:var(--duration_176xh);transition-duration:var(--duration_176xh)}@supports (color:color(display-p3 0 0 0%)){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%))}@media (color-gamut:p3){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, color(display-p3 0.72564 0.56096 0.98326) 0%, color(display-p3 0.72564 0.56096 0.98326) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, color(display-p3 0.72564 0.56096 0.98326) 0%))}}}.___SValue_176xh_gg_.__theme_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}.___SProgressBar_176xh_gg_._size_s_176xh_gg_,.___SValue_176xh_gg_._size_s_176xh_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:8px 8px}.___SProgressBar_176xh_gg_._size_m_176xh_gg_,.___SValue_176xh_gg_._size_m_176xh_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:12px 12px}.___SProgressBar_176xh_gg_._size_l_176xh_gg_,.___SValue_176xh_gg_._size_l_176xh_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:16px 16px}.___SProgressBar_176xh_gg_._theme_invert_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_.__animation_176xh_gg_{background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-pattern-gradient, linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, rgb(241, 242, 242) 0%, rgb(241, 242, 242) 50%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 75%, rgb(241, 242, 242) 0%));animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_176xh)}.___SProgressBar_176xh_gg_._theme_custom_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}@media (prefers-reduced-motion){.___SProgressBar_176xh_gg_.__animation_176xh_gg_,.___SValue_176xh_gg_{animation-name:none}}", /*__inner_css_end__*/"176xh_gg_"),
|
|
16
16
|
/*__reshadow_css_end__*/
|
|
17
17
|
{
|
|
18
|
-
"__SProgressBar": "
|
|
19
|
-
"_theme_dark": "
|
|
20
|
-
"__SValue": "
|
|
21
|
-
"--width": "--
|
|
22
|
-
"--duration": "--
|
|
23
|
-
"_theme": "
|
|
24
|
-
"--colorBg": "--
|
|
25
|
-
"_size_s": "
|
|
26
|
-
"_size_m": "
|
|
27
|
-
"_size_l": "
|
|
28
|
-
"_theme_invert": "
|
|
29
|
-
"@loading": "
|
|
30
|
-
"_animation": "
|
|
31
|
-
"_theme_custom": "
|
|
18
|
+
"__SProgressBar": "___SProgressBar_176xh_gg_",
|
|
19
|
+
"_theme_dark": "_theme_dark_176xh_gg_",
|
|
20
|
+
"__SValue": "___SValue_176xh_gg_",
|
|
21
|
+
"--width": "--width_176xh",
|
|
22
|
+
"--duration": "--duration_176xh",
|
|
23
|
+
"_theme": "__theme_176xh_gg_",
|
|
24
|
+
"--colorBg": "--colorBg_176xh",
|
|
25
|
+
"_size_s": "_size_s_176xh_gg_",
|
|
26
|
+
"_size_m": "_size_m_176xh_gg_",
|
|
27
|
+
"_size_l": "_size_l_176xh_gg_",
|
|
28
|
+
"_theme_invert": "_theme_invert_176xh_gg_",
|
|
29
|
+
"@loading": "loading_176xh",
|
|
30
|
+
"_animation": "__animation_176xh_gg_",
|
|
31
|
+
"_theme_custom": "_theme_custom_176xh_gg_"
|
|
32
32
|
});
|
|
33
33
|
function isCustomTheme(theme) {
|
|
34
|
+
if (!theme) return false;
|
|
34
35
|
return !['dark', 'invert'].includes(theme);
|
|
35
36
|
}
|
|
36
37
|
var ProgressBarRoot = /*#__PURE__*/function (_Component) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ProgressBar.js","names":["createComponent","Component","sstyled","Root","resolveColorEnhance","
|
|
1
|
+
{"version":3,"file":"ProgressBar.js","names":["Box","createComponent","Component","sstyled","Root","resolveColorEnhance","React","style","_sstyled","insert","isCustomTheme","theme","includes","ProgressBarRoot","_Component","_classCallCheck","_callSuper","arguments","_inherits","_createClass","key","value","getValueProps","_this$asProps","asProps","duration","size","resolveColor","render","_ref","_ref3","SProgressBar","_this$asProps2","Children","styles","useTheme","createElement","cn","_objectSpread","_assignProps","concat","_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}) as NSProgressBar.Component;\n\nexport default ProgressBar;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +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":[]}
|
package/lib/es6/index.js
CHANGED
package/lib/es6/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.
|
|
1
|
+
{"version":3,"file":"index.js","names":["default"],"sources":["../../src/index.ts"],"sourcesContent":["export { default } from './ProgressBar';\nexport * from './ProgressBar.type';\n"],"mappings":"AAAA,SAASA,OAAO,QAAQ,eAAe;AACvC,cAAc,oBAAoB","ignoreList":[]}
|
package/lib/esm/ProgressBar.mjs
CHANGED
|
@@ -4,37 +4,38 @@ import _createClass from "@babel/runtime/helpers/esm/createClass";
|
|
|
4
4
|
import _callSuper from "@babel/runtime/helpers/esm/callSuper";
|
|
5
5
|
import _inherits from "@babel/runtime/helpers/esm/inherits";
|
|
6
6
|
import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
|
|
7
|
-
import {
|
|
7
|
+
import { sstyled, assignProps, Component, createComponent } from "@semcore/core";
|
|
8
|
+
import { Box } from "@semcore/base-components";
|
|
8
9
|
import resolveColorEnhance from "@semcore/core/lib/utils/enhances/resolveColorEnhance";
|
|
9
|
-
import { Box } from "@semcore/flex-box";
|
|
10
10
|
import React from "react";
|
|
11
11
|
/*!__reshadow-styles__:"./style/progress-bar.shadow.css"*/
|
|
12
12
|
var style = (
|
|
13
13
|
/*__reshadow_css_start__*/
|
|
14
14
|
(sstyled.insert(
|
|
15
15
|
/*__inner_css_start__*/
|
|
16
|
-
"@keyframes
|
|
16
|
+
"@keyframes loading_176xh{0%{background-position:0 0}to{background-position:60px 0}}.___SProgressBar_176xh_gg_{position:relative;width:100%;overflow:hidden;background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_._theme_dark_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg-invert, rgb(84, 86, 84))}.___SValue_176xh_gg_{position:absolute;top:0;left:0;background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%));overflow:hidden;animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;transition-property:width;transition-timing-function:linear;width:var(--width_176xh);animation-duration:var(--duration_176xh);transition-duration:var(--duration_176xh)}@supports (color:color(display-p3 0 0 0%)){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, rgb(192, 142, 255) 0%, rgb(192, 142, 255) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, rgb(192, 142, 255) 0%))}@media (color-gamut:p3){.___SValue_176xh_gg_{background-image:var(--intergalactic-progress-bar-value-gradient, linear-gradient(-45deg, rgb(177, 125, 241) 25%, color(display-p3 0.72564 0.56096 0.98326) 0%, color(display-p3 0.72564 0.56096 0.98326) 50%, rgb(177, 125, 241) 0%, rgb(177, 125, 241) 75%, color(display-p3 0.72564 0.56096 0.98326) 0%))}}}.___SValue_176xh_gg_.__theme_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}.___SProgressBar_176xh_gg_._size_s_176xh_gg_,.___SValue_176xh_gg_._size_s_176xh_gg_{height:4px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:8px 8px}.___SProgressBar_176xh_gg_._size_m_176xh_gg_,.___SValue_176xh_gg_._size_m_176xh_gg_{height:8px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:12px 12px}.___SProgressBar_176xh_gg_._size_l_176xh_gg_,.___SValue_176xh_gg_._size_l_176xh_gg_{height:12px;border-radius:var(--intergalactic-progress-bar-rounded, 6px);background-size:16px 16px}.___SProgressBar_176xh_gg_._theme_invert_176xh_gg_{background-color:var(--intergalactic-progress-bar-bg, rgb(241, 242, 242))}.___SProgressBar_176xh_gg_.__animation_176xh_gg_{background-color:var(--intergalactic-progress-bar-value-bg, rgb(255, 255, 255));background-image:var(--intergalactic-progress-bar-pattern-gradient, linear-gradient(-45deg, rgba(0, 0, 0, 0.1) 25%, rgb(241, 242, 242) 0%, rgb(241, 242, 242) 50%, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 75%, rgb(241, 242, 242) 0%));animation-name:loading_176xh;animation-timing-function:linear;animation-iteration-count:infinite;animation-duration:var(--duration_176xh)}.___SProgressBar_176xh_gg_._theme_custom_176xh_gg_{background-color:var(--colorBg_176xh);background-image:var(--colorBg_176xh)}@media (prefers-reduced-motion){.___SProgressBar_176xh_gg_.__animation_176xh_gg_,.___SValue_176xh_gg_{animation-name:none}}",
|
|
17
17
|
/*__inner_css_end__*/
|
|
18
|
-
"
|
|
18
|
+
"176xh_gg_"
|
|
19
19
|
), /*__reshadow_css_end__*/
|
|
20
20
|
{
|
|
21
|
-
"__SProgressBar": "
|
|
22
|
-
"_theme_dark": "
|
|
23
|
-
"__SValue": "
|
|
24
|
-
"--width": "--
|
|
25
|
-
"--duration": "--
|
|
26
|
-
"_theme": "
|
|
27
|
-
"--colorBg": "--
|
|
28
|
-
"_size_s": "
|
|
29
|
-
"_size_m": "
|
|
30
|
-
"_size_l": "
|
|
31
|
-
"_theme_invert": "
|
|
32
|
-
"@loading": "
|
|
33
|
-
"_animation": "
|
|
34
|
-
"_theme_custom": "
|
|
21
|
+
"__SProgressBar": "___SProgressBar_176xh_gg_",
|
|
22
|
+
"_theme_dark": "_theme_dark_176xh_gg_",
|
|
23
|
+
"__SValue": "___SValue_176xh_gg_",
|
|
24
|
+
"--width": "--width_176xh",
|
|
25
|
+
"--duration": "--duration_176xh",
|
|
26
|
+
"_theme": "__theme_176xh_gg_",
|
|
27
|
+
"--colorBg": "--colorBg_176xh",
|
|
28
|
+
"_size_s": "_size_s_176xh_gg_",
|
|
29
|
+
"_size_m": "_size_m_176xh_gg_",
|
|
30
|
+
"_size_l": "_size_l_176xh_gg_",
|
|
31
|
+
"_theme_invert": "_theme_invert_176xh_gg_",
|
|
32
|
+
"@loading": "loading_176xh",
|
|
33
|
+
"_animation": "__animation_176xh_gg_",
|
|
34
|
+
"_theme_custom": "_theme_custom_176xh_gg_"
|
|
35
35
|
})
|
|
36
36
|
);
|
|
37
37
|
function isCustomTheme(theme) {
|
|
38
|
+
if (!theme) return false;
|
|
38
39
|
return !["dark", "invert"].includes(theme);
|
|
39
40
|
}
|
|
40
41
|
var ProgressBarRoot = /* @__PURE__ */ (function(_Component) {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
|
package/lib/esm/index.mjs
CHANGED
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import type { BoxProps } from '@semcore/base-components';
|
|
2
|
+
import type { PropGetterFn, Intergalactic } from '@semcore/core';
|
|
3
|
+
declare namespace NSProgressBar {
|
|
4
|
+
type Props = BoxProps & {
|
|
5
|
+
/**
|
|
6
|
+
* Progress bar theme
|
|
7
|
+
* @default invert
|
|
8
|
+
*/
|
|
9
|
+
theme?: 'dark' | 'invert' | string;
|
|
10
|
+
/**
|
|
11
|
+
* Progress bar size
|
|
12
|
+
* @default m
|
|
13
|
+
*/
|
|
14
|
+
size?: 's' | 'm' | 'l';
|
|
15
|
+
/** Value as a percentage */
|
|
16
|
+
value?: number;
|
|
17
|
+
/** Duration of animation, ms
|
|
18
|
+
* @default 1000
|
|
19
|
+
*/
|
|
20
|
+
duration?: number;
|
|
21
|
+
};
|
|
22
|
+
type Ctx = {
|
|
23
|
+
getValueProps: PropGetterFn;
|
|
24
|
+
};
|
|
25
|
+
namespace Value {
|
|
26
|
+
type Props = BoxProps & {
|
|
27
|
+
/** Controls the size of the value bar */
|
|
28
|
+
size?: 's' | 'm' | 'l';
|
|
29
|
+
/** Progress value */
|
|
30
|
+
value?: number;
|
|
31
|
+
/** Animation diration in milliseconds for transitions */
|
|
32
|
+
duration?: number;
|
|
33
|
+
/** Color theme */
|
|
34
|
+
theme?: string;
|
|
35
|
+
};
|
|
36
|
+
type Component = Intergalactic.Component<'div', Props>;
|
|
37
|
+
}
|
|
38
|
+
type Component = Intergalactic.Component<'div', Props, Ctx> & {
|
|
39
|
+
Value: Value.Component;
|
|
40
|
+
};
|
|
41
|
+
}
|
|
42
|
+
/** @deprecated It will be removed in v18. */
|
|
43
|
+
export type ProgressBarProps = NSProgressBar.Props;
|
|
44
|
+
/** @deprecated It will be removed in v18. */
|
|
45
|
+
export type ValueProps = NSProgressBar.Value.Props;
|
|
46
|
+
/** @deprecated It will be removed in v18. */
|
|
47
|
+
export type ProgressBarCxt = NSProgressBar.Ctx;
|
|
48
|
+
export type { NSProgressBar };
|
package/lib/types/index.d.ts
CHANGED
|
@@ -1,48 +1,2 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
/** @deprecated */
|
|
5
|
-
export interface IProgressBarProps extends ProgressBarProps, UnknownProperties {}
|
|
6
|
-
export type ProgressBarProps = BoxProps & {
|
|
7
|
-
/**
|
|
8
|
-
* Progress bar theme
|
|
9
|
-
* @default invert
|
|
10
|
-
*/
|
|
11
|
-
theme?: 'dark' | 'invert' | string;
|
|
12
|
-
/**
|
|
13
|
-
* Progress bar size
|
|
14
|
-
* @default m
|
|
15
|
-
*/
|
|
16
|
-
size?: 's' | 'm' | 'l';
|
|
17
|
-
/** Value as a percentage */
|
|
18
|
-
value?: number;
|
|
19
|
-
/** Duration of animation, ms
|
|
20
|
-
* @default 1000
|
|
21
|
-
*/
|
|
22
|
-
duration?: number;
|
|
23
|
-
};
|
|
24
|
-
|
|
25
|
-
/** @deprecated */
|
|
26
|
-
export interface IValueProps extends ValueProps, UnknownProperties {}
|
|
27
|
-
export type ValueProps = BoxProps & {
|
|
28
|
-
/** Controls the size of the value bar */
|
|
29
|
-
size?: 's' | 'm' | 'l';
|
|
30
|
-
/** Progress value */
|
|
31
|
-
value?: number;
|
|
32
|
-
/** Animation diration in milliseconds for transitions */
|
|
33
|
-
duration?: number;
|
|
34
|
-
/** Color theme */
|
|
35
|
-
theme?: string;
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
/** @deprecated */
|
|
39
|
-
export interface IProgressBarCxt extends ProgressBarCxt, UnknownProperties {}
|
|
40
|
-
export type ProgressBarCxt = {
|
|
41
|
-
getValueProps: PropGetterFn;
|
|
42
|
-
};
|
|
43
|
-
|
|
44
|
-
declare const ProgressBar: Intergalactic.Component<'div', ProgressBarProps, ProgressBarCxt> & {
|
|
45
|
-
Value: Intergalactic.Component<'div', ValueProps>;
|
|
46
|
-
};
|
|
47
|
-
|
|
48
|
-
export default ProgressBar;
|
|
1
|
+
export { default } from './ProgressBar';
|
|
2
|
+
export * from './ProgressBar.type';
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/progress-bar",
|
|
3
3
|
"description": "Semrush ProgressBar Component",
|
|
4
|
-
"version": "16.1.0
|
|
4
|
+
"version": "16.1.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,10 +14,10 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/flex-box": "16.1.0
|
|
17
|
+
"@semcore/flex-box": "16.1.0"
|
|
18
18
|
},
|
|
19
19
|
"peerDependencies": {
|
|
20
|
-
"@semcore/base-components": "^16.6.0
|
|
20
|
+
"@semcore/base-components": "^16.6.0"
|
|
21
21
|
},
|
|
22
22
|
"repository": {
|
|
23
23
|
"type": "git",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"directory": "semcore/progress-bar"
|
|
26
26
|
},
|
|
27
27
|
"devDependencies": {
|
|
28
|
-
"@semcore/core": "16.6.0
|
|
28
|
+
"@semcore/core": "16.6.0",
|
|
29
29
|
"@semcore/testing-utils": "1.0.0"
|
|
30
30
|
},
|
|
31
31
|
"scripts": {
|
package/lib/cjs/index.d.js
DELETED
package/lib/cjs/index.d.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport type { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface IProgressBarProps extends ProgressBarProps, UnknownProperties {}\nexport type ProgressBarProps = 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/** @deprecated */\nexport interface IValueProps extends ValueProps, UnknownProperties {}\nexport type ValueProps = 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/** @deprecated */\nexport interface IProgressBarCxt extends ProgressBarCxt, UnknownProperties {}\nexport type ProgressBarCxt = {\n getValueProps: PropGetterFn;\n};\n\ndeclare const ProgressBar: Intergalactic.Component<'div', ProgressBarProps, ProgressBarCxt> & {\n Value: Intergalactic.Component<'div', ValueProps>;\n};\n\nexport default ProgressBar;\n"],"mappings":"","ignoreList":[]}
|
package/lib/es6/index.d.js
DELETED
package/lib/es6/index.d.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import type { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport type { BoxProps } from '@semcore/flex-box';\n\n/** @deprecated */\nexport interface IProgressBarProps extends ProgressBarProps, UnknownProperties {}\nexport type ProgressBarProps = 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/** @deprecated */\nexport interface IValueProps extends ValueProps, UnknownProperties {}\nexport type ValueProps = 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/** @deprecated */\nexport interface IProgressBarCxt extends ProgressBarCxt, UnknownProperties {}\nexport type ProgressBarCxt = {\n getValueProps: PropGetterFn;\n};\n\ndeclare const ProgressBar: Intergalactic.Component<'div', ProgressBarProps, ProgressBarCxt> & {\n Value: Intergalactic.Component<'div', ValueProps>;\n};\n\nexport default ProgressBar;\n"],"mappings":"","ignoreList":[]}
|