@tamagui/progress 1.0.3 → 1.0.4
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/cjs/Progress.js +3 -2
- package/dist/cjs/Progress.js.map +2 -2
- package/dist/esm/Progress.js +3 -7
- package/dist/esm/Progress.js.map +2 -2
- package/dist/jsx/Progress.js +3 -7
- package/dist/jsx/Progress.js.map +2 -2
- package/package.json +7 -6
- package/src/Progress.tsx +12 -27
package/dist/cjs/Progress.js
CHANGED
|
@@ -34,6 +34,7 @@ module.exports = __toCommonJS(Progress_exports);
|
|
|
34
34
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
35
35
|
var import_core = require("@tamagui/core");
|
|
36
36
|
var import_create_context = require("@tamagui/create-context");
|
|
37
|
+
var import_get_size = require("@tamagui/get-size");
|
|
37
38
|
var import_stacks = require("@tamagui/stacks");
|
|
38
39
|
var React = __toESM(require("react"));
|
|
39
40
|
const PROGRESS_NAME = "Progress";
|
|
@@ -101,7 +102,7 @@ const ProgressFrame = (0, import_core.styled)(import_stacks.ThemeableStack, {
|
|
|
101
102
|
variants: {
|
|
102
103
|
size: {
|
|
103
104
|
"...size": (val) => {
|
|
104
|
-
const size = Math.round((0, import_core.getVariableValue)((0,
|
|
105
|
+
const size = Math.round((0, import_core.getVariableValue)((0, import_get_size.getSize)(val)) * 0.25);
|
|
105
106
|
return {
|
|
106
107
|
height: size,
|
|
107
108
|
minWidth: (0, import_core.getVariableValue)(size) * 20,
|
|
@@ -120,7 +121,7 @@ const Progress = (0, import_core.withStaticProperties)(
|
|
|
120
121
|
value: valueProp,
|
|
121
122
|
max: maxProp,
|
|
122
123
|
getValueLabel = defaultGetValueLabel,
|
|
123
|
-
size = "$
|
|
124
|
+
size = "$true",
|
|
124
125
|
...progressProps
|
|
125
126
|
} = props;
|
|
126
127
|
const max = isValidMaxNumber(maxProp) ? maxProp : DEFAULT_MAX;
|
package/dist/cjs/Progress.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Progress.tsx"],
|
|
4
|
-
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport { GetProps, getVariableValue, styled, withStaticProperties } from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { getSize } from '@tamagui/get-size'\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(\n value: number | undefined | null,\n maxValue: number\n): 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 return isNumber(max) && !isNaN(max) && max > 0\n}\n\nfunction isValidValueNumber(value: any, max: number): value is number {\n return isNumber(value) && !isNaN(value) && value <= max && value >= 0\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 } as const,\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 = '$true',\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": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/Progress.js
CHANGED
|
@@ -1,11 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
3
|
-
getSize,
|
|
4
|
-
getVariableValue,
|
|
5
|
-
styled,
|
|
6
|
-
withStaticProperties
|
|
7
|
-
} from "@tamagui/core";
|
|
2
|
+
import { getVariableValue, styled, withStaticProperties } from "@tamagui/core";
|
|
8
3
|
import { createContextScope } from "@tamagui/create-context";
|
|
4
|
+
import { getSize } from "@tamagui/get-size";
|
|
9
5
|
import { ThemeableStack } from "@tamagui/stacks";
|
|
10
6
|
import * as React from "react";
|
|
11
7
|
const PROGRESS_NAME = "Progress";
|
|
@@ -92,7 +88,7 @@ const Progress = withStaticProperties(
|
|
|
92
88
|
value: valueProp,
|
|
93
89
|
max: maxProp,
|
|
94
90
|
getValueLabel = defaultGetValueLabel,
|
|
95
|
-
size = "$
|
|
91
|
+
size = "$true",
|
|
96
92
|
...progressProps
|
|
97
93
|
} = props;
|
|
98
94
|
const max = isValidMaxNumber(maxProp) ? maxProp : DEFAULT_MAX;
|
package/dist/esm/Progress.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Progress.tsx"],
|
|
4
|
-
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport {
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport { GetProps, getVariableValue, styled, withStaticProperties } from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { getSize } from '@tamagui/get-size'\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(\n value: number | undefined | null,\n maxValue: number\n): 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 return isNumber(max) && !isNaN(max) && max > 0\n}\n\nfunction isValidValueNumber(value: any, max: number): value is number {\n return isNumber(value) && !isNaN(value) && value <= max && value >= 0\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 } as const,\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 = '$true',\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": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/jsx/Progress.js
CHANGED
|
@@ -1,10 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
getSize,
|
|
3
|
-
getVariableValue,
|
|
4
|
-
styled,
|
|
5
|
-
withStaticProperties
|
|
6
|
-
} from "@tamagui/core";
|
|
1
|
+
import { getVariableValue, styled, withStaticProperties } from "@tamagui/core";
|
|
7
2
|
import { createContextScope } from "@tamagui/create-context";
|
|
3
|
+
import { getSize } from "@tamagui/get-size";
|
|
8
4
|
import { ThemeableStack } from "@tamagui/stacks";
|
|
9
5
|
import * as React from "react";
|
|
10
6
|
const PROGRESS_NAME = "Progress";
|
|
@@ -83,7 +79,7 @@ const Progress = withStaticProperties(
|
|
|
83
79
|
value: valueProp,
|
|
84
80
|
max: maxProp,
|
|
85
81
|
getValueLabel = defaultGetValueLabel,
|
|
86
|
-
size = "$
|
|
82
|
+
size = "$true",
|
|
87
83
|
...progressProps
|
|
88
84
|
} = props;
|
|
89
85
|
const max = isValidMaxNumber(maxProp) ? maxProp : DEFAULT_MAX;
|
package/dist/jsx/Progress.js.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/Progress.tsx"],
|
|
4
|
-
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport {
|
|
5
|
-
"mappings": "AAGA
|
|
4
|
+
"sourcesContent": ["// forked from Radix UI\n// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx\n\nimport { GetProps, getVariableValue, styled, withStaticProperties } from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { getSize } from '@tamagui/get-size'\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(\n value: number | undefined | null,\n maxValue: number\n): 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 return isNumber(max) && !isNaN(max) && max > 0\n}\n\nfunction isValidValueNumber(value: any, max: number): value is number {\n return isNumber(value) && !isNaN(value) && value <= max && value >= 0\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 } as const,\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 = '$true',\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": "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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.
|
|
3
|
+
"version": "1.0.4",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -23,10 +23,11 @@
|
|
|
23
23
|
"clean:build": "tamagui-build clean:build"
|
|
24
24
|
},
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@tamagui/compose-refs": "^1.0.
|
|
27
|
-
"@tamagui/core": "^1.0.
|
|
28
|
-
"@tamagui/create-context": "^1.0.
|
|
29
|
-
"@tamagui/
|
|
26
|
+
"@tamagui/compose-refs": "^1.0.4",
|
|
27
|
+
"@tamagui/core": "^1.0.4",
|
|
28
|
+
"@tamagui/create-context": "^1.0.4",
|
|
29
|
+
"@tamagui/get-size": "^1.0.4",
|
|
30
|
+
"@tamagui/stacks": "^1.0.4"
|
|
30
31
|
},
|
|
31
32
|
"peerDependencies": {
|
|
32
33
|
"react": "*",
|
|
@@ -34,7 +35,7 @@
|
|
|
34
35
|
"react-native": "*"
|
|
35
36
|
},
|
|
36
37
|
"devDependencies": {
|
|
37
|
-
"@tamagui/build": "^1.0.
|
|
38
|
+
"@tamagui/build": "^1.0.4",
|
|
38
39
|
"react": "^18.2.0",
|
|
39
40
|
"react-dom": "^18.2.0",
|
|
40
41
|
"react-native": "*"
|
package/src/Progress.tsx
CHANGED
|
@@ -1,22 +1,16 @@
|
|
|
1
1
|
// forked from Radix UI
|
|
2
2
|
// https://github.com/radix-ui/primitives/blob/main/packages/react/progress/src/Progress.tsx
|
|
3
3
|
|
|
4
|
-
import {
|
|
5
|
-
GetProps,
|
|
6
|
-
getSize,
|
|
7
|
-
getVariableValue,
|
|
8
|
-
styled,
|
|
9
|
-
withStaticProperties,
|
|
10
|
-
} from '@tamagui/core'
|
|
4
|
+
import { GetProps, getVariableValue, styled, withStaticProperties } from '@tamagui/core'
|
|
11
5
|
import { Scope, createContextScope } from '@tamagui/create-context'
|
|
6
|
+
import { getSize } from '@tamagui/get-size'
|
|
12
7
|
import { ThemeableStack, YStackProps } from '@tamagui/stacks'
|
|
13
8
|
import * as React from 'react'
|
|
14
9
|
import { View } from 'react-native'
|
|
15
10
|
|
|
16
11
|
const PROGRESS_NAME = 'Progress'
|
|
17
12
|
|
|
18
|
-
const [createProgressContext, createProgressScope] =
|
|
19
|
-
createContextScope(PROGRESS_NAME)
|
|
13
|
+
const [createProgressContext, createProgressScope] = createContextScope(PROGRESS_NAME)
|
|
20
14
|
type ProgressContextValue = { value: number | null; max: number; width: number }
|
|
21
15
|
const [ProgressProvider, useProgressContext] =
|
|
22
16
|
createProgressContext<ProgressContextValue>(PROGRESS_NAME)
|
|
@@ -55,8 +49,8 @@ const ProgressIndicator = ProgressIndicatorFrame.extractable(
|
|
|
55
49
|
ref={forwardedRef}
|
|
56
50
|
/>
|
|
57
51
|
)
|
|
58
|
-
}
|
|
59
|
-
)
|
|
52
|
+
}
|
|
53
|
+
)
|
|
60
54
|
)
|
|
61
55
|
|
|
62
56
|
ProgressIndicator.displayName = INDICATOR_NAME
|
|
@@ -69,13 +63,9 @@ function defaultGetValueLabel(value: number, max: number) {
|
|
|
69
63
|
|
|
70
64
|
function getProgressState(
|
|
71
65
|
value: number | undefined | null,
|
|
72
|
-
maxValue: number
|
|
66
|
+
maxValue: number
|
|
73
67
|
): ProgressState {
|
|
74
|
-
return value == null
|
|
75
|
-
? 'indeterminate'
|
|
76
|
-
: value === maxValue
|
|
77
|
-
? 'complete'
|
|
78
|
-
: 'loading'
|
|
68
|
+
return value == null ? 'indeterminate' : value === maxValue ? 'complete' : 'loading'
|
|
79
69
|
}
|
|
80
70
|
|
|
81
71
|
function isNumber(value: any): value is number {
|
|
@@ -153,7 +143,7 @@ const Progress = withStaticProperties(
|
|
|
153
143
|
value: valueProp,
|
|
154
144
|
max: maxProp,
|
|
155
145
|
getValueLabel = defaultGetValueLabel,
|
|
156
|
-
size = '$
|
|
146
|
+
size = '$true',
|
|
157
147
|
...progressProps
|
|
158
148
|
} = props
|
|
159
149
|
|
|
@@ -163,12 +153,7 @@ const Progress = withStaticProperties(
|
|
|
163
153
|
const [width, setWidth] = React.useState(0)
|
|
164
154
|
|
|
165
155
|
return (
|
|
166
|
-
<ProgressProvider
|
|
167
|
-
scope={__scopeProgress}
|
|
168
|
-
value={value}
|
|
169
|
-
max={max}
|
|
170
|
-
width={width}
|
|
171
|
-
>
|
|
156
|
+
<ProgressProvider scope={__scopeProgress} value={value} max={max} width={width}>
|
|
172
157
|
<ProgressFrame
|
|
173
158
|
size={size}
|
|
174
159
|
aria-valuemax={max}
|
|
@@ -189,12 +174,12 @@ const Progress = withStaticProperties(
|
|
|
189
174
|
/>
|
|
190
175
|
</ProgressProvider>
|
|
191
176
|
)
|
|
192
|
-
}
|
|
193
|
-
)
|
|
177
|
+
}
|
|
178
|
+
)
|
|
194
179
|
),
|
|
195
180
|
{
|
|
196
181
|
Indicator: ProgressIndicator,
|
|
197
|
-
}
|
|
182
|
+
}
|
|
198
183
|
)
|
|
199
184
|
|
|
200
185
|
Progress.displayName = PROGRESS_NAME
|