@tamagui/progress 1.0.1-beta.73 → 1.0.1-beta.76
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/dist/esm/Progress.js +54 -19
- package/dist/esm/Progress.js.map +1 -1
- package/package.json +6 -6
package/dist/esm/Progress.js
CHANGED
|
@@ -1,3 +1,34 @@
|
|
|
1
|
+
var __defProp = Object.defineProperty;
|
|
2
|
+
var __defProps = Object.defineProperties;
|
|
3
|
+
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
|
4
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
5
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
7
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
8
|
+
var __spreadValues = (a, b) => {
|
|
9
|
+
for (var prop in b || (b = {}))
|
|
10
|
+
if (__hasOwnProp.call(b, prop))
|
|
11
|
+
__defNormalProp(a, prop, b[prop]);
|
|
12
|
+
if (__getOwnPropSymbols)
|
|
13
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
14
|
+
if (__propIsEnum.call(b, prop))
|
|
15
|
+
__defNormalProp(a, prop, b[prop]);
|
|
16
|
+
}
|
|
17
|
+
return a;
|
|
18
|
+
};
|
|
19
|
+
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
|
20
|
+
var __objRest = (source, exclude) => {
|
|
21
|
+
var target = {};
|
|
22
|
+
for (var prop in source)
|
|
23
|
+
if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
|
|
24
|
+
target[prop] = source[prop];
|
|
25
|
+
if (source != null && __getOwnPropSymbols)
|
|
26
|
+
for (var prop of __getOwnPropSymbols(source)) {
|
|
27
|
+
if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
|
|
28
|
+
target[prop] = source[prop];
|
|
29
|
+
}
|
|
30
|
+
return target;
|
|
31
|
+
};
|
|
1
32
|
import { getSize, getVariableValue, styled, withStaticProperties } from "@tamagui/core";
|
|
2
33
|
import { createContextScope } from "@tamagui/create-context";
|
|
3
34
|
import { ThemeableStack } from "@tamagui/stacks";
|
|
@@ -13,20 +44,19 @@ const ProgressIndicatorFrame = styled(ThemeableStack, {
|
|
|
13
44
|
backgrounded: true
|
|
14
45
|
});
|
|
15
46
|
const ProgressIndicator = ProgressIndicatorFrame.extractable(React.forwardRef((props, forwardedRef) => {
|
|
16
|
-
|
|
17
|
-
const { __scopeProgress, ...indicatorProps } = props;
|
|
47
|
+
const _a = props, { __scopeProgress } = _a, indicatorProps = __objRest(_a, ["__scopeProgress"]);
|
|
18
48
|
const context = useProgressContext(INDICATOR_NAME, __scopeProgress);
|
|
19
|
-
const pct = context.max - (
|
|
49
|
+
const pct = context.max - (context.value ?? 0);
|
|
20
50
|
const x = -context.width * (pct / 100);
|
|
21
|
-
return /* @__PURE__ */ React.createElement(ProgressIndicatorFrame, {
|
|
51
|
+
return /* @__PURE__ */ React.createElement(ProgressIndicatorFrame, __spreadProps(__spreadValues({
|
|
22
52
|
"data-state": getProgressState(context.value, context.max),
|
|
23
|
-
"data-value":
|
|
53
|
+
"data-value": context.value ?? void 0,
|
|
24
54
|
"data-max": context.max,
|
|
25
55
|
x,
|
|
26
|
-
width: context.width
|
|
27
|
-
|
|
56
|
+
width: context.width
|
|
57
|
+
}, indicatorProps), {
|
|
28
58
|
ref: forwardedRef
|
|
29
|
-
});
|
|
59
|
+
}));
|
|
30
60
|
}));
|
|
31
61
|
ProgressIndicator.displayName = INDICATOR_NAME;
|
|
32
62
|
function defaultGetValueLabel(value, max) {
|
|
@@ -75,14 +105,19 @@ const ProgressFrame = styled(ThemeableStack, {
|
|
|
75
105
|
}
|
|
76
106
|
});
|
|
77
107
|
const Progress = withStaticProperties(ProgressFrame.extractable(React.forwardRef((props, forwardedRef) => {
|
|
78
|
-
const {
|
|
108
|
+
const _a = props, {
|
|
79
109
|
__scopeProgress,
|
|
80
110
|
value: valueProp,
|
|
81
111
|
max: maxProp,
|
|
82
112
|
getValueLabel = defaultGetValueLabel,
|
|
83
|
-
size = "$4"
|
|
84
|
-
|
|
85
|
-
|
|
113
|
+
size = "$4"
|
|
114
|
+
} = _a, progressProps = __objRest(_a, [
|
|
115
|
+
"__scopeProgress",
|
|
116
|
+
"value",
|
|
117
|
+
"max",
|
|
118
|
+
"getValueLabel",
|
|
119
|
+
"size"
|
|
120
|
+
]);
|
|
86
121
|
const max = isValidMaxNumber(maxProp) ? maxProp : DEFAULT_MAX;
|
|
87
122
|
const value = isValidValueNumber(valueProp, max) ? valueProp : null;
|
|
88
123
|
const valueLabel = isNumber(value) ? getValueLabel(value, max) : void 0;
|
|
@@ -92,7 +127,7 @@ const Progress = withStaticProperties(ProgressFrame.extractable(React.forwardRef
|
|
|
92
127
|
value,
|
|
93
128
|
max,
|
|
94
129
|
width
|
|
95
|
-
}, /* @__PURE__ */ React.createElement(ProgressFrame, {
|
|
130
|
+
}, /* @__PURE__ */ React.createElement(ProgressFrame, __spreadProps(__spreadValues({
|
|
96
131
|
size,
|
|
97
132
|
"aria-valuemax": max,
|
|
98
133
|
"aria-valuemin": 0,
|
|
@@ -100,16 +135,16 @@ const Progress = withStaticProperties(ProgressFrame.extractable(React.forwardRef
|
|
|
100
135
|
"aria-valuetext": valueLabel,
|
|
101
136
|
role: "progressbar",
|
|
102
137
|
"data-state": getProgressState(value, max),
|
|
103
|
-
"data-value": value
|
|
104
|
-
"data-max": max
|
|
105
|
-
|
|
138
|
+
"data-value": value ?? void 0,
|
|
139
|
+
"data-max": max
|
|
140
|
+
}, progressProps), {
|
|
106
141
|
onLayout: (e) => {
|
|
107
|
-
var
|
|
142
|
+
var _a2;
|
|
108
143
|
setWidth(e.nativeEvent.layout.width);
|
|
109
|
-
(
|
|
144
|
+
(_a2 = progressProps.onLayout) == null ? void 0 : _a2.call(progressProps, e);
|
|
110
145
|
},
|
|
111
146
|
ref: forwardedRef
|
|
112
|
-
}));
|
|
147
|
+
})));
|
|
113
148
|
})), {
|
|
114
149
|
Indicator: ProgressIndicator
|
|
115
150
|
});
|
package/dist/esm/Progress.js.map
CHANGED
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Progress.tsx"],
|
|
4
4
|
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport { GetProps, getSize, getVariableValue, styled, withStaticProperties } from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { ThemeableStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nconst PROGRESS_NAME = 'Progress'\n\nconst [createProgressContext, createProgressScope] = createContextScope(PROGRESS_NAME)\ntype ProgressContextValue = { value: number | null; max: number; width: number }\nconst [ProgressProvider, useProgressContext] =\n createProgressContext<ProgressContextValue>(PROGRESS_NAME)\n\n/* -------------------------------------------------------------------------------------------------\n * ProgressIndicator\n * -----------------------------------------------------------------------------------------------*/\n\nconst INDICATOR_NAME = 'ProgressIndicator'\n\ntype ProgressIndicatorElement = TamaguiElement\ninterface ProgressIndicatorProps extends YStackProps {}\n\nexport const ProgressIndicatorFrame = styled(ThemeableStack, {\n name: INDICATOR_NAME,\n height: '100%',\n width: '100%',\n backgrounded: true,\n})\n\nconst ProgressIndicator = ProgressIndicatorFrame.extractable(\n React.forwardRef<ProgressIndicatorElement, ProgressIndicatorProps>(\n (props: ScopedProps<ProgressIndicatorProps>, forwardedRef) => {\n const { __scopeProgress, ...indicatorProps } = props\n const context = useProgressContext(INDICATOR_NAME, __scopeProgress)\n const pct = context.max - (context.value ?? 0)\n const x = -context.width * (pct / 100)\n return (\n <ProgressIndicatorFrame\n data-state={getProgressState(context.value, context.max)}\n data-value={context.value ?? undefined}\n data-max={context.max}\n x={x}\n width={context.width}\n {...indicatorProps}\n ref={forwardedRef}\n />\n )\n }\n )\n)\n\nProgressIndicator.displayName = INDICATOR_NAME\n\n/* ---------------------------------------------------------------------------------------------- */\n\nfunction defaultGetValueLabel(value: number, max: number) {\n return `${Math.round((value / max) * 100)}%`\n}\n\nfunction getProgressState(value: number | undefined | null, maxValue: number): ProgressState {\n return value == null ? 'indeterminate' : value === maxValue ? 'complete' : 'loading'\n}\n\nfunction isNumber(value: any): value is number {\n return typeof value === 'number'\n}\n\nfunction isValidMaxNumber(max: any): max is number {\n // prettier-ignore\n return (\n isNumber(max) &&\n !isNaN(max) &&\n max > 0\n );\n}\n\nfunction isValidValueNumber(value: any, max: number): value is number {\n // prettier-ignore\n return (\n isNumber(value) &&\n !isNaN(value) &&\n value <= max &&\n value >= 0\n );\n}\n\n// Split this out for clearer readability of the error message.\nfunction getInvalidMaxError(propValue: string, componentName: string) {\n return `Invalid prop \\`max\\` of value \\`${propValue}\\` supplied to \\`${componentName}\\`. Only numbers greater than 0 are valid max values. Defaulting to \\`${DEFAULT_MAX}\\`.`\n}\n\nfunction getInvalidValueError(propValue: string, componentName: string) {\n return `Invalid prop \\`value\\` of value \\`${propValue}\\` supplied to \\`${componentName}\\`. The \\`value\\` prop must be:\n - a positive number\n - less than the value passed to \\`max\\` (or ${DEFAULT_MAX} if no \\`max\\` prop is set)\n - \\`null\\` if the progress is indeterminate.\n\nDefaulting to \\`null\\`.`\n}\n\n/* -------------------------------------------------------------------------------------------------\n * Progress\n * -----------------------------------------------------------------------------------------------*/\n\nconst DEFAULT_MAX = 100\n\ntype ScopedProps<P> = P & { __scopeProgress?: Scope }\n\ntype ProgressState = 'indeterminate' | 'complete' | 'loading'\n\ntype TamaguiElement = HTMLElement | View\n\ntype ProgressElement = TamaguiElement\n\nexport const ProgressFrame = styled(ThemeableStack, {\n name: PROGRESS_NAME,\n borderRadius: 100_000,\n overflow: 'hidden',\n backgrounded: true,\n\n variants: {\n size: {\n '...size': (val) => {\n const size = Math.round(getVariableValue(getSize(val)) * 0.25)\n return {\n height: size,\n minWidth: getVariableValue(size) * 20,\n width: '100%',\n }\n },\n },\n },\n})\n\ntype ProgressProps = GetProps<typeof ProgressFrame> & {\n value?: number | null | undefined\n max?: number\n getValueLabel?(value: number, max: number): string\n}\n\nconst Progress = withStaticProperties(\n ProgressFrame.extractable(\n React.forwardRef<ProgressElement, ProgressProps>(\n (props: ScopedProps<ProgressProps>, forwardedRef) => {\n const {\n __scopeProgress,\n value: valueProp,\n max: maxProp,\n getValueLabel = defaultGetValueLabel,\n size = '$4',\n ...progressProps\n } = props\n\n const max = isValidMaxNumber(maxProp) ? maxProp : DEFAULT_MAX\n const value = isValidValueNumber(valueProp, max) ? valueProp : null\n const valueLabel = isNumber(value) ? getValueLabel(value, max) : undefined\n const [width, setWidth] = React.useState(0)\n\n return (\n <ProgressProvider scope={__scopeProgress} value={value} max={max} width={width}>\n <ProgressFrame\n size={size}\n aria-valuemax={max}\n aria-valuemin={0}\n aria-valuenow={isNumber(value) ? value : undefined}\n aria-valuetext={valueLabel}\n // @ts-ignore\n role=\"progressbar\"\n data-state={getProgressState(value, max)}\n data-value={value ?? undefined}\n data-max={max}\n {...progressProps}\n onLayout={(e) => {\n setWidth(e.nativeEvent.layout.width)\n progressProps.onLayout?.(e)\n }}\n ref={forwardedRef}\n />\n </ProgressProvider>\n )\n }\n )\n ),\n {\n Indicator: ProgressIndicator,\n }\n)\n\nProgress.displayName = PROGRESS_NAME\n\nProgress.propTypes = {\n max(props, propName, componentName) {\n const propValue = props[propName]\n const strVal = String(propValue)\n if (propValue && !isValidMaxNumber(propValue)) {\n return new Error(getInvalidMaxError(strVal, componentName))\n }\n return null\n },\n value(props, propName, componentName) {\n const valueProp = props[propName]\n const strVal = String(valueProp)\n const max = isValidMaxNumber(props.max) ? props.max : DEFAULT_MAX\n if (valueProp != null && !isValidValueNumber(valueProp, max)) {\n return new Error(getInvalidValueError(strVal, componentName))\n }\n return null\n },\n}\n\nexport { createProgressScope, Progress, ProgressIndicator }\nexport type { ProgressProps, ProgressIndicatorProps }\n"],
|
|
5
|
-
"mappings": "AAGA;AACA;AACA;AACA;AAGA,MAAM,gBAAgB;AAEtB,MAAM,CAAC,uBAAuB,uBAAuB,mBAAmB,aAAa;AAErF,MAAM,CAAC,kBAAkB,sBACvB,sBAA4C,aAAa;AAM3D,MAAM,iBAAiB;AAKhB,MAAM,yBAAyB,OAAO,gBAAgB;AAAA,EAC3D,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,cAAc;AAChB,CAAC;AAED,MAAM,oBAAoB,uBAAuB,YAC/C,MAAM,WACJ,CAAC,OAA4C,iBAAiB;
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/progress",
|
|
3
|
-
"version": "1.0.1-beta.
|
|
3
|
+
"version": "1.0.1-beta.76",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -21,10 +21,10 @@
|
|
|
21
21
|
"clean:build": "tamagui-build clean:build"
|
|
22
22
|
},
|
|
23
23
|
"dependencies": {
|
|
24
|
-
"@tamagui/compose-refs": "^1.0.1-beta.
|
|
25
|
-
"@tamagui/core": "^1.0.1-beta.
|
|
26
|
-
"@tamagui/create-context": "^1.0.1-beta.
|
|
27
|
-
"@tamagui/stacks": "^1.0.1-beta.
|
|
24
|
+
"@tamagui/compose-refs": "^1.0.1-beta.76",
|
|
25
|
+
"@tamagui/core": "^1.0.1-beta.76",
|
|
26
|
+
"@tamagui/create-context": "^1.0.1-beta.76",
|
|
27
|
+
"@tamagui/stacks": "^1.0.1-beta.76"
|
|
28
28
|
},
|
|
29
29
|
"peerDependencies": {
|
|
30
30
|
"react": "*",
|
|
@@ -32,7 +32,7 @@
|
|
|
32
32
|
"react-native": "*"
|
|
33
33
|
},
|
|
34
34
|
"devDependencies": {
|
|
35
|
-
"@tamagui/build": "^1.0.1-beta.
|
|
35
|
+
"@tamagui/build": "^1.0.1-beta.76",
|
|
36
36
|
"@types/react-native": "^0.67.3",
|
|
37
37
|
"react": "*",
|
|
38
38
|
"react-dom": "*",
|