@chayns-components/devalue-slider 5.0.0-beta.1000
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/LICENSE +21 -0
- package/README.md +18 -0
- package/lib/cjs/components/DevalueSlider.js +58 -0
- package/lib/cjs/components/DevalueSlider.js.map +1 -0
- package/lib/cjs/components/slider/Slider.js +212 -0
- package/lib/cjs/components/slider/Slider.js.map +1 -0
- package/lib/cjs/components/slider/Slider.styles.js +265 -0
- package/lib/cjs/components/slider/Slider.styles.js.map +1 -0
- package/lib/cjs/components/timer/Timer.js +78 -0
- package/lib/cjs/components/timer/Timer.js.map +1 -0
- package/lib/cjs/components/timer/Timer.styles.js +30 -0
- package/lib/cjs/components/timer/Timer.styles.js.map +1 -0
- package/lib/cjs/hooks/design.js +29 -0
- package/lib/cjs/hooks/design.js.map +1 -0
- package/lib/cjs/index.js +14 -0
- package/lib/cjs/index.js.map +1 -0
- package/lib/cjs/utils/common.js +11 -0
- package/lib/cjs/utils/common.js.map +1 -0
- package/lib/cjs/utils/date.js +91 -0
- package/lib/cjs/utils/date.js.map +1 -0
- package/lib/esm/components/DevalueSlider.js +48 -0
- package/lib/esm/components/DevalueSlider.js.map +1 -0
- package/lib/esm/components/slider/Slider.js +204 -0
- package/lib/esm/components/slider/Slider.js.map +1 -0
- package/lib/esm/components/slider/Slider.styles.js +293 -0
- package/lib/esm/components/slider/Slider.styles.js.map +1 -0
- package/lib/esm/components/timer/Timer.js +71 -0
- package/lib/esm/components/timer/Timer.js.map +1 -0
- package/lib/esm/components/timer/Timer.styles.js +29 -0
- package/lib/esm/components/timer/Timer.styles.js.map +1 -0
- package/lib/esm/hooks/design.js +22 -0
- package/lib/esm/hooks/design.js.map +1 -0
- package/lib/esm/index.js +2 -0
- package/lib/esm/index.js.map +1 -0
- package/lib/esm/utils/common.js +4 -0
- package/lib/esm/utils/common.js.map +1 -0
- package/lib/esm/utils/date.js +80 -0
- package/lib/esm/utils/date.js.map +1 -0
- package/lib/types/components/DevalueSlider.d.ts +50 -0
- package/lib/types/components/slider/Slider.d.ts +19 -0
- package/lib/types/components/slider/Slider.styles.d.ts +1884 -0
- package/lib/types/components/timer/Timer.d.ts +8 -0
- package/lib/types/components/timer/Timer.styles.d.ts +269 -0
- package/lib/types/hooks/design.d.ts +6 -0
- package/lib/types/index.d.ts +1 -0
- package/lib/types/utils/common.d.ts +1 -0
- package/lib/types/utils/date.d.ts +23 -0
- package/package.json +85 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slider.js","names":["SmallWaitCursor","useSize","invokeCall","vibrate","useAnimation","useDragControls","useMotionValue","useTransform","React","forwardRef","useCallback","useEffect","useImperativeHandle","useMemo","useRef","useState","useThumbIcon","sleep","Container","createThumbVariants","Thumb","ThumbIcon","ThumbIconContainer","THUMB_ICON_VARIANTS","Track","TrackBackground","TrackText","Slider","_ref","ref","color","devalueColor","trackHeight","thumbSize","borderSize","trackText","onChange","onDevalue","Promise","resolve","success","onComplete","trackRef","setTrackRef","trackWidth","initialWidth","initialHeight","iconColor","setIconColor","isCompleted","setIsCompleted","isDisabled","setIsDisabled","isCompletedRef","showWaitCursor","setShowWaitCursor","scaleFactor","x","icon","styles","iconStyles","dragControls","vibrationTrigger","value","Math","round","lastVibrationValue","on","current","pattern","containerAnimation","thumbVariants","textOpacity","relativeValue","thumbRadius","parseFloat","toPrecision","relativeBackgroundValue","trackBackground","handlePointerDownCapture","event","currentValue","get","preventDefault","stopPropagation","action","iOSFeedbackVibration","handleRedeem","devaluePromise","sleepPromise","devalued","all","start","handleTrackRef","node","handleDragStart","handleDragEnd","disable","enable","baseFontSize","createElement","animate","$height","$borderSize","$backgroundColor","style","background","variants","$size","$trackHeight","drag","dragElastic","onPointerDownCapture","whileTap","scale","cursor","onDragStart","onDragEnd","dragConstraints","right","left","key","shouldHideBackground","opacity","$color","$baseFontSize"],"sources":["../../../../src/components/slider/Slider.tsx"],"sourcesContent":["import { SmallWaitCursor } from '@chayns-components/core';\nimport useSize from '@react-hook/size';\nimport { invokeCall, vibrate } from 'chayns-api';\nimport {\n useAnimation,\n useDragControls,\n useMotionValue,\n useTransform,\n type DragHandlers,\n} from 'framer-motion';\nimport React, {\n forwardRef,\n PointerEvent,\n useCallback,\n useEffect,\n useImperativeHandle,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { useThumbIcon } from '../../hooks/design';\nimport { sleep } from '../../utils/common';\nimport type { DevalueSliderProps } from '../DevalueSlider';\nimport {\n Container,\n createThumbVariants,\n Thumb,\n ThumbIcon,\n ThumbIconContainer,\n THUMB_ICON_VARIANTS,\n Track,\n TrackBackground,\n TrackText,\n} from './Slider.styles';\n\nexport type SliderProps = {\n color: NonNullable<DevalueSliderProps['backgroundColor']>;\n devalueColor: NonNullable<DevalueSliderProps['devalueBackgroundColor']>;\n thumbSize?: number;\n trackHeight?: number;\n trackText?: string;\n borderSize?: number;\n onChange: DevalueSliderProps['onChange'];\n onDevalue: DevalueSliderProps['onDevalue'];\n onComplete: DevalueSliderProps['onComplete'];\n};\n\nexport type SliderRef = {\n disable: () => void;\n enable: () => void;\n};\n\nconst Slider = forwardRef<SliderRef, SliderProps>(\n (\n {\n color,\n devalueColor,\n trackHeight = 50,\n thumbSize = 40,\n borderSize = 2,\n trackText = 'EINLÖSEN',\n onChange = () => {},\n onDevalue = () => Promise.resolve({ success: true }),\n onComplete,\n },\n ref,\n ) => {\n const [trackRef, setTrackRef] = useState<HTMLDivElement | null>(null);\n const [trackWidth] = useSize(trackRef, { initialWidth: 300, initialHeight: 50 });\n const [iconColor, setIconColor] = useState('black');\n const [isCompleted, setIsCompleted] = useState(false);\n const [isDisabled, setIsDisabled] = useState(false);\n const isCompletedRef = useRef(isCompleted);\n const [showWaitCursor, setShowWaitCursor] = useState(false);\n const scaleFactor = useMemo(() => trackHeight / thumbSize, [thumbSize, trackHeight]);\n\n const x = useMotionValue(0);\n const { icon, styles: iconStyles } = useThumbIcon(x, iconColor);\n const dragControls = useDragControls();\n\n const vibrationTrigger = useTransform(\n x,\n // round to 10 to avoid unnecessary vibrate calls\n (value) => Math.round(value / 10) * 10,\n );\n const lastVibrationValue = useRef(0);\n useEffect(() => {\n vibrationTrigger.on('change', (value) => {\n if (!isCompletedRef.current && value !== lastVibrationValue.current) {\n lastVibrationValue.current = value;\n void vibrate({ pattern: [10] });\n }\n });\n }, [vibrationTrigger]);\n\n const containerAnimation = useAnimation();\n const thumbVariants = useMemo(\n () =>\n createThumbVariants({\n thumbSize,\n trackWidth,\n scaleFactor,\n }),\n [scaleFactor, thumbSize, trackWidth],\n );\n\n const textOpacity = useTransform(x, [0, 120], [1, 0]);\n\n // this is the relative value of the right edge of the thumb\n const relativeValue = useTransform(x, (value) => {\n if (!value) return 0;\n const thumbRadius = thumbSize * scaleFactor;\n return parseFloat((((value + thumbRadius) / trackWidth) * 100).toPrecision(2));\n });\n\n // this is the relative value of the center of the thumb, it is used for the background gradient\n const relativeBackgroundValue = useTransform(x, (value) => {\n if (!value) return 0;\n const thumbRadius = (thumbSize * scaleFactor) / 2;\n return parseFloat((((value + thumbRadius) / trackWidth) * 100).toPrecision(2));\n });\n\n const trackBackground = useTransform(relativeBackgroundValue, (value) => {\n if (isCompleted) return devalueColor;\n if (!value) return 'transparent';\n return `linear-gradient(to right, ${devalueColor} ${value}%, transparent ${value}%)`;\n });\n\n const handlePointerDownCapture = useCallback(\n (event: PointerEvent) => {\n const currentValue = relativeValue.get();\n\n if (currentValue > 5) {\n event.preventDefault();\n event.stopPropagation();\n }\n\n void invokeCall({\n action: 19,\n value: {\n pattern: [50],\n iOSFeedbackVibration: 7,\n },\n });\n },\n [relativeValue],\n );\n\n const handleRedeem = useCallback(async () => {\n setShowWaitCursor(true);\n setIsCompleted(true);\n isCompletedRef.current = true;\n\n const devaluePromise = onDevalue();\n const sleepPromise = sleep(1000);\n const [devalued] = await Promise.all([devaluePromise, sleepPromise]);\n\n if (!devalued.success) {\n setShowWaitCursor(false);\n setIsCompleted(false);\n isCompletedRef.current = false;\n await containerAnimation.start('base');\n return;\n }\n\n setShowWaitCursor(false);\n setIconColor('white');\n void invokeCall({\n action: 19,\n value: {\n iOSFeedbackVibration: 3,\n pattern: [100, 200, 100],\n },\n });\n\n await containerAnimation.start('completed');\n await containerAnimation.start('leaving');\n onComplete?.();\n }, [containerAnimation, onComplete, onDevalue]);\n\n const handleTrackRef = useCallback((node: HTMLDivElement | null) => {\n setTrackRef(node);\n }, []);\n\n const handleDragStart = useCallback<NonNullable<DragHandlers['onDragStart']>>(() => {\n void containerAnimation.start('dragging');\n }, [containerAnimation]);\n\n const handleDragEnd = useCallback<NonNullable<DragHandlers['onDragEnd']>>(() => {\n if (relativeValue.get() > 98) {\n void handleRedeem();\n return;\n }\n\n void containerAnimation.start('base');\n }, [relativeValue, containerAnimation, handleRedeem]);\n\n useEffect(() => {\n void containerAnimation.start('base');\n }, [containerAnimation]);\n\n useEffect(() => {\n if (isCompleted) return () => {};\n return relativeValue.on('change', onChange);\n }, [isCompleted, onChange, relativeValue]);\n\n useImperativeHandle(\n ref,\n () => ({\n disable: () => {\n setIsDisabled(true);\n setShowWaitCursor(false);\n setIsCompleted(false);\n isCompletedRef.current = false;\n void containerAnimation.start('base');\n },\n enable: () => {\n setIsDisabled(false);\n },\n }),\n [containerAnimation],\n );\n\n const baseFontSize = useMemo(() => 22, []);\n\n return (\n <Container animate={containerAnimation}>\n <Track\n $height={trackHeight}\n $borderSize={borderSize}\n $backgroundColor={color}\n ref={handleTrackRef}\n >\n <TrackBackground\n $height={trackHeight}\n style={{ background: trackBackground }}\n />\n <Thumb\n variants={thumbVariants}\n $size={thumbSize}\n $trackHeight={trackHeight}\n style={{ x }}\n drag={isCompleted || isDisabled ? false : 'x'}\n dragElastic={0}\n onPointerDownCapture={handlePointerDownCapture}\n whileTap={{ scale: 1.4, cursor: 'grabbing' }}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n dragControls={dragControls}\n dragConstraints={{\n right: trackWidth - thumbSize * scaleFactor,\n left: 0,\n }}\n >\n <ThumbIconContainer>\n {!showWaitCursor && (\n <ThumbIcon\n key=\"thumb-icon\"\n icon={icon}\n variants={THUMB_ICON_VARIANTS}\n style={iconStyles}\n />\n )}\n {showWaitCursor && (\n <SmallWaitCursor shouldHideBackground color=\"black\" />\n )}\n </ThumbIconContainer>\n </Thumb>\n <TrackText\n style={{ opacity: textOpacity }}\n $color=\"white\"\n $baseFontSize={baseFontSize}\n >\n {trackText}\n </TrackText>\n </Track>\n </Container>\n );\n },\n);\n\nexport default Slider;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,293 @@
|
|
|
1
|
+
import { motion } from 'framer-motion';
|
|
2
|
+
import styled from 'styled-components';
|
|
3
|
+
export const Container = styled(motion.div)``;
|
|
4
|
+
export const Track = styled(motion.div)`
|
|
5
|
+
user-select: none;
|
|
6
|
+
position: relative;
|
|
7
|
+
z-index: 3;
|
|
8
|
+
height: ${_ref => {
|
|
9
|
+
let {
|
|
10
|
+
$height
|
|
11
|
+
} = _ref;
|
|
12
|
+
return $height;
|
|
13
|
+
}}px;
|
|
14
|
+
border-radius: ${_ref2 => {
|
|
15
|
+
let {
|
|
16
|
+
$height
|
|
17
|
+
} = _ref2;
|
|
18
|
+
return $height / 2;
|
|
19
|
+
}}px;
|
|
20
|
+
background-color: ${_ref3 => {
|
|
21
|
+
let {
|
|
22
|
+
$backgroundColor
|
|
23
|
+
} = _ref3;
|
|
24
|
+
return $backgroundColor;
|
|
25
|
+
}};
|
|
26
|
+
`;
|
|
27
|
+
export const TrackBackground = styled(motion.div)`
|
|
28
|
+
position: absolute;
|
|
29
|
+
width: 100%;
|
|
30
|
+
height: 100%;
|
|
31
|
+
border-radius: ${_ref4 => {
|
|
32
|
+
let {
|
|
33
|
+
$height
|
|
34
|
+
} = _ref4;
|
|
35
|
+
return $height / 2;
|
|
36
|
+
}}px;
|
|
37
|
+
z-index: 2;
|
|
38
|
+
`;
|
|
39
|
+
export const Thumb = styled(motion.div)`
|
|
40
|
+
height: ${_ref5 => {
|
|
41
|
+
let {
|
|
42
|
+
$size
|
|
43
|
+
} = _ref5;
|
|
44
|
+
return $size;
|
|
45
|
+
}}px;
|
|
46
|
+
width: ${_ref6 => {
|
|
47
|
+
let {
|
|
48
|
+
$size
|
|
49
|
+
} = _ref6;
|
|
50
|
+
return $size;
|
|
51
|
+
}}px;
|
|
52
|
+
border-radius: 50%;
|
|
53
|
+
background-color: white;
|
|
54
|
+
left: ${_ref7 => {
|
|
55
|
+
let {
|
|
56
|
+
$size,
|
|
57
|
+
$trackHeight
|
|
58
|
+
} = _ref7;
|
|
59
|
+
return ($trackHeight - $size - 2) / 2;
|
|
60
|
+
}}px;
|
|
61
|
+
bottom: ${_ref8 => {
|
|
62
|
+
let {
|
|
63
|
+
$size,
|
|
64
|
+
$trackHeight
|
|
65
|
+
} = _ref8;
|
|
66
|
+
return ($trackHeight - $size - 2) / 2 + 1;
|
|
67
|
+
}}px;
|
|
68
|
+
position: absolute;
|
|
69
|
+
z-index: 3;
|
|
70
|
+
box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 2px 0;
|
|
71
|
+
`;
|
|
72
|
+
export const TrackText = styled(motion.div)`
|
|
73
|
+
position: absolute;
|
|
74
|
+
line-height: 1.15;
|
|
75
|
+
font-size: ${_ref9 => {
|
|
76
|
+
let {
|
|
77
|
+
$baseFontSize
|
|
78
|
+
} = _ref9;
|
|
79
|
+
return $baseFontSize;
|
|
80
|
+
}}px;
|
|
81
|
+
font-weight: 700;
|
|
82
|
+
color: ${_ref10 => {
|
|
83
|
+
let {
|
|
84
|
+
$color
|
|
85
|
+
} = _ref10;
|
|
86
|
+
return $color;
|
|
87
|
+
}};
|
|
88
|
+
top: 50%;
|
|
89
|
+
left: 50%;
|
|
90
|
+
transform: translate(-50%, -50%);
|
|
91
|
+
white-space: nowrap;
|
|
92
|
+
text-overflow: ellipsis;
|
|
93
|
+
z-index: 1;
|
|
94
|
+
font-family:
|
|
95
|
+
Roboto Regular,
|
|
96
|
+
sans-serif;
|
|
97
|
+
|
|
98
|
+
@font-face {
|
|
99
|
+
font-family: 'Roboto Regular';
|
|
100
|
+
font-style: normal;
|
|
101
|
+
font-weight: normal;
|
|
102
|
+
src:
|
|
103
|
+
local('Roboto Regular'),
|
|
104
|
+
local('Roboto Regular'),
|
|
105
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.woff2) format('woff2'),
|
|
106
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.woff) format('woff'),
|
|
107
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.ttf)
|
|
108
|
+
format('truetype'),
|
|
109
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.svg) format('svg');
|
|
110
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
@font-face {
|
|
114
|
+
font-family: 'Roboto Regular';
|
|
115
|
+
font-style: italic;
|
|
116
|
+
font-weight: normal;
|
|
117
|
+
src:
|
|
118
|
+
local('Roboto Regular Italic'),
|
|
119
|
+
local('Roboto Regular-Italic'),
|
|
120
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.woff2) format('woff2'),
|
|
121
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.woff) format('woff'),
|
|
122
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.ttf) format('truetype'),
|
|
123
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.svg) format('svg');
|
|
124
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
125
|
+
}
|
|
126
|
+
|
|
127
|
+
@font-face {
|
|
128
|
+
font-family: 'Roboto Regular';
|
|
129
|
+
font-style: normal;
|
|
130
|
+
font-weight: bold;
|
|
131
|
+
src:
|
|
132
|
+
local('Roboto Regular Bold'),
|
|
133
|
+
local('Roboto Regular-Bold'),
|
|
134
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.woff2) format('woff2'),
|
|
135
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.woff) format('woff'),
|
|
136
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.ttf) format('truetype'),
|
|
137
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.svg) format('svg');
|
|
138
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
@font-face {
|
|
142
|
+
font-family: 'Roboto Regular';
|
|
143
|
+
font-style: italic;
|
|
144
|
+
font-weight: bold;
|
|
145
|
+
src:
|
|
146
|
+
local('Roboto Regular Bold Italic'),
|
|
147
|
+
local('Roboto Regular-BoldItalic'),
|
|
148
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.woff2)
|
|
149
|
+
format('woff2'),
|
|
150
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.woff)
|
|
151
|
+
format('woff'),
|
|
152
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.ttf)
|
|
153
|
+
format('truetype'),
|
|
154
|
+
url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.svg) format('svg');
|
|
155
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
156
|
+
}
|
|
157
|
+
|
|
158
|
+
@font-face {
|
|
159
|
+
font-family: 'Roboto Bold';
|
|
160
|
+
font-style: normal;
|
|
161
|
+
font-weight: normal;
|
|
162
|
+
src:
|
|
163
|
+
local('Roboto Bold'),
|
|
164
|
+
local('Roboto Bold'),
|
|
165
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.woff2) format('woff2'),
|
|
166
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.woff) format('woff'),
|
|
167
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.ttf) format('truetype'),
|
|
168
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.svg) format('svg');
|
|
169
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
170
|
+
}
|
|
171
|
+
|
|
172
|
+
@font-face {
|
|
173
|
+
font-family: 'Roboto Bold';
|
|
174
|
+
font-style: italic;
|
|
175
|
+
font-weight: normal;
|
|
176
|
+
src:
|
|
177
|
+
local('Roboto Bold Italic'),
|
|
178
|
+
local('Roboto Bold-Italic'),
|
|
179
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.woff2) format('woff2'),
|
|
180
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.woff) format('woff'),
|
|
181
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.ttf) format('truetype'),
|
|
182
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.svg) format('svg');
|
|
183
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
@font-face {
|
|
187
|
+
font-family: 'Roboto Bold';
|
|
188
|
+
font-style: normal;
|
|
189
|
+
font-weight: bold;
|
|
190
|
+
src:
|
|
191
|
+
local('Roboto Bold Bold'),
|
|
192
|
+
local('Roboto Bold-Bold'),
|
|
193
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.woff2) format('woff2'),
|
|
194
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.woff) format('woff'),
|
|
195
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.ttf) format('truetype'),
|
|
196
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.svg) format('svg');
|
|
197
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
@font-face {
|
|
201
|
+
font-family: 'Roboto Bold';
|
|
202
|
+
font-style: italic;
|
|
203
|
+
font-weight: bold;
|
|
204
|
+
src:
|
|
205
|
+
local('Roboto Bold Bold Italic'),
|
|
206
|
+
local('Roboto Bold-BoldItalic'),
|
|
207
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.woff2) format('woff2'),
|
|
208
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.woff) format('woff'),
|
|
209
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.ttf)
|
|
210
|
+
format('truetype'),
|
|
211
|
+
url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.svg) format('svg');
|
|
212
|
+
unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;
|
|
213
|
+
}
|
|
214
|
+
`;
|
|
215
|
+
export const ThumbIconContainer = styled.div`
|
|
216
|
+
position: relative;
|
|
217
|
+
width: 100%;
|
|
218
|
+
height: 100%;
|
|
219
|
+
display: flex;
|
|
220
|
+
flex-direction: row;
|
|
221
|
+
justify-content: center;
|
|
222
|
+
align-items: center;
|
|
223
|
+
`;
|
|
224
|
+
export const ThumbIcon = styled(motion.i).attrs(_ref11 => {
|
|
225
|
+
let {
|
|
226
|
+
icon
|
|
227
|
+
} = _ref11;
|
|
228
|
+
return {
|
|
229
|
+
className: `react-chayns-icon ${icon}`
|
|
230
|
+
};
|
|
231
|
+
})`
|
|
232
|
+
font-size: 22px;
|
|
233
|
+
z-index: 1;
|
|
234
|
+
color: black;
|
|
235
|
+
padding: 5px;
|
|
236
|
+
`;
|
|
237
|
+
export const createThumbVariants = _ref12 => {
|
|
238
|
+
let {
|
|
239
|
+
thumbSize,
|
|
240
|
+
trackWidth,
|
|
241
|
+
scaleFactor
|
|
242
|
+
} = _ref12;
|
|
243
|
+
return {
|
|
244
|
+
base: {
|
|
245
|
+
x: 0,
|
|
246
|
+
backgroundColor: 'white',
|
|
247
|
+
transition: {
|
|
248
|
+
duration: 0.2
|
|
249
|
+
}
|
|
250
|
+
},
|
|
251
|
+
completed: {
|
|
252
|
+
x: (trackWidth - thumbSize * scaleFactor) / 2,
|
|
253
|
+
backgroundColor: 'transparent',
|
|
254
|
+
boxShadow: 'none',
|
|
255
|
+
transition: {
|
|
256
|
+
duration: 0.3
|
|
257
|
+
}
|
|
258
|
+
},
|
|
259
|
+
leaving: {
|
|
260
|
+
scale: [1, 2.4, 1],
|
|
261
|
+
boxShadow: 'none'
|
|
262
|
+
}
|
|
263
|
+
};
|
|
264
|
+
};
|
|
265
|
+
export const THUMB_ICON_VARIANTS = {
|
|
266
|
+
base: {
|
|
267
|
+
x: [0, 8, 0, 8, 0],
|
|
268
|
+
transition: {
|
|
269
|
+
duration: 1,
|
|
270
|
+
ease: 'easeInOut',
|
|
271
|
+
repeat: Infinity,
|
|
272
|
+
repeatDelay: 5
|
|
273
|
+
}
|
|
274
|
+
},
|
|
275
|
+
dragging: {
|
|
276
|
+
x: 0
|
|
277
|
+
},
|
|
278
|
+
completed: {
|
|
279
|
+
opacity: 1,
|
|
280
|
+
transition: {
|
|
281
|
+
duration: 0
|
|
282
|
+
}
|
|
283
|
+
},
|
|
284
|
+
leaving: {
|
|
285
|
+
opacity: 1,
|
|
286
|
+
scale: [1, 2.4, 1],
|
|
287
|
+
transition: {
|
|
288
|
+
duration: 0.4,
|
|
289
|
+
ease: 'easeInOut'
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
};
|
|
293
|
+
//# sourceMappingURL=Slider.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Slider.styles.js","names":["motion","styled","Container","div","Track","_ref","$height","_ref2","_ref3","$backgroundColor","TrackBackground","_ref4","Thumb","_ref5","$size","_ref6","_ref7","$trackHeight","_ref8","TrackText","_ref9","$baseFontSize","_ref10","$color","ThumbIconContainer","ThumbIcon","i","attrs","_ref11","icon","className","createThumbVariants","_ref12","thumbSize","trackWidth","scaleFactor","base","x","backgroundColor","transition","duration","completed","boxShadow","leaving","scale","THUMB_ICON_VARIANTS","ease","repeat","Infinity","repeatDelay","dragging","opacity"],"sources":["../../../../src/components/slider/Slider.styles.ts"],"sourcesContent":["import { motion, Variant, Variants } from 'framer-motion';\nimport styled from 'styled-components';\n\ninterface IBaseVariant extends Variants {\n base: Variant;\n}\n\ninterface IDraggingVariant extends Variants {\n dragging: Variant;\n}\n\ninterface ICompletedVariant extends Variants {\n completed: Variant;\n}\n\ninterface ILeavingVariant extends Variants {\n leaving: Variant;\n}\n\nexport const Container = styled(motion.div)``;\n\nexport type TrackProps = {\n $height: number;\n $borderSize: number;\n $backgroundColor: string;\n};\n\nexport const Track = styled(motion.div)<TrackProps>`\n user-select: none;\n position: relative;\n z-index: 3;\n height: ${({ $height }) => $height}px;\n border-radius: ${({ $height }) => $height / 2}px;\n background-color: ${({ $backgroundColor }) => $backgroundColor};\n`;\n\nexport const TrackBackground = styled(motion.div)<{ $height: number }>`\n position: absolute;\n width: 100%;\n height: 100%;\n border-radius: ${({ $height }) => $height / 2}px;\n z-index: 2;\n`;\n\nexport const Thumb = styled(motion.div)<{\n $size: number;\n $trackHeight: number;\n}>`\n height: ${({ $size }) => $size}px;\n width: ${({ $size }) => $size}px;\n border-radius: 50%;\n background-color: white;\n left: ${({ $size, $trackHeight }) => ($trackHeight - $size - 2) / 2}px;\n bottom: ${({ $size, $trackHeight }) => ($trackHeight - $size - 2) / 2 + 1}px;\n position: absolute;\n z-index: 3;\n box-shadow: rgba(0, 0, 0, 0.2) 1px 1px 2px 0;\n`;\n\nexport const TrackText = styled(motion.div)<{ $color: string; $baseFontSize: number }>`\n position: absolute;\n line-height: 1.15;\n font-size: ${({ $baseFontSize }) => $baseFontSize}px;\n font-weight: 700;\n color: ${({ $color }) => $color};\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n white-space: nowrap;\n text-overflow: ellipsis;\n z-index: 1;\n font-family:\n Roboto Regular,\n sans-serif;\n\n @font-face {\n font-family: 'Roboto Regular';\n font-style: normal;\n font-weight: normal;\n src:\n local('Roboto Regular'),\n local('Roboto Regular'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.ttf)\n format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Regular.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Regular';\n font-style: italic;\n font-weight: normal;\n src:\n local('Roboto Regular Italic'),\n local('Roboto Regular-Italic'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.ttf) format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Italic.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Regular';\n font-style: normal;\n font-weight: bold;\n src:\n local('Roboto Regular Bold'),\n local('Roboto Regular-Bold'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.ttf) format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/Bold.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Regular';\n font-style: italic;\n font-weight: bold;\n src:\n local('Roboto Regular Bold Italic'),\n local('Roboto Regular-BoldItalic'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.woff2)\n format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.woff)\n format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.ttf)\n format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Regular/ItalicBold.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Bold';\n font-style: normal;\n font-weight: normal;\n src:\n local('Roboto Bold'),\n local('Roboto Bold'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.ttf) format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Regular.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Bold';\n font-style: italic;\n font-weight: normal;\n src:\n local('Roboto Bold Italic'),\n local('Roboto Bold-Italic'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.ttf) format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Italic.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Bold';\n font-style: normal;\n font-weight: bold;\n src:\n local('Roboto Bold Bold'),\n local('Roboto Bold-Bold'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.ttf) format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/Bold.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n\n @font-face {\n font-family: 'Roboto Bold';\n font-style: italic;\n font-weight: bold;\n src:\n local('Roboto Bold Bold Italic'),\n local('Roboto Bold-BoldItalic'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.woff2) format('woff2'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.woff) format('woff'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.ttf)\n format('truetype'),\n url(https://api.chayns-static.space/font/Roboto%20Bold/ItalicBold.svg) format('svg');\n unicode-range: U+0020-00FF, U+20A0-20CF, U+2122, U+2000-206F;\n }\n`;\n\nexport const ThumbIconContainer = styled.div`\n position: relative;\n width: 100%;\n height: 100%;\n display: flex;\n flex-direction: row;\n justify-content: center;\n align-items: center;\n`;\n\nexport const ThumbIcon = styled(motion.i).attrs<{ icon: string }>(({ icon }) => ({\n className: `react-chayns-icon ${icon}`,\n}))`\n font-size: 22px;\n z-index: 1;\n color: black;\n padding: 5px;\n`;\n\nexport type CreateThumbVariantsArgs = {\n trackWidth: number;\n thumbSize: number;\n scaleFactor: number;\n};\n\nexport const createThumbVariants = ({\n thumbSize,\n trackWidth,\n scaleFactor,\n}: CreateThumbVariantsArgs): IBaseVariant & ICompletedVariant & ILeavingVariant => ({\n base: {\n x: 0,\n backgroundColor: 'white',\n transition: { duration: 0.2 },\n },\n completed: {\n x: (trackWidth - thumbSize * scaleFactor) / 2,\n backgroundColor: 'transparent',\n boxShadow: 'none',\n transition: { duration: 0.3 },\n },\n leaving: {\n scale: [1, 2.4, 1],\n boxShadow: 'none',\n },\n});\n\nexport const THUMB_ICON_VARIANTS: IBaseVariant &\n IDraggingVariant &\n ICompletedVariant &\n ILeavingVariant = {\n base: {\n x: [0, 8, 0, 8, 0],\n transition: {\n duration: 1,\n ease: 'easeInOut',\n repeat: Infinity,\n repeatDelay: 5,\n },\n },\n dragging: {\n x: 0,\n },\n completed: {\n opacity: 1,\n transition: { duration: 0 },\n },\n leaving: {\n opacity: 1,\n scale: [1, 2.4, 1],\n transition: { duration: 0.4, ease: 'easeInOut' },\n },\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAA2B,eAAe;AACzD,OAAOC,MAAM,MAAM,mBAAmB;AAkBtC,OAAO,MAAMC,SAAS,GAAGD,MAAM,CAACD,MAAM,CAACG,GAAG,CAAC,EAAE;AAQ7C,OAAO,MAAMC,KAAK,GAAGH,MAAM,CAACD,MAAM,CAACG,GAAG,CAAa;AACnD;AACA;AACA;AACA,cAAcE,IAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,IAAA;EAAA,OAAKC,OAAO;AAAA;AACtC,qBAAqBC,KAAA;EAAA,IAAC;IAAED;EAAQ,CAAC,GAAAC,KAAA;EAAA,OAAKD,OAAO,GAAG,CAAC;AAAA;AACjD,wBAAwBE,KAAA;EAAA,IAAC;IAAEC;EAAiB,CAAC,GAAAD,KAAA;EAAA,OAAKC,gBAAgB;AAAA;AAClE,CAAC;AAED,OAAO,MAAMC,eAAe,GAAGT,MAAM,CAACD,MAAM,CAACG,GAAG,CAAsB;AACtE;AACA;AACA;AACA,qBAAqBQ,KAAA;EAAA,IAAC;IAAEL;EAAQ,CAAC,GAAAK,KAAA;EAAA,OAAKL,OAAO,GAAG,CAAC;AAAA;AACjD;AACA,CAAC;AAED,OAAO,MAAMM,KAAK,GAAGX,MAAM,CAACD,MAAM,CAACG,GAAG,CAGpC;AACF,cAAcU,KAAA;EAAA,IAAC;IAAEC;EAAM,CAAC,GAAAD,KAAA;EAAA,OAAKC,KAAK;AAAA;AAClC,aAAaC,KAAA;EAAA,IAAC;IAAED;EAAM,CAAC,GAAAC,KAAA;EAAA,OAAKD,KAAK;AAAA;AACjC;AACA;AACA,YAAYE,KAAA;EAAA,IAAC;IAAEF,KAAK;IAAEG;EAAa,CAAC,GAAAD,KAAA;EAAA,OAAK,CAACC,YAAY,GAAGH,KAAK,GAAG,CAAC,IAAI,CAAC;AAAA;AACvE,cAAcI,KAAA;EAAA,IAAC;IAAEJ,KAAK;IAAEG;EAAa,CAAC,GAAAC,KAAA;EAAA,OAAK,CAACD,YAAY,GAAGH,KAAK,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC;AAAA;AAC7E;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMK,SAAS,GAAGlB,MAAM,CAACD,MAAM,CAACG,GAAG,CAA4C;AACtF;AACA;AACA,iBAAiBiB,KAAA;EAAA,IAAC;IAAEC;EAAc,CAAC,GAAAD,KAAA;EAAA,OAAKC,aAAa;AAAA;AACrD;AACA,aAAaC,MAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,MAAA;EAAA,OAAKC,MAAM;AAAA;AACnC;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,kBAAkB,GAAGvB,MAAM,CAACE,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMsB,SAAS,GAAGxB,MAAM,CAACD,MAAM,CAAC0B,CAAC,CAAC,CAACC,KAAK,CAAmBC,MAAA;EAAA,IAAC;IAAEC;EAAK,CAAC,GAAAD,MAAA;EAAA,OAAM;IAC7EE,SAAS,EAAE,qBAAqBD,IAAI;EACxC,CAAC;AAAA,CAAC,CAAC;AACH;AACA;AACA;AACA;AACA,CAAC;AAQD,OAAO,MAAME,mBAAmB,GAAGC,MAAA;EAAA,IAAC;IAChCC,SAAS;IACTC,UAAU;IACVC;EACqB,CAAC,GAAAH,MAAA;EAAA,OAA0D;IAChFI,IAAI,EAAE;MACFC,CAAC,EAAE,CAAC;MACJC,eAAe,EAAE,OAAO;MACxBC,UAAU,EAAE;QAAEC,QAAQ,EAAE;MAAI;IAChC,CAAC;IACDC,SAAS,EAAE;MACPJ,CAAC,EAAE,CAACH,UAAU,GAAGD,SAAS,GAAGE,WAAW,IAAI,CAAC;MAC7CG,eAAe,EAAE,aAAa;MAC9BI,SAAS,EAAE,MAAM;MACjBH,UAAU,EAAE;QAAEC,QAAQ,EAAE;MAAI;IAChC,CAAC;IACDG,OAAO,EAAE;MACLC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;MAClBF,SAAS,EAAE;IACf;EACJ,CAAC;AAAA,CAAC;AAEF,OAAO,MAAMG,mBAGM,GAAG;EAClBT,IAAI,EAAE;IACFC,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;IAClBE,UAAU,EAAE;MACRC,QAAQ,EAAE,CAAC;MACXM,IAAI,EAAE,WAAW;MACjBC,MAAM,EAAEC,QAAQ;MAChBC,WAAW,EAAE;IACjB;EACJ,CAAC;EACDC,QAAQ,EAAE;IACNb,CAAC,EAAE;EACP,CAAC;EACDI,SAAS,EAAE;IACPU,OAAO,EAAE,CAAC;IACVZ,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAE;EAC9B,CAAC;EACDG,OAAO,EAAE;IACLQ,OAAO,EAAE,CAAC;IACVP,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IAClBL,UAAU,EAAE;MAAEC,QAAQ,EAAE,GAAG;MAAEM,IAAI,EAAE;IAAY;EACnD;AACJ,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,71 @@
|
|
|
1
|
+
import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
|
|
2
|
+
import { getLanguage, vibrate } from 'chayns-api';
|
|
3
|
+
import { Container, Time } from './Timer.styles';
|
|
4
|
+
import { differenceInHours, differenceInMinutes, getTimeTillNow, intervalToDuration } from "../../utils/date";
|
|
5
|
+
const Timer = _ref => {
|
|
6
|
+
let {
|
|
7
|
+
devalueTime,
|
|
8
|
+
color,
|
|
9
|
+
textColor = 'white'
|
|
10
|
+
} = _ref;
|
|
11
|
+
const {
|
|
12
|
+
active: language
|
|
13
|
+
} = getLanguage();
|
|
14
|
+
const refDate = useRef(new Date());
|
|
15
|
+
const [distance, setDistance] = useState(intervalToDuration({
|
|
16
|
+
start: devalueTime,
|
|
17
|
+
end: new Date()
|
|
18
|
+
}));
|
|
19
|
+
const minutesShowValue = useMemo(() => Math.max(distance.minutes ?? 0, 0).toString(), [distance.minutes]);
|
|
20
|
+
const secondsShowValue = useMemo(() => Math.max(distance.seconds ?? 0, 0).toString(), [distance.seconds]);
|
|
21
|
+
useEffect(() => {
|
|
22
|
+
refDate.current = new Date();
|
|
23
|
+
const interval = setInterval(() => {
|
|
24
|
+
refDate.current = new Date();
|
|
25
|
+
setDistance(intervalToDuration({
|
|
26
|
+
start: devalueTime,
|
|
27
|
+
end: refDate.current
|
|
28
|
+
}));
|
|
29
|
+
}, 500);
|
|
30
|
+
return () => clearInterval(interval);
|
|
31
|
+
}, [devalueTime]);
|
|
32
|
+
const handlePointerDownCapture = useCallback(() => {
|
|
33
|
+
void vibrate({
|
|
34
|
+
pattern: [50],
|
|
35
|
+
iOSFeedbackVibration: 7
|
|
36
|
+
});
|
|
37
|
+
}, []);
|
|
38
|
+
const label = useMemo(() => {
|
|
39
|
+
let text = 'Vor ##SECONDS## Sek. (##TIME## Uhr)';
|
|
40
|
+
if (differenceInHours(refDate.current, devalueTime) > 0) {
|
|
41
|
+
const distanceLabel = getTimeTillNow({
|
|
42
|
+
date: new Date(),
|
|
43
|
+
currentDate: devalueTime,
|
|
44
|
+
language
|
|
45
|
+
});
|
|
46
|
+
text = `${distanceLabel} (##TIME## Uhr)`;
|
|
47
|
+
} else if (differenceInMinutes(refDate.current, devalueTime) > 0) {
|
|
48
|
+
text = 'Vor ##MINUTES## Min. ##SECONDS## Sek. (##TIME## Uhr)';
|
|
49
|
+
}
|
|
50
|
+
const formatTime = (date, formatString) => {
|
|
51
|
+
const hours = date.getHours().toString().padStart(2, '0');
|
|
52
|
+
const minutes = date.getMinutes().toString().padStart(2, '0');
|
|
53
|
+
if (formatString === 'HH:mm') {
|
|
54
|
+
return `${hours}:${minutes}`;
|
|
55
|
+
}
|
|
56
|
+
return '';
|
|
57
|
+
};
|
|
58
|
+
return text.replace('##MINUTES##', minutesShowValue).replace('##SECONDS##', secondsShowValue).replace('##TIME##', formatTime(devalueTime, 'HH:mm'));
|
|
59
|
+
}, [devalueTime, minutesShowValue, secondsShowValue, language]);
|
|
60
|
+
return /*#__PURE__*/React.createElement(Container, {
|
|
61
|
+
$baseFontSize: 17,
|
|
62
|
+
$borderSize: 2,
|
|
63
|
+
$height: 50,
|
|
64
|
+
$color: color,
|
|
65
|
+
$textColor: textColor,
|
|
66
|
+
$backgroundColor: color,
|
|
67
|
+
onPointerDownCapture: handlePointerDownCapture
|
|
68
|
+
}, /*#__PURE__*/React.createElement(Time, null, label));
|
|
69
|
+
};
|
|
70
|
+
export default Timer;
|
|
71
|
+
//# sourceMappingURL=Timer.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Timer.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","getLanguage","vibrate","Container","Time","differenceInHours","differenceInMinutes","getTimeTillNow","intervalToDuration","Timer","_ref","devalueTime","color","textColor","active","language","refDate","Date","distance","setDistance","start","end","minutesShowValue","Math","max","minutes","toString","secondsShowValue","seconds","current","interval","setInterval","clearInterval","handlePointerDownCapture","pattern","iOSFeedbackVibration","label","text","distanceLabel","date","currentDate","formatTime","formatString","hours","getHours","padStart","getMinutes","replace","createElement","$baseFontSize","$borderSize","$height","$color","$textColor","$backgroundColor","onPointerDownCapture"],"sources":["../../../../src/components/timer/Timer.tsx"],"sourcesContent":["\nimport React, { FunctionComponent, useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport {getLanguage, vibrate} from 'chayns-api';\n\nimport { Container, Time } from './Timer.styles';\nimport {\n differenceInHours,\n differenceInMinutes,\n getTimeTillNow,\n intervalToDuration\n} from \"../../utils/date\";\n\nexport type TimerProps = {\n color: string;\n devalueTime: Date;\n textColor?: string;\n};\n\nconst Timer: FunctionComponent<TimerProps> = ({ devalueTime, color, textColor = 'white' }) => {\n const {active:language } = getLanguage()\n\n const refDate = useRef(new Date());\n const [distance, setDistance] = useState(\n intervalToDuration({\n start: devalueTime,\n end: new Date(),\n }),\n );\n const minutesShowValue = useMemo(\n () => Math.max(distance.minutes ?? 0, 0).toString(),\n [distance.minutes],\n );\n const secondsShowValue = useMemo(\n () => Math.max(distance.seconds ?? 0, 0).toString(),\n [distance.seconds],\n );\n\n useEffect(() => {\n refDate.current = new Date();\n const interval = setInterval(() => {\n refDate.current = new Date();\n setDistance(\n intervalToDuration({\n start: devalueTime,\n end: refDate.current,\n }),\n );\n }, 500);\n return () => clearInterval(interval);\n }, [devalueTime]);\n\n const handlePointerDownCapture = useCallback(() => {\n void vibrate({ pattern: [50], iOSFeedbackVibration: 7 });\n }, []);\n\n const label = useMemo(() => {\n let text = 'Vor ##SECONDS## Sek. (##TIME## Uhr)';\n if (differenceInHours(refDate.current, devalueTime) > 0) {\n const distanceLabel =\n getTimeTillNow({date: new Date(), currentDate: devalueTime, language});\n text = `${distanceLabel} (##TIME## Uhr)`;\n } else if (differenceInMinutes(refDate.current, devalueTime) > 0) {\n text = 'Vor ##MINUTES## Min. ##SECONDS## Sek. (##TIME## Uhr)';\n }\n\n const formatTime = (date: Date, formatString: string): string => {\n const hours = date.getHours().toString().padStart(2, '0');\n const minutes = date.getMinutes().toString().padStart(2, '0');\n\n if (formatString === 'HH:mm') {\n return `${hours}:${minutes}`;\n }\n return '';\n };\n\n return text\n .replace('##MINUTES##', minutesShowValue)\n .replace('##SECONDS##', secondsShowValue)\n .replace('##TIME##', formatTime(devalueTime, 'HH:mm'));\n }, [devalueTime, minutesShowValue, secondsShowValue, language]);\n\n return (\n <Container\n $baseFontSize={17}\n $borderSize={2}\n $height={50}\n $color={color}\n $textColor={textColor}\n $backgroundColor={color}\n onPointerDownCapture={handlePointerDownCapture}\n >\n <Time>{label}</Time>\n </Container>\n );\n};\n\nexport default Timer;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import styled from 'styled-components';
|
|
2
|
+
import { Track } from '../slider/Slider.styles';
|
|
3
|
+
export const Container = styled(Track)`
|
|
4
|
+
height: ${_ref => {
|
|
5
|
+
let {
|
|
6
|
+
$height
|
|
7
|
+
} = _ref;
|
|
8
|
+
return $height;
|
|
9
|
+
}}px !important;
|
|
10
|
+
background-color: ${_ref2 => {
|
|
11
|
+
let {
|
|
12
|
+
$color
|
|
13
|
+
} = _ref2;
|
|
14
|
+
return $color;
|
|
15
|
+
}};
|
|
16
|
+
display: flex;
|
|
17
|
+
flex-direction: row;
|
|
18
|
+
align-items: center;
|
|
19
|
+
justify-content: center;
|
|
20
|
+
cursor: pointer;
|
|
21
|
+
color: white;
|
|
22
|
+
container-type: inline-size;
|
|
23
|
+
`;
|
|
24
|
+
export const Time = styled.div`
|
|
25
|
+
font-size: 6cqw;
|
|
26
|
+
font-weight: 700;
|
|
27
|
+
color: white;
|
|
28
|
+
`;
|
|
29
|
+
//# sourceMappingURL=Timer.styles.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Timer.styles.js","names":["styled","Track","Container","_ref","$height","_ref2","$color","Time","div"],"sources":["../../../../src/components/timer/Timer.styles.ts"],"sourcesContent":["import styled from 'styled-components';\nimport { Track } from '../slider/Slider.styles';\n\nexport const Container = styled(Track)<{\n $color: string;\n $textColor: string;\n $baseFontSize: number;\n}>`\n height: ${({ $height }) => $height}px !important;\n background-color: ${({ $color }) => $color};\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n color: white;\n container-type: inline-size;\n`;\n\nexport const Time = styled.div`\n font-size: 6cqw;\n font-weight: 700;\n color: white;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,KAAK,QAAQ,yBAAyB;AAE/C,OAAO,MAAMC,SAAS,GAAGF,MAAM,CAACC,KAAK,CAInC;AACF,cAAcE,IAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,IAAA;EAAA,OAAKC,OAAO;AAAA;AACtC,wBAAwBC,KAAA;EAAA,IAAC;IAAEC;EAAO,CAAC,GAAAD,KAAA;EAAA,OAAKC,MAAM;AAAA;AAC9C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,IAAI,GAAGP,MAAM,CAACQ,GAAG;AAC9B;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { useTransform } from 'framer-motion';
|
|
2
|
+
import { useEffect, useMemo, useState } from 'react';
|
|
3
|
+
export const useThumbIcon = (x, iconColor) => {
|
|
4
|
+
const [icon, setIcon] = useState('fas fa-arrow-right');
|
|
5
|
+
const opacity = useTransform(x, [0, 5, 6, 200], [1, 0, 0, 1]);
|
|
6
|
+
const styles = useMemo(() => ({
|
|
7
|
+
opacity,
|
|
8
|
+
color: iconColor
|
|
9
|
+
}), [iconColor, opacity]);
|
|
10
|
+
useEffect(() => x.on('change', value => {
|
|
11
|
+
if (value > 5) {
|
|
12
|
+
setIcon('fas fa-check');
|
|
13
|
+
} else {
|
|
14
|
+
setIcon('fas fa-arrow-right');
|
|
15
|
+
}
|
|
16
|
+
}), [x]);
|
|
17
|
+
return useMemo(() => ({
|
|
18
|
+
icon,
|
|
19
|
+
styles
|
|
20
|
+
}), [icon, styles]);
|
|
21
|
+
};
|
|
22
|
+
//# sourceMappingURL=design.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"design.js","names":["useTransform","useEffect","useMemo","useState","useThumbIcon","x","iconColor","icon","setIcon","opacity","styles","color","on","value"],"sources":["../../../src/hooks/design.ts"],"sourcesContent":["import { MotionStyle, MotionValue, useTransform } from 'framer-motion';\nimport { useEffect, useMemo, useState } from 'react';\n\nexport type UseThumbIconRes = {\n icon: string;\n styles: MotionStyle;\n};\nexport const useThumbIcon = (x: MotionValue<number>, iconColor: string): UseThumbIconRes => {\n const [icon, setIcon] = useState('fas fa-arrow-right');\n const opacity = useTransform(x, [0, 5, 6, 200], [1, 0, 0, 1]);\n const styles = useMemo<MotionStyle>(\n () => ({\n opacity,\n color: iconColor,\n }),\n [iconColor, opacity],\n );\n\n useEffect(\n () =>\n x.on('change', (value) => {\n if (value > 5) {\n setIcon('fas fa-check');\n } else {\n setIcon('fas fa-arrow-right');\n }\n }),\n [x],\n );\n\n return useMemo(() => ({ icon, styles }), [icon, styles]);\n};\n"],"mappings":"AAAA,SAAmCA,YAAY,QAAQ,eAAe;AACtE,SAASC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AAMpD,OAAO,MAAMC,YAAY,GAAGA,CAACC,CAAsB,EAAEC,SAAiB,KAAsB;EACxF,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAGL,QAAQ,CAAC,oBAAoB,CAAC;EACtD,MAAMM,OAAO,GAAGT,YAAY,CAACK,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;EAC7D,MAAMK,MAAM,GAAGR,OAAO,CAClB,OAAO;IACHO,OAAO;IACPE,KAAK,EAAEL;EACX,CAAC,CAAC,EACF,CAACA,SAAS,EAAEG,OAAO,CACvB,CAAC;EAEDR,SAAS,CACL,MACII,CAAC,CAACO,EAAE,CAAC,QAAQ,EAAGC,KAAK,IAAK;IACtB,IAAIA,KAAK,GAAG,CAAC,EAAE;MACXL,OAAO,CAAC,cAAc,CAAC;IAC3B,CAAC,MAAM;MACHA,OAAO,CAAC,oBAAoB,CAAC;IACjC;EACJ,CAAC,CAAC,EACN,CAACH,CAAC,CACN,CAAC;EAED,OAAOH,OAAO,CAAC,OAAO;IAAEK,IAAI;IAAEG;EAAO,CAAC,CAAC,EAAE,CAACH,IAAI,EAAEG,MAAM,CAAC,CAAC;AAC5D,CAAC","ignoreList":[]}
|
package/lib/esm/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["default","DevalueSlider"],"sources":["../../src/index.ts"],"sourcesContent":["export {\n default as DevalueSlider,\n type DevalueSliderOnChangeHandler,\n type DevalueSliderOnCompleteHandler,\n type DevalueSliderOnDevalueHandler,\n type DevalueSliderOnDevalueHandlerResult,\n type DevalueSliderProps,\n} from './components/DevalueSlider';\n"],"mappings":"AAAA,SACIA,OAAO,IAAIC,aAAa,QAMrB,4BAA4B","ignoreList":[]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"common.js","names":["sleep","ms","Promise","resolve","setTimeout"],"sources":["../../../src/utils/common.ts"],"sourcesContent":["export const sleep = (ms: number) =>\n new Promise((resolve) => {\n setTimeout(resolve, ms);\n });\n"],"mappings":"AAAA,OAAO,MAAMA,KAAK,GAAIC,EAAU,IAC5B,IAAIC,OAAO,CAAEC,OAAO,IAAK;EACrBC,UAAU,CAACD,OAAO,EAAEF,EAAE,CAAC;AAC3B,CAAC,CAAC","ignoreList":[]}
|
|
@@ -0,0 +1,80 @@
|
|
|
1
|
+
import { Language } from "chayns-api";
|
|
2
|
+
export const addSeconds = (date, seconds) => {
|
|
3
|
+
const result = new Date(date);
|
|
4
|
+
result.setSeconds(date.getSeconds() + seconds);
|
|
5
|
+
return result;
|
|
6
|
+
};
|
|
7
|
+
export const subHours = (date, hours) => {
|
|
8
|
+
const result = new Date(date);
|
|
9
|
+
result.setHours(date.getHours() - hours);
|
|
10
|
+
return result;
|
|
11
|
+
};
|
|
12
|
+
export const differenceInHours = (date1, date2) => {
|
|
13
|
+
const diffInMilliseconds = date1.getTime() - date2.getTime();
|
|
14
|
+
return Math.floor(diffInMilliseconds / (1000 * 60 * 60)); // Millisekunden in Stunden umrechnen
|
|
15
|
+
};
|
|
16
|
+
export const getTimeTillNow = _ref => {
|
|
17
|
+
let {
|
|
18
|
+
date,
|
|
19
|
+
currentDate,
|
|
20
|
+
language = Language.English
|
|
21
|
+
} = _ref;
|
|
22
|
+
const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);
|
|
23
|
+
const isPast = diffInSeconds > 0;
|
|
24
|
+
const units = [{
|
|
25
|
+
label: 'year',
|
|
26
|
+
seconds: 31536000
|
|
27
|
+
}, {
|
|
28
|
+
label: 'month',
|
|
29
|
+
seconds: 2592000
|
|
30
|
+
}, {
|
|
31
|
+
label: 'day',
|
|
32
|
+
seconds: 86400
|
|
33
|
+
}, {
|
|
34
|
+
label: 'hour',
|
|
35
|
+
seconds: 3600
|
|
36
|
+
}, {
|
|
37
|
+
label: 'minute',
|
|
38
|
+
seconds: 60
|
|
39
|
+
}, {
|
|
40
|
+
label: 'second',
|
|
41
|
+
seconds: 1
|
|
42
|
+
}];
|
|
43
|
+
const absDiff = Math.abs(diffInSeconds);
|
|
44
|
+
const {
|
|
45
|
+
label,
|
|
46
|
+
seconds
|
|
47
|
+
} = units.find(u => absDiff >= u.seconds) || {
|
|
48
|
+
label: 'second',
|
|
49
|
+
seconds: 1
|
|
50
|
+
};
|
|
51
|
+
const count = Math.floor(absDiff / seconds);
|
|
52
|
+
const formatter = new Intl.RelativeTimeFormat(language, {
|
|
53
|
+
numeric: 'auto'
|
|
54
|
+
});
|
|
55
|
+
return formatter.format(isPast ? -count : count, label);
|
|
56
|
+
};
|
|
57
|
+
export const intervalToDuration = interval => {
|
|
58
|
+
const startTime = interval.start.getTime();
|
|
59
|
+
const endTime = interval.end.getTime();
|
|
60
|
+
const diffInMilliseconds = endTime - startTime;
|
|
61
|
+
const years = Math.floor(diffInMilliseconds / (1000 * 60 * 60 * 24 * 365.25));
|
|
62
|
+
const months = Math.floor(diffInMilliseconds % (1000 * 60 * 60 * 24 * 365.25) / (1000 * 60 * 60 * 24 * 30));
|
|
63
|
+
const days = Math.floor(diffInMilliseconds % (1000 * 60 * 60 * 24 * 30) / (1000 * 60 * 60 * 24));
|
|
64
|
+
const hours = Math.floor(diffInMilliseconds % (1000 * 60 * 60 * 24) / (1000 * 60 * 60));
|
|
65
|
+
const minutes = Math.floor(diffInMilliseconds % (1000 * 60 * 60) / (1000 * 60));
|
|
66
|
+
const seconds = Math.floor(diffInMilliseconds % (1000 * 60) / 1000);
|
|
67
|
+
return {
|
|
68
|
+
years,
|
|
69
|
+
months,
|
|
70
|
+
days,
|
|
71
|
+
hours,
|
|
72
|
+
minutes,
|
|
73
|
+
seconds
|
|
74
|
+
};
|
|
75
|
+
};
|
|
76
|
+
export const differenceInMinutes = (date1, date2) => {
|
|
77
|
+
const diffInMilliseconds = date1.getTime() - date2.getTime();
|
|
78
|
+
return Math.floor(diffInMilliseconds / (1000 * 60)); // Millisekunden in Minuten umrechnen
|
|
79
|
+
};
|
|
80
|
+
//# sourceMappingURL=date.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"date.js","names":["Language","addSeconds","date","seconds","result","Date","setSeconds","getSeconds","subHours","hours","setHours","getHours","differenceInHours","date1","date2","diffInMilliseconds","getTime","Math","floor","getTimeTillNow","_ref","currentDate","language","English","diffInSeconds","isPast","units","label","absDiff","abs","find","u","count","formatter","Intl","RelativeTimeFormat","numeric","format","intervalToDuration","interval","startTime","start","endTime","end","years","months","days","minutes","differenceInMinutes"],"sources":["../../../src/utils/date.ts"],"sourcesContent":["import {Language} from \"chayns-api\";\n\nexport const addSeconds = (date: Date, seconds: number): Date => {\n const result = new Date(date);\n result.setSeconds(date.getSeconds() + seconds);\n return result;\n};\n\nexport const subHours = (date: Date, hours: number): Date => {\n const result = new Date(date);\n result.setHours(date.getHours() - hours);\n return result;\n};\n\nexport const differenceInHours = (date1: Date, date2: Date): number => {\n const diffInMilliseconds = date1.getTime() - date2.getTime();\n return Math.floor(diffInMilliseconds / (1000 * 60 * 60)); // Millisekunden in Stunden umrechnen\n};\n\ninterface GetTimeTillNow {\n date: Date;\n currentDate: Date;\n language: Language;\n}\n\ntype RelativeTimeUnit = 'year' | 'month' | 'day' | 'hour' | 'minute' | 'second';\n\nexport const getTimeTillNow = ({\n date,\n currentDate,\n language = Language.English,\n }: GetTimeTillNow): string => {\n const diffInSeconds = Math.floor((currentDate.getTime() - date.getTime()) / 1000);\n const isPast = diffInSeconds > 0;\n\n const units: { label: RelativeTimeUnit; seconds: number }[] = [\n {label: 'year', seconds: 31536000},\n {label: 'month', seconds: 2592000},\n {label: 'day', seconds: 86400},\n {label: 'hour', seconds: 3600},\n {label: 'minute', seconds: 60},\n {label: 'second', seconds: 1},\n ];\n\n const absDiff = Math.abs(diffInSeconds);\n const {label, seconds} = units.find((u) => absDiff >= u.seconds) || {\n label: 'second',\n seconds: 1,\n };\n const count = Math.floor(absDiff / seconds);\n\n const formatter = new Intl.RelativeTimeFormat(language, {numeric: 'auto'});\n\n return formatter.format(isPast ? -count : count, label);\n};\n\nexport const intervalToDuration = (interval: { start: Date, end: Date }): { years: number, months: number, days: number, hours: number, minutes: number, seconds: number } => {\n const startTime = interval.start.getTime();\n const endTime = interval.end.getTime();\n const diffInMilliseconds = endTime - startTime;\n\n const years = Math.floor(diffInMilliseconds / (1000 * 60 * 60 * 24 * 365.25));\n const months = Math.floor((diffInMilliseconds % (1000 * 60 * 60 * 24 * 365.25)) / (1000 * 60 * 60 * 24 * 30));\n const days = Math.floor((diffInMilliseconds % (1000 * 60 * 60 * 24 * 30)) / (1000 * 60 * 60 * 24));\n const hours = Math.floor((diffInMilliseconds % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));\n const minutes = Math.floor((diffInMilliseconds % (1000 * 60 * 60)) / (1000 * 60));\n const seconds = Math.floor((diffInMilliseconds % (1000 * 60)) / 1000);\n\n return { years, months, days, hours, minutes, seconds };\n};\n\nexport const differenceInMinutes = (date1: Date, date2: Date): number => {\n const diffInMilliseconds = date1.getTime() - date2.getTime();\n return Math.floor(diffInMilliseconds / (1000 * 60)); // Millisekunden in Minuten umrechnen\n};\n"],"mappings":"AAAA,SAAQA,QAAQ,QAAO,YAAY;AAEnC,OAAO,MAAMC,UAAU,GAAGA,CAACC,IAAU,EAAEC,OAAe,KAAW;EAC7D,MAAMC,MAAM,GAAG,IAAIC,IAAI,CAACH,IAAI,CAAC;EAC7BE,MAAM,CAACE,UAAU,CAACJ,IAAI,CAACK,UAAU,CAAC,CAAC,GAAGJ,OAAO,CAAC;EAC9C,OAAOC,MAAM;AACjB,CAAC;AAED,OAAO,MAAMI,QAAQ,GAAGA,CAACN,IAAU,EAAEO,KAAa,KAAW;EACzD,MAAML,MAAM,GAAG,IAAIC,IAAI,CAACH,IAAI,CAAC;EAC7BE,MAAM,CAACM,QAAQ,CAACR,IAAI,CAACS,QAAQ,CAAC,CAAC,GAAGF,KAAK,CAAC;EACxC,OAAOL,MAAM;AACjB,CAAC;AAED,OAAO,MAAMQ,iBAAiB,GAAGA,CAACC,KAAW,EAAEC,KAAW,KAAa;EACnE,MAAMC,kBAAkB,GAAGF,KAAK,CAACG,OAAO,CAAC,CAAC,GAAGF,KAAK,CAACE,OAAO,CAAC,CAAC;EAC5D,OAAOC,IAAI,CAACC,KAAK,CAACH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AAC9D,CAAC;AAUD,OAAO,MAAMI,cAAc,GAAGC,IAAA,IAI+B;EAAA,IAJ9B;IACIlB,IAAI;IACJmB,WAAW;IACXC,QAAQ,GAAGtB,QAAQ,CAACuB;EACR,CAAC,GAAAH,IAAA;EAC5C,MAAMI,aAAa,GAAGP,IAAI,CAACC,KAAK,CAAC,CAACG,WAAW,CAACL,OAAO,CAAC,CAAC,GAAGd,IAAI,CAACc,OAAO,CAAC,CAAC,IAAI,IAAI,CAAC;EACjF,MAAMS,MAAM,GAAGD,aAAa,GAAG,CAAC;EAEhC,MAAME,KAAqD,GAAG,CAC1D;IAACC,KAAK,EAAE,MAAM;IAAExB,OAAO,EAAE;EAAQ,CAAC,EAClC;IAACwB,KAAK,EAAE,OAAO;IAAExB,OAAO,EAAE;EAAO,CAAC,EAClC;IAACwB,KAAK,EAAE,KAAK;IAAExB,OAAO,EAAE;EAAK,CAAC,EAC9B;IAACwB,KAAK,EAAE,MAAM;IAAExB,OAAO,EAAE;EAAI,CAAC,EAC9B;IAACwB,KAAK,EAAE,QAAQ;IAAExB,OAAO,EAAE;EAAE,CAAC,EAC9B;IAACwB,KAAK,EAAE,QAAQ;IAAExB,OAAO,EAAE;EAAC,CAAC,CAChC;EAED,MAAMyB,OAAO,GAAGX,IAAI,CAACY,GAAG,CAACL,aAAa,CAAC;EACvC,MAAM;IAACG,KAAK;IAAExB;EAAO,CAAC,GAAGuB,KAAK,CAACI,IAAI,CAAEC,CAAC,IAAKH,OAAO,IAAIG,CAAC,CAAC5B,OAAO,CAAC,IAAI;IAChEwB,KAAK,EAAE,QAAQ;IACfxB,OAAO,EAAE;EACb,CAAC;EACD,MAAM6B,KAAK,GAAGf,IAAI,CAACC,KAAK,CAACU,OAAO,GAAGzB,OAAO,CAAC;EAE3C,MAAM8B,SAAS,GAAG,IAAIC,IAAI,CAACC,kBAAkB,CAACb,QAAQ,EAAE;IAACc,OAAO,EAAE;EAAM,CAAC,CAAC;EAE1E,OAAOH,SAAS,CAACI,MAAM,CAACZ,MAAM,GAAG,CAACO,KAAK,GAAGA,KAAK,EAAEL,KAAK,CAAC;AAC3D,CAAC;AAED,OAAO,MAAMW,kBAAkB,GAAIC,QAAoC,IAAuG;EAC1K,MAAMC,SAAS,GAAGD,QAAQ,CAACE,KAAK,CAACzB,OAAO,CAAC,CAAC;EAC1C,MAAM0B,OAAO,GAAGH,QAAQ,CAACI,GAAG,CAAC3B,OAAO,CAAC,CAAC;EACtC,MAAMD,kBAAkB,GAAG2B,OAAO,GAAGF,SAAS;EAE9C,MAAMI,KAAK,GAAG3B,IAAI,CAACC,KAAK,CAACH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,CAAC;EAC7E,MAAM8B,MAAM,GAAG5B,IAAI,CAACC,KAAK,CAAEH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,MAAM,CAAC,IAAK,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;EAC7G,MAAM+B,IAAI,GAAG7B,IAAI,CAACC,KAAK,CAAEH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,IAAK,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;EAClG,MAAMN,KAAK,GAAGQ,IAAI,CAACC,KAAK,CAAEH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,IAAK,IAAI,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;EACzF,MAAMgC,OAAO,GAAG9B,IAAI,CAACC,KAAK,CAAEH,kBAAkB,IAAI,IAAI,GAAG,EAAE,GAAG,EAAE,CAAC,IAAK,IAAI,GAAG,EAAE,CAAC,CAAC;EACjF,MAAMZ,OAAO,GAAGc,IAAI,CAACC,KAAK,CAAEH,kBAAkB,IAAI,IAAI,GAAG,EAAE,CAAC,GAAI,IAAI,CAAC;EAErE,OAAO;IAAE6B,KAAK;IAAEC,MAAM;IAAEC,IAAI;IAAErC,KAAK;IAAEsC,OAAO;IAAE5C;EAAQ,CAAC;AAC3D,CAAC;AAED,OAAO,MAAM6C,mBAAmB,GAAGA,CAACnC,KAAW,EAAEC,KAAW,KAAa;EACrE,MAAMC,kBAAkB,GAAGF,KAAK,CAACG,OAAO,CAAC,CAAC,GAAGF,KAAK,CAACE,OAAO,CAAC,CAAC;EAC5D,OAAOC,IAAI,CAACC,KAAK,CAACH,kBAAkB,IAAI,IAAI,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;AACzD,CAAC","ignoreList":[]}
|