@cdx-ui/components 0.3.5 → 0.3.7
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/README.md +1 -1
- package/coverage.svg +1 -1
- package/docs/components/bar-chart/content.md +703 -0
- package/docs/components/content.md +10 -1
- package/docs/components/country-flag/content.md +232 -0
- package/docs/components/data-grid/content.md +3 -1
- package/docs/components/icon/content.md +1 -1
- package/docs/components/input/content.md +1 -0
- package/docs/components/line-chart/content.md +567 -0
- package/docs/components/pie-chart/content.md +493 -0
- package/docs/components/progress-bar/content.md +164 -3
- package/docs/components/progress-segmented/content.md +1 -1
- package/docs/components/select/content.md +1 -0
- package/docs/components/stepper/content.md +599 -0
- package/docs/components/system-alert/content.md +533 -0
- package/docs/foundations/expressions/icons/content.md +2 -1
- package/docs/foundations/styles/tokens/all-tokens/content.md +2 -1
- package/docs/getting-started/developers/content.md +1 -1
- package/docs/llms.txt +12 -0
- package/docs/patterns/content.md +1 -0
- package/docs/patterns/dashboard/content.md +423 -19
- package/docs/patterns/insights/content.md +659 -0
- package/docs/resources/content.md +1 -0
- package/docs/resources/release-notes/0.3.5/content.md +7 -0
- package/docs/resources/release-notes/0.3.6/content.md +29 -0
- package/docs/resources/release-notes/content.md +2 -0
- package/docs/resources/skills/content.md +66 -0
- package/lib/commonjs/components/BarChart/geometry.js +1130 -0
- package/lib/commonjs/components/BarChart/geometry.js.map +1 -0
- package/lib/commonjs/components/BarChart/index.js +935 -0
- package/lib/commonjs/components/BarChart/index.js.map +1 -0
- package/lib/commonjs/components/BarChart/styles.js +26 -0
- package/lib/commonjs/components/BarChart/styles.js.map +1 -0
- package/lib/commonjs/components/Button/index.js +2 -2
- package/lib/commonjs/components/Button/index.js.map +1 -1
- package/lib/commonjs/components/CountryFlag/index.js +56 -0
- package/lib/commonjs/components/CountryFlag/index.js.map +1 -0
- package/lib/commonjs/components/Input/index.js.map +1 -1
- package/lib/commonjs/components/LineChart/geometry.js +698 -0
- package/lib/commonjs/components/LineChart/geometry.js.map +1 -0
- package/lib/commonjs/components/LineChart/index.js +744 -0
- package/lib/commonjs/components/LineChart/index.js.map +1 -0
- package/lib/commonjs/components/LineChart/styles.js +25 -0
- package/lib/commonjs/components/LineChart/styles.js.map +1 -0
- package/lib/commonjs/components/PieChart/geometry.js +216 -0
- package/lib/commonjs/components/PieChart/geometry.js.map +1 -0
- package/lib/commonjs/components/PieChart/index.js +476 -0
- package/lib/commonjs/components/PieChart/index.js.map +1 -0
- package/lib/commonjs/components/PieChart/styles.js +88 -0
- package/lib/commonjs/components/PieChart/styles.js.map +1 -0
- package/lib/commonjs/components/ProgressBar/index.js +44 -12
- package/lib/commonjs/components/ProgressBar/index.js.map +1 -1
- package/lib/commonjs/components/ProgressBar/styles.js +31 -2
- package/lib/commonjs/components/ProgressBar/styles.js.map +1 -1
- package/lib/commonjs/components/ProgressCircle/ProgressCircleRing.js +9 -31
- package/lib/commonjs/components/ProgressCircle/ProgressCircleRing.js.map +1 -1
- package/lib/commonjs/components/ProgressCircle/ProgressRing.js +52 -0
- package/lib/commonjs/components/ProgressCircle/ProgressRing.js.map +1 -0
- package/lib/commonjs/components/ScrollShadow/useScrollShadow.js +8 -7
- package/lib/commonjs/components/ScrollShadow/useScrollShadow.js.map +1 -1
- package/lib/commonjs/components/Select/index.js.map +1 -1
- package/lib/commonjs/components/Stepper/index.js +369 -0
- package/lib/commonjs/components/Stepper/index.js.map +1 -0
- package/lib/commonjs/components/Stepper/styles.js +211 -0
- package/lib/commonjs/components/Stepper/styles.js.map +1 -0
- package/lib/commonjs/components/Stepper/useStepperLabelFit.js +22 -0
- package/lib/commonjs/components/Stepper/useStepperLabelFit.js.map +1 -0
- package/lib/commonjs/components/Stepper/useStepperLabelFit.web.js +52 -0
- package/lib/commonjs/components/Stepper/useStepperLabelFit.web.js.map +1 -0
- package/lib/commonjs/components/Stepper/useStepperRingColors.js +31 -0
- package/lib/commonjs/components/Stepper/useStepperRingColors.js.map +1 -0
- package/lib/commonjs/components/SystemAlert/animation.js +218 -0
- package/lib/commonjs/components/SystemAlert/animation.js.map +1 -0
- package/lib/commonjs/components/SystemAlert/index.js +525 -0
- package/lib/commonjs/components/SystemAlert/index.js.map +1 -0
- package/lib/commonjs/components/SystemAlert/styles.js +178 -0
- package/lib/commonjs/components/SystemAlert/styles.js.map +1 -0
- package/lib/commonjs/components/SystemAlert/useSystemAlertStatusBarStyle.js +53 -0
- package/lib/commonjs/components/SystemAlert/useSystemAlertStatusBarStyle.js.map +1 -0
- package/lib/commonjs/components/Tabs/index.js +4 -0
- package/lib/commonjs/components/Tabs/index.js.map +1 -1
- package/lib/commonjs/components/Tabs/styles.js +1 -1
- package/lib/commonjs/components/Tabs/styles.js.map +1 -1
- package/lib/commonjs/components/chart/ChartInspector.js +610 -0
- package/lib/commonjs/components/chart/ChartInspector.js.map +1 -0
- package/lib/commonjs/components/chart/format.js +93 -0
- package/lib/commonjs/components/chart/format.js.map +1 -0
- package/lib/commonjs/components/chart/hiddenSvgProps.js +23 -0
- package/lib/commonjs/components/chart/hiddenSvgProps.js.map +1 -0
- package/lib/commonjs/components/chart/index.js +2 -0
- package/lib/commonjs/components/chart/index.js.map +1 -0
- package/lib/commonjs/components/chart/motion.js +97 -0
- package/lib/commonjs/components/chart/motion.js.map +1 -0
- package/lib/commonjs/components/chart/palette.js +178 -0
- package/lib/commonjs/components/chart/palette.js.map +1 -0
- package/lib/commonjs/components/chart/size.js +34 -0
- package/lib/commonjs/components/chart/size.js.map +1 -0
- package/lib/commonjs/components/chart/ticks.js +59 -0
- package/lib/commonjs/components/chart/ticks.js.map +1 -0
- package/lib/commonjs/components/chart/types.js +6 -0
- package/lib/commonjs/components/chart/types.js.map +1 -0
- package/lib/commonjs/components/chart/useChartHostWidth.js +27 -0
- package/lib/commonjs/components/chart/useChartHostWidth.js.map +1 -0
- package/lib/commonjs/components/index.js +72 -0
- package/lib/commonjs/components/index.js.map +1 -1
- package/lib/commonjs/figma/Accordion.figma.js +2 -2
- package/lib/commonjs/figma/Accordion.figma.js.map +1 -1
- package/lib/commonjs/figma/Alert.figma.js +7 -7
- package/lib/commonjs/figma/Alert.figma.js.map +1 -1
- package/lib/commonjs/figma/Badge.Indicator.figma.js +6 -5
- package/lib/commonjs/figma/Badge.Indicator.figma.js.map +1 -1
- package/lib/commonjs/figma/Badge.figma.js +22 -22
- package/lib/commonjs/figma/Badge.figma.js.map +1 -1
- package/lib/commonjs/figma/Button.figma.js +5 -2
- package/lib/commonjs/figma/Button.figma.js.map +1 -1
- package/lib/commonjs/figma/CLAUDE.md +1 -0
- package/lib/commonjs/figma/Card.Header.figma.js +8 -4
- package/lib/commonjs/figma/Card.Header.figma.js.map +1 -1
- package/lib/commonjs/figma/Card.figma.js +2 -1
- package/lib/commonjs/figma/Card.figma.js.map +1 -1
- package/lib/commonjs/figma/Chip.figma.js +2 -2
- package/lib/commonjs/figma/Chip.figma.js.map +1 -1
- package/lib/commonjs/figma/CurrencyInput.figma.js +1 -1
- package/lib/commonjs/figma/CurrencyInput.figma.js.map +1 -1
- package/lib/commonjs/figma/Dialog.figma.js +5 -2
- package/lib/commonjs/figma/Dialog.figma.js.map +1 -1
- package/lib/commonjs/figma/Divider.figma.js +1 -1
- package/lib/commonjs/figma/Divider.figma.js.map +1 -1
- package/lib/commonjs/figma/Drawer.figma.js +3 -3
- package/lib/commonjs/figma/Drawer.figma.js.map +1 -1
- package/lib/commonjs/figma/IconButton.figma.js +10 -4
- package/lib/commonjs/figma/IconButton.figma.js.map +1 -1
- package/lib/commonjs/figma/Input.figma.js +2 -1
- package/lib/commonjs/figma/Input.figma.js.map +1 -1
- package/lib/commonjs/figma/Insight.figma.js +3 -3
- package/lib/commonjs/figma/Insight.figma.js.map +1 -1
- package/lib/commonjs/figma/ProgressBar.figma.js +11 -2
- package/lib/commonjs/figma/ProgressBar.figma.js.map +1 -1
- package/lib/commonjs/figma/ProgressSegmented.figma.js +9 -1
- package/lib/commonjs/figma/ProgressSegmented.figma.js.map +1 -1
- package/lib/commonjs/figma/Select.figma.js +2 -1
- package/lib/commonjs/figma/Select.figma.js.map +1 -1
- package/lib/commonjs/figma/SystemAlert.Button.figma.js +28 -0
- package/lib/commonjs/figma/SystemAlert.Button.figma.js.map +1 -0
- package/lib/commonjs/figma/SystemAlert.Close.figma.js +22 -0
- package/lib/commonjs/figma/SystemAlert.Close.figma.js.map +1 -0
- package/lib/commonjs/figma/SystemAlert.Description.figma.js +20 -0
- package/lib/commonjs/figma/SystemAlert.Description.figma.js.map +1 -0
- package/lib/commonjs/figma/SystemAlert.IconButton.figma.js +31 -0
- package/lib/commonjs/figma/SystemAlert.IconButton.figma.js.map +1 -0
- package/lib/commonjs/figma/SystemAlert.figma.js +47 -0
- package/lib/commonjs/figma/SystemAlert.figma.js.map +1 -0
- package/lib/commonjs/styles.css +0 -1
- package/lib/module/components/BarChart/geometry.js +1110 -0
- package/lib/module/components/BarChart/geometry.js.map +1 -0
- package/lib/module/components/BarChart/index.js +929 -0
- package/lib/module/components/BarChart/index.js.map +1 -0
- package/lib/module/components/BarChart/styles.js +22 -0
- package/lib/module/components/BarChart/styles.js.map +1 -0
- package/lib/module/components/Button/index.js +2 -2
- package/lib/module/components/Button/index.js.map +1 -1
- package/lib/module/components/CountryFlag/index.js +52 -0
- package/lib/module/components/CountryFlag/index.js.map +1 -0
- package/lib/module/components/Input/index.js.map +1 -1
- package/lib/module/components/LineChart/geometry.js +685 -0
- package/lib/module/components/LineChart/geometry.js.map +1 -0
- package/lib/module/components/LineChart/index.js +738 -0
- package/lib/module/components/LineChart/index.js.map +1 -0
- package/lib/module/components/LineChart/styles.js +21 -0
- package/lib/module/components/LineChart/styles.js.map +1 -0
- package/lib/module/components/PieChart/geometry.js +209 -0
- package/lib/module/components/PieChart/geometry.js.map +1 -0
- package/lib/module/components/PieChart/index.js +471 -0
- package/lib/module/components/PieChart/index.js.map +1 -0
- package/lib/module/components/PieChart/styles.js +84 -0
- package/lib/module/components/PieChart/styles.js.map +1 -0
- package/lib/module/components/ProgressBar/index.js +47 -15
- package/lib/module/components/ProgressBar/index.js.map +1 -1
- package/lib/module/components/ProgressBar/styles.js +31 -2
- package/lib/module/components/ProgressBar/styles.js.map +1 -1
- package/lib/module/components/ProgressCircle/ProgressCircleRing.js +10 -32
- package/lib/module/components/ProgressCircle/ProgressCircleRing.js.map +1 -1
- package/lib/module/components/ProgressCircle/ProgressRing.js +48 -0
- package/lib/module/components/ProgressCircle/ProgressRing.js.map +1 -0
- package/lib/module/components/ScrollShadow/useScrollShadow.js +8 -7
- package/lib/module/components/ScrollShadow/useScrollShadow.js.map +1 -1
- package/lib/module/components/Select/index.js.map +1 -1
- package/lib/module/components/Stepper/index.js +360 -0
- package/lib/module/components/Stepper/index.js.map +1 -0
- package/lib/module/components/Stepper/styles.js +206 -0
- package/lib/module/components/Stepper/styles.js.map +1 -0
- package/lib/module/components/Stepper/useStepperLabelFit.js +18 -0
- package/lib/module/components/Stepper/useStepperLabelFit.js.map +1 -0
- package/lib/module/components/Stepper/useStepperLabelFit.web.js +48 -0
- package/lib/module/components/Stepper/useStepperLabelFit.web.js.map +1 -0
- package/lib/module/components/Stepper/useStepperRingColors.js +28 -0
- package/lib/module/components/Stepper/useStepperRingColors.js.map +1 -0
- package/lib/module/components/SystemAlert/animation.js +213 -0
- package/lib/module/components/SystemAlert/animation.js.map +1 -0
- package/lib/module/components/SystemAlert/index.js +515 -0
- package/lib/module/components/SystemAlert/index.js.map +1 -0
- package/lib/module/components/SystemAlert/styles.js +174 -0
- package/lib/module/components/SystemAlert/styles.js.map +1 -0
- package/lib/module/components/SystemAlert/useSystemAlertStatusBarStyle.js +49 -0
- package/lib/module/components/SystemAlert/useSystemAlertStatusBarStyle.js.map +1 -0
- package/lib/module/components/Tabs/index.js +4 -0
- package/lib/module/components/Tabs/index.js.map +1 -1
- package/lib/module/components/Tabs/styles.js +1 -1
- package/lib/module/components/Tabs/styles.js.map +1 -1
- package/lib/module/components/chart/ChartInspector.js +600 -0
- package/lib/module/components/chart/ChartInspector.js.map +1 -0
- package/lib/module/components/chart/format.js +84 -0
- package/lib/module/components/chart/format.js.map +1 -0
- package/lib/module/components/chart/hiddenSvgProps.js +20 -0
- package/lib/module/components/chart/hiddenSvgProps.js.map +1 -0
- package/lib/module/components/chart/index.js +2 -0
- package/lib/module/components/chart/index.js.map +1 -0
- package/lib/module/components/chart/motion.js +89 -0
- package/lib/module/components/chart/motion.js.map +1 -0
- package/lib/module/components/chart/palette.js +168 -0
- package/lib/module/components/chart/palette.js.map +1 -0
- package/lib/module/components/chart/size.js +29 -0
- package/lib/module/components/chart/size.js.map +1 -0
- package/lib/module/components/chart/ticks.js +55 -0
- package/lib/module/components/chart/ticks.js.map +1 -0
- package/lib/module/components/chart/types.js +4 -0
- package/lib/module/components/chart/types.js.map +1 -0
- package/lib/module/components/chart/useChartHostWidth.js +23 -0
- package/lib/module/components/chart/useChartHostWidth.js.map +1 -0
- package/lib/module/components/index.js +6 -0
- package/lib/module/components/index.js.map +1 -1
- package/lib/module/figma/Accordion.figma.js +2 -2
- package/lib/module/figma/Accordion.figma.js.map +1 -1
- package/lib/module/figma/Alert.figma.js +7 -7
- package/lib/module/figma/Alert.figma.js.map +1 -1
- package/lib/module/figma/Badge.Indicator.figma.js +6 -5
- package/lib/module/figma/Badge.Indicator.figma.js.map +1 -1
- package/lib/module/figma/Badge.figma.js +22 -22
- package/lib/module/figma/Badge.figma.js.map +1 -1
- package/lib/module/figma/Button.figma.js +5 -2
- package/lib/module/figma/Button.figma.js.map +1 -1
- package/lib/module/figma/CLAUDE.md +1 -0
- package/lib/module/figma/Card.Header.figma.js +8 -4
- package/lib/module/figma/Card.Header.figma.js.map +1 -1
- package/lib/module/figma/Card.figma.js +2 -1
- package/lib/module/figma/Card.figma.js.map +1 -1
- package/lib/module/figma/Chip.figma.js +2 -2
- package/lib/module/figma/Chip.figma.js.map +1 -1
- package/lib/module/figma/CurrencyInput.figma.js +1 -1
- package/lib/module/figma/CurrencyInput.figma.js.map +1 -1
- package/lib/module/figma/Dialog.figma.js +5 -2
- package/lib/module/figma/Dialog.figma.js.map +1 -1
- package/lib/module/figma/Divider.figma.js +1 -1
- package/lib/module/figma/Divider.figma.js.map +1 -1
- package/lib/module/figma/Drawer.figma.js +3 -3
- package/lib/module/figma/Drawer.figma.js.map +1 -1
- package/lib/module/figma/IconButton.figma.js +10 -4
- package/lib/module/figma/IconButton.figma.js.map +1 -1
- package/lib/module/figma/Input.figma.js +2 -1
- package/lib/module/figma/Input.figma.js.map +1 -1
- package/lib/module/figma/Insight.figma.js +3 -3
- package/lib/module/figma/Insight.figma.js.map +1 -1
- package/lib/module/figma/ProgressBar.figma.js +12 -2
- package/lib/module/figma/ProgressBar.figma.js.map +1 -1
- package/lib/module/figma/ProgressSegmented.figma.js +9 -1
- package/lib/module/figma/ProgressSegmented.figma.js.map +1 -1
- package/lib/module/figma/Select.figma.js +2 -1
- package/lib/module/figma/Select.figma.js.map +1 -1
- package/lib/module/figma/SystemAlert.Button.figma.js +22 -0
- package/lib/module/figma/SystemAlert.Button.figma.js.map +1 -0
- package/lib/module/figma/SystemAlert.Close.figma.js +18 -0
- package/lib/module/figma/SystemAlert.Close.figma.js.map +1 -0
- package/lib/module/figma/SystemAlert.Description.figma.js +14 -0
- package/lib/module/figma/SystemAlert.Description.figma.js.map +1 -0
- package/lib/module/figma/SystemAlert.IconButton.figma.js +25 -0
- package/lib/module/figma/SystemAlert.IconButton.figma.js.map +1 -0
- package/lib/module/figma/SystemAlert.figma.js +41 -0
- package/lib/module/figma/SystemAlert.figma.js.map +1 -0
- package/lib/module/styles.css +0 -1
- package/lib/typescript/components/BarChart/geometry.d.ts +236 -0
- package/lib/typescript/components/BarChart/geometry.d.ts.map +1 -0
- package/lib/typescript/components/BarChart/index.d.ts +193 -0
- package/lib/typescript/components/BarChart/index.d.ts.map +1 -0
- package/lib/typescript/components/BarChart/styles.d.ts +32 -0
- package/lib/typescript/components/BarChart/styles.d.ts.map +1 -0
- package/lib/typescript/components/CountryFlag/index.d.ts +35 -0
- package/lib/typescript/components/CountryFlag/index.d.ts.map +1 -0
- package/lib/typescript/components/Input/index.d.ts +2 -0
- package/lib/typescript/components/Input/index.d.ts.map +1 -1
- package/lib/typescript/components/LineChart/geometry.d.ts +248 -0
- package/lib/typescript/components/LineChart/geometry.d.ts.map +1 -0
- package/lib/typescript/components/LineChart/index.d.ts +105 -0
- package/lib/typescript/components/LineChart/index.d.ts.map +1 -0
- package/lib/typescript/components/LineChart/styles.d.ts +12 -0
- package/lib/typescript/components/LineChart/styles.d.ts.map +1 -0
- package/lib/typescript/components/PieChart/geometry.d.ts +43 -0
- package/lib/typescript/components/PieChart/geometry.d.ts.map +1 -0
- package/lib/typescript/components/PieChart/index.d.ts +147 -0
- package/lib/typescript/components/PieChart/index.d.ts.map +1 -0
- package/lib/typescript/components/PieChart/styles.d.ts +27 -0
- package/lib/typescript/components/PieChart/styles.d.ts.map +1 -0
- package/lib/typescript/components/ProgressBar/index.d.ts +16 -1
- package/lib/typescript/components/ProgressBar/index.d.ts.map +1 -1
- package/lib/typescript/components/ProgressBar/styles.d.ts +7 -2
- package/lib/typescript/components/ProgressBar/styles.d.ts.map +1 -1
- package/lib/typescript/components/ProgressCircle/ProgressCircleRing.d.ts.map +1 -1
- package/lib/typescript/components/ProgressCircle/ProgressRing.d.ts +17 -0
- package/lib/typescript/components/ProgressCircle/ProgressRing.d.ts.map +1 -0
- package/lib/typescript/components/ScrollShadow/useScrollShadow.d.ts.map +1 -1
- package/lib/typescript/components/Select/index.d.ts +2 -0
- package/lib/typescript/components/Select/index.d.ts.map +1 -1
- package/lib/typescript/components/Stepper/index.d.ts +68 -0
- package/lib/typescript/components/Stepper/index.d.ts.map +1 -0
- package/lib/typescript/components/Stepper/styles.d.ts +46 -0
- package/lib/typescript/components/Stepper/styles.d.ts.map +1 -0
- package/lib/typescript/components/Stepper/useStepperLabelFit.d.ts +15 -0
- package/lib/typescript/components/Stepper/useStepperLabelFit.d.ts.map +1 -0
- package/lib/typescript/components/Stepper/useStepperLabelFit.web.d.ts +10 -0
- package/lib/typescript/components/Stepper/useStepperLabelFit.web.d.ts.map +1 -0
- package/lib/typescript/components/Stepper/useStepperRingColors.d.ts +6 -0
- package/lib/typescript/components/Stepper/useStepperRingColors.d.ts.map +1 -0
- package/lib/typescript/components/SystemAlert/animation.d.ts +56 -0
- package/lib/typescript/components/SystemAlert/animation.d.ts.map +1 -0
- package/lib/typescript/components/SystemAlert/index.d.ts +110 -0
- package/lib/typescript/components/SystemAlert/index.d.ts.map +1 -0
- package/lib/typescript/components/SystemAlert/styles.d.ts +38 -0
- package/lib/typescript/components/SystemAlert/styles.d.ts.map +1 -0
- package/lib/typescript/components/SystemAlert/useSystemAlertStatusBarStyle.d.ts +14 -0
- package/lib/typescript/components/SystemAlert/useSystemAlertStatusBarStyle.d.ts.map +1 -0
- package/lib/typescript/components/Tabs/index.d.ts.map +1 -1
- package/lib/typescript/components/chart/ChartInspector.d.ts +101 -0
- package/lib/typescript/components/chart/ChartInspector.d.ts.map +1 -0
- package/lib/typescript/components/chart/format.d.ts +16 -0
- package/lib/typescript/components/chart/format.d.ts.map +1 -0
- package/lib/typescript/components/chart/hiddenSvgProps.d.ts +17 -0
- package/lib/typescript/components/chart/hiddenSvgProps.d.ts.map +1 -0
- package/lib/typescript/components/chart/index.d.ts +3 -0
- package/lib/typescript/components/chart/index.d.ts.map +1 -0
- package/lib/typescript/components/chart/motion.d.ts +27 -0
- package/lib/typescript/components/chart/motion.d.ts.map +1 -0
- package/lib/typescript/components/chart/palette.d.ts +44 -0
- package/lib/typescript/components/chart/palette.d.ts.map +1 -0
- package/lib/typescript/components/chart/size.d.ts +25 -0
- package/lib/typescript/components/chart/size.d.ts.map +1 -0
- package/lib/typescript/components/chart/ticks.d.ts +3 -0
- package/lib/typescript/components/chart/ticks.d.ts.map +1 -0
- package/lib/typescript/components/chart/types.d.ts +163 -0
- package/lib/typescript/components/chart/types.d.ts.map +1 -0
- package/lib/typescript/components/chart/useChartHostWidth.d.ts +9 -0
- package/lib/typescript/components/chart/useChartHostWidth.d.ts.map +1 -0
- package/lib/typescript/components/index.d.ts +6 -0
- package/lib/typescript/components/index.d.ts.map +1 -1
- package/lib/typescript/figma/Alert.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Badge.Indicator.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Badge.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Button.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Card.Header.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Card.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Dialog.figma.d.ts.map +1 -1
- package/lib/typescript/figma/IconButton.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Input.figma.d.ts.map +1 -1
- package/lib/typescript/figma/ProgressBar.figma.d.ts.map +1 -1
- package/lib/typescript/figma/ProgressSegmented.figma.d.ts.map +1 -1
- package/lib/typescript/figma/Select.figma.d.ts.map +1 -1
- package/lib/typescript/figma/SystemAlert.Button.figma.d.ts +11 -0
- package/lib/typescript/figma/SystemAlert.Button.figma.d.ts.map +1 -0
- package/lib/typescript/figma/SystemAlert.Close.figma.d.ts +11 -0
- package/lib/typescript/figma/SystemAlert.Close.figma.d.ts.map +1 -0
- package/lib/typescript/figma/SystemAlert.Description.figma.d.ts +8 -0
- package/lib/typescript/figma/SystemAlert.Description.figma.d.ts.map +1 -0
- package/lib/typescript/figma/SystemAlert.IconButton.figma.d.ts +11 -0
- package/lib/typescript/figma/SystemAlert.IconButton.figma.d.ts.map +1 -0
- package/lib/typescript/figma/SystemAlert.figma.d.ts +8 -0
- package/lib/typescript/figma/SystemAlert.figma.d.ts.map +1 -0
- package/package.json +5 -5
- package/src/components/BarChart/geometry.ts +1469 -0
- package/src/components/BarChart/index.tsx +1417 -0
- package/src/components/BarChart/styles.ts +31 -0
- package/src/components/Button/index.tsx +1 -1
- package/src/components/CountryFlag/index.tsx +53 -0
- package/src/components/Input/index.tsx +2 -0
- package/src/components/LineChart/geometry.ts +957 -0
- package/src/components/LineChart/index.tsx +1106 -0
- package/src/components/LineChart/styles.ts +26 -0
- package/src/components/PieChart/geometry.ts +295 -0
- package/src/components/PieChart/index.tsx +715 -0
- package/src/components/PieChart/styles.ts +101 -0
- package/src/components/ProgressBar/index.tsx +66 -14
- package/src/components/ProgressBar/styles.ts +35 -4
- package/src/components/ProgressCircle/ProgressCircleRing.tsx +10 -39
- package/src/components/ProgressCircle/ProgressRing.tsx +60 -0
- package/src/components/ScrollShadow/useScrollShadow.ts +12 -11
- package/src/components/Select/index.tsx +2 -0
- package/src/components/Stepper/index.tsx +452 -0
- package/src/components/Stepper/styles.ts +234 -0
- package/src/components/Stepper/useStepperLabelFit.ts +21 -0
- package/src/components/Stepper/useStepperLabelFit.web.ts +53 -0
- package/src/components/Stepper/useStepperRingColors.ts +29 -0
- package/src/components/SystemAlert/animation.ts +252 -0
- package/src/components/SystemAlert/index.tsx +684 -0
- package/src/components/SystemAlert/styles.ts +212 -0
- package/src/components/SystemAlert/useSystemAlertStatusBarStyle.ts +57 -0
- package/src/components/Tabs/index.tsx +4 -0
- package/src/components/Tabs/styles.ts +1 -1
- package/src/components/chart/ChartInspector.tsx +726 -0
- package/src/components/chart/format.ts +95 -0
- package/src/components/chart/hiddenSvgProps.ts +15 -0
- package/src/components/chart/index.ts +24 -0
- package/src/components/chart/motion.ts +98 -0
- package/src/components/chart/palette.tsx +247 -0
- package/src/components/chart/size.ts +21 -0
- package/src/components/chart/ticks.ts +53 -0
- package/src/components/chart/types.ts +183 -0
- package/src/components/chart/useChartHostWidth.ts +26 -0
- package/src/components/index.ts +6 -0
- package/src/styles.css +0 -1
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useStepperLabelFit = useStepperLabelFit;
|
|
7
|
+
var _react = require("react");
|
|
8
|
+
/**
|
|
9
|
+
* CSS flex cannot keep min-content minimums only while they fit: `min-width: auto` overflows a
|
|
10
|
+
* tight row and `min-width: 0` breaks words even when there is room. So labels start at
|
|
11
|
+
* `'words'`, and if the root then overflows they switch to `'shrink'` before paint. The decision
|
|
12
|
+
* is kept until the root's width or the step count changes.
|
|
13
|
+
*/
|
|
14
|
+
function useStepperLabelFit(enabled, count) {
|
|
15
|
+
const [node, setNode] = (0, _react.useState)(null);
|
|
16
|
+
const [width, setWidth] = (0, _react.useState)(0);
|
|
17
|
+
const [decision, setDecision] = (0, _react.useState)(null);
|
|
18
|
+
const key = `${String(width)}:${String(count)}`;
|
|
19
|
+
const fit = decision?.key === key ? decision.fit : 'words';
|
|
20
|
+
(0, _react.useEffect)(() => {
|
|
21
|
+
if (!enabled || node === null || typeof ResizeObserver === 'undefined') {
|
|
22
|
+
return undefined;
|
|
23
|
+
}
|
|
24
|
+
const observer = new ResizeObserver(() => {
|
|
25
|
+
setWidth(node.clientWidth);
|
|
26
|
+
});
|
|
27
|
+
observer.observe(node);
|
|
28
|
+
return () => observer.disconnect();
|
|
29
|
+
}, [enabled, node]);
|
|
30
|
+
|
|
31
|
+
// No deps: label text can change without resizing the root, and the measurement is cheap.
|
|
32
|
+
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
33
|
+
(0, _react.useLayoutEffect)(() => {
|
|
34
|
+
if (!enabled || node === null || fit !== 'words') {
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
if (node.scrollWidth > node.clientWidth + 1) {
|
|
38
|
+
setDecision({
|
|
39
|
+
key,
|
|
40
|
+
fit: 'shrink'
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
});
|
|
44
|
+
const measureRef = (0, _react.useCallback)(value => {
|
|
45
|
+
setNode(value);
|
|
46
|
+
}, []);
|
|
47
|
+
return {
|
|
48
|
+
fit: enabled ? fit : 'shrink',
|
|
49
|
+
measureRef: enabled ? measureRef : undefined
|
|
50
|
+
};
|
|
51
|
+
}
|
|
52
|
+
//# sourceMappingURL=useStepperLabelFit.web.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","require","useStepperLabelFit","enabled","count","node","setNode","useState","width","setWidth","decision","setDecision","key","String","fit","useEffect","ResizeObserver","undefined","observer","clientWidth","observe","disconnect","useLayoutEffect","scrollWidth","measureRef","useCallback","value"],"sourceRoot":"../../../../src","sources":["components/Stepper/useStepperLabelFit.web.ts"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AAWA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,kBAAkBA,CAACC,OAAgB,EAAEC,KAAa,EAAyB;EACzF,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG,IAAAC,eAAQ,EAAqB,IAAI,CAAC;EAC1D,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAG,IAAAF,eAAQ,EAAC,CAAC,CAAC;EACrC,MAAM,CAACG,QAAQ,EAAEC,WAAW,CAAC,GAAG,IAAAJ,eAAQ,EAAqB,IAAI,CAAC;EAElE,MAAMK,GAAG,GAAG,GAAGC,MAAM,CAACL,KAAK,CAAC,IAAIK,MAAM,CAACT,KAAK,CAAC,EAAE;EAC/C,MAAMU,GAAoB,GAAGJ,QAAQ,EAAEE,GAAG,KAAKA,GAAG,GAAGF,QAAQ,CAACI,GAAG,GAAG,OAAO;EAE3E,IAAAC,gBAAS,EAAC,MAAM;IACd,IAAI,CAACZ,OAAO,IAAIE,IAAI,KAAK,IAAI,IAAI,OAAOW,cAAc,KAAK,WAAW,EAAE;MACtE,OAAOC,SAAS;IAClB;IACA,MAAMC,QAAQ,GAAG,IAAIF,cAAc,CAAC,MAAM;MACxCP,QAAQ,CAACJ,IAAI,CAACc,WAAW,CAAC;IAC5B,CAAC,CAAC;IACFD,QAAQ,CAACE,OAAO,CAACf,IAAI,CAAC;IACtB,OAAO,MAAMa,QAAQ,CAACG,UAAU,CAAC,CAAC;EACpC,CAAC,EAAE,CAAClB,OAAO,EAAEE,IAAI,CAAC,CAAC;;EAEnB;EACA;EACA,IAAAiB,sBAAe,EAAC,MAAM;IACpB,IAAI,CAACnB,OAAO,IAAIE,IAAI,KAAK,IAAI,IAAIS,GAAG,KAAK,OAAO,EAAE;MAChD;IACF;IACA,IAAIT,IAAI,CAACkB,WAAW,GAAGlB,IAAI,CAACc,WAAW,GAAG,CAAC,EAAE;MAC3CR,WAAW,CAAC;QAAEC,GAAG;QAAEE,GAAG,EAAE;MAAS,CAAC,CAAC;IACrC;EACF,CAAC,CAAC;EAEF,MAAMU,UAAU,GAAG,IAAAC,kBAAW,EAAqBC,KAAK,IAAK;IAC3DpB,OAAO,CAACoB,KAAsC,CAAC;EACjD,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IAAEZ,GAAG,EAAEX,OAAO,GAAGW,GAAG,GAAG,QAAQ;IAAEU,UAAU,EAAErB,OAAO,GAAGqB,UAAU,GAAGP;EAAU,CAAC;AACxF","ignoreList":[]}
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.useStepperRingColors = useStepperRingColors;
|
|
7
|
+
var _uniwind = require("uniwind");
|
|
8
|
+
/** Light-theme fallbacks when Uniwind CSS context is unavailable (e.g. Jest). */
|
|
9
|
+
const FALLBACKS = {
|
|
10
|
+
track: '#e9e9e9',
|
|
11
|
+
brand: '#346099',
|
|
12
|
+
neutral: '#616263'
|
|
13
|
+
};
|
|
14
|
+
function toColor(value, fallback) {
|
|
15
|
+
if (typeof value === 'string' && value.length > 0) {
|
|
16
|
+
return value;
|
|
17
|
+
}
|
|
18
|
+
return fallback;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
/** Ring stroke colors for `Stepper.Indicator`: brand on the current step, neutral otherwise. */
|
|
22
|
+
function useStepperRingColors(isCurrent) {
|
|
23
|
+
const trackToken = (0, _uniwind.useCSSVariable)('--color-stroke-secondary');
|
|
24
|
+
const brandToken = (0, _uniwind.useCSSVariable)('--color-surface-brand-strong');
|
|
25
|
+
const neutralToken = (0, _uniwind.useCSSVariable)('--color-surface-neutral-strong');
|
|
26
|
+
return {
|
|
27
|
+
track: toColor(trackToken, FALLBACKS.track),
|
|
28
|
+
indicator: isCurrent ? toColor(brandToken, FALLBACKS.brand) : toColor(neutralToken, FALLBACKS.neutral)
|
|
29
|
+
};
|
|
30
|
+
}
|
|
31
|
+
//# sourceMappingURL=useStepperRingColors.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_uniwind","require","FALLBACKS","track","brand","neutral","toColor","value","fallback","length","useStepperRingColors","isCurrent","trackToken","useCSSVariable","brandToken","neutralToken","indicator"],"sourceRoot":"../../../../src","sources":["components/Stepper/useStepperRingColors.ts"],"mappings":";;;;;;AAAA,IAAAA,QAAA,GAAAC,OAAA;AAEA;AACA,MAAMC,SAAS,GAAG;EAChBC,KAAK,EAAE,SAAS;EAChBC,KAAK,EAAE,SAAS;EAChBC,OAAO,EAAE;AACX,CAAU;AAEV,SAASC,OAAOA,CAACC,KAAkC,EAAEC,QAAgB,EAAU;EAC7E,IAAI,OAAOD,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACE,MAAM,GAAG,CAAC,EAAE;IACjD,OAAOF,KAAK;EACd;EACA,OAAOC,QAAQ;AACjB;;AAEA;AACO,SAASE,oBAAoBA,CAACC,SAAkB,EAAE;EACvD,MAAMC,UAAU,GAAG,IAAAC,uBAAc,EAAC,0BAA0B,CAAC;EAC7D,MAAMC,UAAU,GAAG,IAAAD,uBAAc,EAAC,8BAA8B,CAAC;EACjE,MAAME,YAAY,GAAG,IAAAF,uBAAc,EAAC,gCAAgC,CAAC;EAErE,OAAO;IACLV,KAAK,EAAEG,OAAO,CAACM,UAAU,EAAEV,SAAS,CAACC,KAAK,CAAC;IAC3Ca,SAAS,EAAEL,SAAS,GAChBL,OAAO,CAACQ,UAAU,EAAEZ,SAAS,CAACE,KAAK,CAAC,GACpCE,OAAO,CAACS,YAAY,EAAEb,SAAS,CAACG,OAAO;EAC7C,CAAC;AACH","ignoreList":[]}
|
|
@@ -0,0 +1,218 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.SYSTEM_ALERT_WEB_SAFETY_MS = exports.SYSTEM_ALERT_EXIT_MS = exports.SYSTEM_ALERT_ENTER_MS = void 0;
|
|
7
|
+
exports.useSystemAlertPresence = useSystemAlertPresence;
|
|
8
|
+
exports.useSystemAlertSurfaceStyle = useSystemAlertSurfaceStyle;
|
|
9
|
+
var _react = require("react");
|
|
10
|
+
var _reactNative = require("react-native");
|
|
11
|
+
var _reactNativeReanimated = require("react-native-reanimated");
|
|
12
|
+
var _reactNativeWorklets = require("react-native-worklets");
|
|
13
|
+
var _animation = require("../../animation");
|
|
14
|
+
// No motion spec exists for SystemAlert; these mirror FullScreenDialog's surface motion.
|
|
15
|
+
const SYSTEM_ALERT_ENTER_MS = exports.SYSTEM_ALERT_ENTER_MS = 300;
|
|
16
|
+
const SYSTEM_ALERT_EXIT_MS = exports.SYSTEM_ALERT_EXIT_MS = 220;
|
|
17
|
+
/** Unmounts an exiting web surface when `transitionend` never fires (reduced motion, hidden tab). */
|
|
18
|
+
const SYSTEM_ALERT_WEB_SAFETY_MS = exports.SYSTEM_ALERT_WEB_SAFETY_MS = SYSTEM_ALERT_EXIT_MS + 100;
|
|
19
|
+
const ENTER_TIMING = {
|
|
20
|
+
duration: SYSTEM_ALERT_ENTER_MS,
|
|
21
|
+
easing: _reactNativeReanimated.Easing.bezier(0.32, 0.72, 0, 1)
|
|
22
|
+
};
|
|
23
|
+
const EXIT_TIMING = {
|
|
24
|
+
duration: SYSTEM_ALERT_EXIT_MS,
|
|
25
|
+
easing: _reactNativeReanimated.Easing.bezier(0.4, 0, 1, 1)
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
/**
|
|
29
|
+
* `entering` and `exiting` exist only while motion runs. With motion off, `isOpen`
|
|
30
|
+
* moves straight between `open` and `closed`.
|
|
31
|
+
*/
|
|
32
|
+
|
|
33
|
+
/** Web `data-state`. `exiting` maps to `closed`, as in Dialog and FullScreenDialog. */
|
|
34
|
+
|
|
35
|
+
/**
|
|
36
|
+
* Presence lifecycle and contact-push motion for an in-flow SystemAlert. One value, the
|
|
37
|
+
* surface's bottom edge `b`, is driven; the wrapper's height is `max(collapsedHeight, b)`,
|
|
38
|
+
* so content below only moves once the surface leaves the reserved strip.
|
|
39
|
+
*
|
|
40
|
+
* Web runs the same lifecycle on CSS transitions keyed on `data-state` instead of Reanimated:
|
|
41
|
+
* `entering` → (rAF) → `open`, and `closed` → `transitionend` on the wrapper's `height`, or a
|
|
42
|
+
* safety timer → unmount. The inset is 0 there, so the wrapper's height is `b`, and the surface,
|
|
43
|
+
* aligned to the wrapper's bottom edge, follows the same transition.
|
|
44
|
+
*/
|
|
45
|
+
function useSystemAlertPresence({
|
|
46
|
+
isOpen,
|
|
47
|
+
animation,
|
|
48
|
+
collapsedHeight
|
|
49
|
+
}) {
|
|
50
|
+
const isWeb = _reactNative.Platform.OS === 'web';
|
|
51
|
+
const isAllAnimationsDisabled = (0, _animation.useCombinedAnimationDisabledState)(animation);
|
|
52
|
+
const hasMotion = !isAllAnimationsDisabled;
|
|
53
|
+
const [phase, setPhase] = (0, _react.useState)(isOpen ? 'open' : 'closed');
|
|
54
|
+
const [prevIsOpen, setPrevIsOpen] = (0, _react.useState)(isOpen);
|
|
55
|
+
if (isOpen !== prevIsOpen) {
|
|
56
|
+
setPrevIsOpen(isOpen);
|
|
57
|
+
if (isOpen) {
|
|
58
|
+
setPhase(hasMotion ? 'entering' : 'open');
|
|
59
|
+
} else {
|
|
60
|
+
setPhase(hasMotion ? 'exiting' : 'closed');
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
const edge = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
64
|
+
const surfaceHeight = (0, _reactNativeReanimated.useSharedValue)(0);
|
|
65
|
+
const isSettled = (0, _reactNativeReanimated.useSharedValue)(isOpen);
|
|
66
|
+
const [webSurfaceHeight, setWebSurfaceHeight] = (0, _react.useState)(0);
|
|
67
|
+
const wrapperRef = (0, _react.useRef)(null);
|
|
68
|
+
|
|
69
|
+
// Read by the surface's layout callbacks, which run before this hook's own effects.
|
|
70
|
+
const phaseRef = (0, _react.useRef)(phase);
|
|
71
|
+
phaseRef.current = phase;
|
|
72
|
+
// The JS-side copy of `surfaceHeight`. A shared value read on the JS thread right after a
|
|
73
|
+
// JS write can still return the old value, which would start the first enter toward 0.
|
|
74
|
+
const surfaceHeightRef = (0, _react.useRef)(0);
|
|
75
|
+
const settle = (0, _react.useCallback)((from, to) => {
|
|
76
|
+
setPhase(current => current === from ? to : current);
|
|
77
|
+
}, []);
|
|
78
|
+
|
|
79
|
+
// `withTiming` starts from the current edge, so a reversal continues from where it is.
|
|
80
|
+
const startEnter = (0, _react.useCallback)(() => {
|
|
81
|
+
edge.set((0, _reactNativeReanimated.withTiming)(surfaceHeightRef.current, ENTER_TIMING, finished => {
|
|
82
|
+
'worklet';
|
|
83
|
+
|
|
84
|
+
if (finished) (0, _reactNativeWorklets.scheduleOnRN)(settle, 'entering', 'open');
|
|
85
|
+
}));
|
|
86
|
+
}, [edge, settle]);
|
|
87
|
+
const setSurfaceHeight = (0, _react.useCallback)(height => {
|
|
88
|
+
if (height <= 0) return;
|
|
89
|
+
if (isWeb) {
|
|
90
|
+
setWebSurfaceHeight(height);
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
93
|
+
if (height === surfaceHeightRef.current) return;
|
|
94
|
+
surfaceHeightRef.current = height;
|
|
95
|
+
surfaceHeight.set(height);
|
|
96
|
+
if (phaseRef.current === 'open') {
|
|
97
|
+
edge.set(height);
|
|
98
|
+
} else if (phaseRef.current === 'entering') {
|
|
99
|
+
startEnter();
|
|
100
|
+
}
|
|
101
|
+
}, [isWeb, edge, surfaceHeight, startEnter]);
|
|
102
|
+
|
|
103
|
+
// A layout effect so the surface's synchronous measurement (a child effect) has already
|
|
104
|
+
// run and the first animated frame targets the measured height. Without one, `onLayout`
|
|
105
|
+
// starts the enter through `setSurfaceHeight`.
|
|
106
|
+
(0, _react.useLayoutEffect)(() => {
|
|
107
|
+
if (isWeb) return;
|
|
108
|
+
switch (phase) {
|
|
109
|
+
case 'open':
|
|
110
|
+
edge.set(surfaceHeightRef.current);
|
|
111
|
+
isSettled.set(true);
|
|
112
|
+
break;
|
|
113
|
+
case 'closed':
|
|
114
|
+
isSettled.set(false);
|
|
115
|
+
edge.set(0);
|
|
116
|
+
break;
|
|
117
|
+
case 'entering':
|
|
118
|
+
isSettled.set(false);
|
|
119
|
+
if (surfaceHeightRef.current > 0) startEnter();
|
|
120
|
+
break;
|
|
121
|
+
case 'exiting':
|
|
122
|
+
isSettled.set(false);
|
|
123
|
+
edge.set((0, _reactNativeReanimated.withTiming)(0, EXIT_TIMING, finished => {
|
|
124
|
+
'worklet';
|
|
125
|
+
|
|
126
|
+
if (finished) (0, _reactNativeWorklets.scheduleOnRN)(settle, 'exiting', 'closed');
|
|
127
|
+
}));
|
|
128
|
+
break;
|
|
129
|
+
}
|
|
130
|
+
}, [isWeb, phase, edge, isSettled, startEnter, settle]);
|
|
131
|
+
|
|
132
|
+
// One frame at `entering` (height 0, surface above the clip) so the browser has a start
|
|
133
|
+
// value to transition from.
|
|
134
|
+
(0, _react.useEffect)(() => {
|
|
135
|
+
if (!isWeb || phase !== 'entering') return;
|
|
136
|
+
const frame = requestAnimationFrame(() => {
|
|
137
|
+
settle('entering', 'open');
|
|
138
|
+
});
|
|
139
|
+
return () => cancelAnimationFrame(frame);
|
|
140
|
+
}, [isWeb, phase, settle]);
|
|
141
|
+
(0, _react.useEffect)(() => {
|
|
142
|
+
if (!isWeb || phase !== 'exiting') return;
|
|
143
|
+
const node = wrapperRef.current;
|
|
144
|
+
const finish = () => {
|
|
145
|
+
settle('exiting', 'closed');
|
|
146
|
+
};
|
|
147
|
+
const safetyTimer = setTimeout(finish, SYSTEM_ALERT_WEB_SAFETY_MS);
|
|
148
|
+
if (typeof node?.addEventListener !== 'function') {
|
|
149
|
+
return () => clearTimeout(safetyTimer);
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
// The surface's own `transform` transition bubbles here too.
|
|
153
|
+
const handleTransitionEnd = event => {
|
|
154
|
+
if (event.target !== node) return;
|
|
155
|
+
if (event.propertyName === 'height') finish();
|
|
156
|
+
};
|
|
157
|
+
node.addEventListener('transitionend', handleTransitionEnd);
|
|
158
|
+
return () => {
|
|
159
|
+
clearTimeout(safetyTimer);
|
|
160
|
+
node.removeEventListener('transitionend', handleTransitionEnd);
|
|
161
|
+
};
|
|
162
|
+
}, [isWeb, phase, settle]);
|
|
163
|
+
|
|
164
|
+
// CSS cannot transition to `auto`, so a moving wrapper gets the measured px height.
|
|
165
|
+
// Before the first measurement (or with motion off) it sizes to its content; `auto` → px
|
|
166
|
+
// does not transition, so a banner shown on first render does not animate.
|
|
167
|
+
let webWrapperHeight;
|
|
168
|
+
if (isWeb && hasMotion) {
|
|
169
|
+
webWrapperHeight = phase === 'open' ? webSurfaceHeight || undefined : 0;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
// Explicit deps for Vite/web without the Reanimated Babel plugin.
|
|
173
|
+
const wrapperStyle = (0, _reactNativeReanimated.useAnimatedStyle)(() => ({
|
|
174
|
+
height: isSettled.get() ? 'auto' : Math.max(collapsedHeight, edge.get())
|
|
175
|
+
}), [isSettled, edge, collapsedHeight]);
|
|
176
|
+
return {
|
|
177
|
+
phase,
|
|
178
|
+
isSurfaceMounted: phase !== 'closed',
|
|
179
|
+
wrapperStyle,
|
|
180
|
+
setSurfaceHeight,
|
|
181
|
+
edge,
|
|
182
|
+
surfaceHeight,
|
|
183
|
+
isSettled,
|
|
184
|
+
webState: isWeb ? phase === 'exiting' ? 'closed' : phase : undefined,
|
|
185
|
+
webWrapperHeight,
|
|
186
|
+
wrapperRef
|
|
187
|
+
};
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
/**
|
|
191
|
+
* The surface's slide, `translateY = b − H`. Call it from a component that mounts with the
|
|
192
|
+
* surface: Reanimated computes the initial style once, on the hook's first render.
|
|
193
|
+
*/
|
|
194
|
+
function useSystemAlertSurfaceStyle({
|
|
195
|
+
edge,
|
|
196
|
+
surfaceHeight,
|
|
197
|
+
isSettled
|
|
198
|
+
}) {
|
|
199
|
+
const {
|
|
200
|
+
height: windowHeight
|
|
201
|
+
} = (0, _reactNative.useWindowDimensions)();
|
|
202
|
+
|
|
203
|
+
// Explicit deps for Vite/web without the Reanimated Babel plugin.
|
|
204
|
+
return (0, _reactNativeReanimated.useAnimatedStyle)(() => {
|
|
205
|
+
const height = surfaceHeight.get();
|
|
206
|
+
let translateY = 0;
|
|
207
|
+
if (!isSettled.get()) {
|
|
208
|
+
// Before the first measurement, park the surface above the clip.
|
|
209
|
+
translateY = height > 0 ? edge.get() - height : -windowHeight;
|
|
210
|
+
}
|
|
211
|
+
return {
|
|
212
|
+
transform: [{
|
|
213
|
+
translateY
|
|
214
|
+
}]
|
|
215
|
+
};
|
|
216
|
+
}, [edge, surfaceHeight, isSettled, windowHeight]);
|
|
217
|
+
}
|
|
218
|
+
//# sourceMappingURL=animation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["_react","require","_reactNative","_reactNativeReanimated","_reactNativeWorklets","_animation","SYSTEM_ALERT_ENTER_MS","exports","SYSTEM_ALERT_EXIT_MS","SYSTEM_ALERT_WEB_SAFETY_MS","ENTER_TIMING","duration","easing","Easing","bezier","EXIT_TIMING","useSystemAlertPresence","isOpen","animation","collapsedHeight","isWeb","Platform","OS","isAllAnimationsDisabled","useCombinedAnimationDisabledState","hasMotion","phase","setPhase","useState","prevIsOpen","setPrevIsOpen","edge","useSharedValue","surfaceHeight","isSettled","webSurfaceHeight","setWebSurfaceHeight","wrapperRef","useRef","phaseRef","current","surfaceHeightRef","settle","useCallback","from","to","startEnter","set","withTiming","finished","scheduleOnRN","setSurfaceHeight","height","useLayoutEffect","useEffect","frame","requestAnimationFrame","cancelAnimationFrame","node","finish","safetyTimer","setTimeout","addEventListener","clearTimeout","handleTransitionEnd","event","target","propertyName","removeEventListener","webWrapperHeight","undefined","wrapperStyle","useAnimatedStyle","get","Math","max","isSurfaceMounted","webState","useSystemAlertSurfaceStyle","windowHeight","useWindowDimensions","translateY","transform"],"sourceRoot":"../../../../src","sources":["components/SystemAlert/animation.ts"],"mappings":"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","ignoreList":[]}
|