@chayns-components/devalue-slider 5.0.0-beta.734

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.
Files changed (43) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +18 -0
  3. package/lib/cjs/components/DevalueSlider.js +57 -0
  4. package/lib/cjs/components/DevalueSlider.js.map +1 -0
  5. package/lib/cjs/components/slider/Slider.js +207 -0
  6. package/lib/cjs/components/slider/Slider.js.map +1 -0
  7. package/lib/cjs/components/slider/Slider.styles.js +265 -0
  8. package/lib/cjs/components/slider/Slider.styles.js.map +1 -0
  9. package/lib/cjs/components/timer/Timer.js +57 -0
  10. package/lib/cjs/components/timer/Timer.js.map +1 -0
  11. package/lib/cjs/components/timer/Timer.styles.js +42 -0
  12. package/lib/cjs/components/timer/Timer.styles.js.map +1 -0
  13. package/lib/cjs/hooks/design.js +29 -0
  14. package/lib/cjs/hooks/design.js.map +1 -0
  15. package/lib/cjs/index.js +14 -0
  16. package/lib/cjs/index.js.map +1 -0
  17. package/lib/cjs/utils/common.js +11 -0
  18. package/lib/cjs/utils/common.js.map +1 -0
  19. package/lib/esm/components/DevalueSlider.js +47 -0
  20. package/lib/esm/components/DevalueSlider.js.map +1 -0
  21. package/lib/esm/components/slider/Slider.js +199 -0
  22. package/lib/esm/components/slider/Slider.js.map +1 -0
  23. package/lib/esm/components/slider/Slider.styles.js +293 -0
  24. package/lib/esm/components/slider/Slider.styles.js.map +1 -0
  25. package/lib/esm/components/timer/Timer.js +50 -0
  26. package/lib/esm/components/timer/Timer.js.map +1 -0
  27. package/lib/esm/components/timer/Timer.styles.js +41 -0
  28. package/lib/esm/components/timer/Timer.styles.js.map +1 -0
  29. package/lib/esm/hooks/design.js +22 -0
  30. package/lib/esm/hooks/design.js.map +1 -0
  31. package/lib/esm/index.js +2 -0
  32. package/lib/esm/index.js.map +1 -0
  33. package/lib/esm/utils/common.js +4 -0
  34. package/lib/esm/utils/common.js.map +1 -0
  35. package/lib/types/components/DevalueSlider.d.ts +46 -0
  36. package/lib/types/components/slider/Slider.d.ts +19 -0
  37. package/lib/types/components/slider/Slider.styles.d.ts +1877 -0
  38. package/lib/types/components/timer/Timer.d.ts +8 -0
  39. package/lib/types/components/timer/Timer.styles.d.ts +267 -0
  40. package/lib/types/hooks/design.d.ts +6 -0
  41. package/lib/types/index.d.ts +2 -0
  42. package/lib/types/utils/common.d.ts +1 -0
  43. package/package.json +84 -0
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Slider.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireDefault","e","__esModule","default","Container","exports","styled","motion","div","Track","$height","$backgroundColor","TrackBackground","Thumb","$size","$trackHeight","TrackText","$baseFontSize","$color","ThumbIconContainer","ThumbIcon","i","attrs","icon","className","createThumbVariants","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,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAC,sBAAA,CAAAF,OAAA;AAAuC,SAAAE,uBAAAC,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAkBhC,MAAMG,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,IAAAE,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAC,EAAE;AAQtC,MAAMC,KAAK,GAAAJ,OAAA,CAAAI,KAAA,GAAG,IAAAH,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAa;AACnD;AACA;AACA;AACA,cAAc,CAAC;EAAEE;AAAQ,CAAC,KAAKA,OAAO;AACtC,qBAAqB,CAAC;EAAEA;AAAQ,CAAC,KAAKA,OAAO,GAAG,CAAC;AACjD,wBAAwB,CAAC;EAAEC;AAAiB,CAAC,KAAKA,gBAAgB;AAClE,CAAC;AAEM,MAAMC,eAAe,GAAAP,OAAA,CAAAO,eAAA,GAAG,IAAAN,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAAsB;AACtE;AACA;AACA;AACA,qBAAqB,CAAC;EAAEE;AAAQ,CAAC,KAAKA,OAAO,GAAG,CAAC;AACjD;AACA,CAAC;AAEM,MAAMG,KAAK,GAAAR,OAAA,CAAAQ,KAAA,GAAG,IAAAP,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAGpC;AACF,cAAc,CAAC;EAAEM;AAAM,CAAC,KAAKA,KAAK;AAClC,aAAa,CAAC;EAAEA;AAAM,CAAC,KAAKA,KAAK;AACjC;AACA;AACA,YAAY,CAAC;EAAEA,KAAK;EAAEC;AAAa,CAAC,KAAK,CAACA,YAAY,GAAGD,KAAK,GAAG,CAAC,IAAI,CAAC;AACvE,cAAc,CAAC;EAAEA,KAAK;EAAEC;AAAa,CAAC,KAAK,CAACA,YAAY,GAAGD,KAAK,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC;AAC7E;AACA;AACA;AACA,CAAC;AAEM,MAAME,SAAS,GAAAX,OAAA,CAAAW,SAAA,GAAG,IAAAV,yBAAM,EAACC,oBAAM,CAACC,GAAG,CAA4C;AACtF;AACA;AACA,iBAAiB,CAAC;EAAES;AAAc,CAAC,KAAKA,aAAa;AACrD;AACA,aAAa,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM;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;AAEM,MAAMC,kBAAkB,GAAAd,OAAA,CAAAc,kBAAA,GAAGb,yBAAM,CAACE,GAAG;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAEM,MAAMY,SAAS,GAAAf,OAAA,CAAAe,SAAA,GAAG,IAAAd,yBAAM,EAACC,oBAAM,CAACc,CAAC,CAAC,CAACC,KAAK,CAAmB,CAAC;EAAEC;AAAK,CAAC,MAAM;EAC7EC,SAAS,EAAE,qBAAqBD,IAAI;AACxC,CAAC,CAAC,CAAC;AACH;AACA;AACA;AACA;AACA,CAAC;AAQM,MAAME,mBAAmB,GAAGA,CAAC;EAChCC,SAAS;EACTC,UAAU;EACVC;AACqB,CAAC,MAA0D;EAChFC,IAAI,EAAE;IACFC,CAAC,EAAE,CAAC;IACJC,eAAe,EAAE,OAAO;IACxBC,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAChC,CAAC;EACDC,SAAS,EAAE;IACPJ,CAAC,EAAE,CAACH,UAAU,GAAGD,SAAS,GAAGE,WAAW,IAAI,CAAC;IAC7CG,eAAe,EAAE,aAAa;IAC9BI,SAAS,EAAE,MAAM;IACjBH,UAAU,EAAE;MAAEC,QAAQ,EAAE;IAAI;EAChC,CAAC;EACDG,OAAO,EAAE;IACLC,KAAK,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,CAAC,CAAC;IAClBF,SAAS,EAAE;EACf;AACJ,CAAC,CAAC;AAAC9B,OAAA,CAAAoB,mBAAA,GAAAA,mBAAA;AAEI,MAAMa,mBAGM,GAAAjC,OAAA,CAAAiC,mBAAA,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,57 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.default = void 0;
7
+ var _dateFns = require("date-fns");
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _chaynsApi = require("chayns-api");
10
+ var _Timer = require("./Timer.styles");
11
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
12
+ function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
13
+ const Timer = ({
14
+ devalueTime,
15
+ color,
16
+ textColor = 'white'
17
+ }) => {
18
+ const [distance, setDistance] = (0, _react.useState)((0, _dateFns.intervalToDuration)({
19
+ start: devalueTime,
20
+ end: new Date()
21
+ }));
22
+ const minutesShowValue = (0, _react.useMemo)(() => (distance.minutes || 0).toString(), [distance.minutes]);
23
+ const secondsShowValue = (0, _react.useMemo)(() => (distance.seconds || 0).toString(), [distance.seconds]);
24
+ (0, _react.useEffect)(() => {
25
+ const interval = setInterval(() => {
26
+ setDistance((0, _dateFns.intervalToDuration)({
27
+ start: devalueTime,
28
+ end: new Date()
29
+ }));
30
+ }, 500);
31
+ return () => clearInterval(interval);
32
+ }, [devalueTime]);
33
+ const handlePointerDownCapture = (0, _react.useCallback)(() => {
34
+ void (0, _chaynsApi.vibrate)({
35
+ pattern: [50],
36
+ iOSFeedbackVibration: 7
37
+ });
38
+ }, []);
39
+ const label = (0, _react.useMemo)(() => {
40
+ let text = 'Vor ##SECONDS## Sek. (##TIME## Uhr)';
41
+ if (distance.minutes) {
42
+ text = 'Vor ##MINUTES## Min. ##SECONDS## Sek. (##TIME## Uhr)';
43
+ }
44
+ return text.replace('##MINUTES##', minutesShowValue).replace('##SECONDS##', secondsShowValue).replace('##TIME##', (0, _dateFns.format)(devalueTime, 'HH:mm'));
45
+ }, [distance.minutes, minutesShowValue, secondsShowValue, devalueTime]);
46
+ return /*#__PURE__*/_react.default.createElement(_Timer.Container, {
47
+ $baseFontSize: 17,
48
+ $borderSize: 2,
49
+ $height: 50,
50
+ $color: color,
51
+ $textColor: textColor,
52
+ $backgroundColor: color,
53
+ onPointerDownCapture: handlePointerDownCapture
54
+ }, label);
55
+ };
56
+ var _default = exports.default = Timer;
57
+ //# sourceMappingURL=Timer.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Timer.js","names":["_dateFns","require","_react","_interopRequireWildcard","_chaynsApi","_Timer","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Timer","devalueTime","color","textColor","distance","setDistance","useState","intervalToDuration","start","end","Date","minutesShowValue","useMemo","minutes","toString","secondsShowValue","seconds","useEffect","interval","setInterval","clearInterval","handlePointerDownCapture","useCallback","vibrate","pattern","iOSFeedbackVibration","label","text","replace","format","createElement","Container","$baseFontSize","$borderSize","$height","$color","$textColor","$backgroundColor","onPointerDownCapture","_default","exports"],"sources":["../../../../src/components/timer/Timer.tsx"],"sourcesContent":["import { format, intervalToDuration } from 'date-fns';\nimport React, { FunctionComponent, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { vibrate } from 'chayns-api';\n\nimport { Container } from './Timer.styles';\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 [distance, setDistance] = useState(\n intervalToDuration({\n start: devalueTime,\n end: new Date(),\n }),\n );\n const minutesShowValue = useMemo(() => (distance.minutes || 0).toString(), [distance.minutes]);\n const secondsShowValue = useMemo(() => (distance.seconds || 0).toString(), [distance.seconds]);\n\n useEffect(() => {\n const interval = setInterval(() => {\n setDistance(\n intervalToDuration({\n start: devalueTime,\n end: new Date(),\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 (distance.minutes) {\n text = 'Vor ##MINUTES## Min. ##SECONDS## Sek. (##TIME## Uhr)';\n }\n\n return text\n .replace('##MINUTES##', minutesShowValue)\n .replace('##SECONDS##', secondsShowValue)\n .replace('##TIME##', format(devalueTime, 'HH:mm'));\n }, [distance.minutes, minutesShowValue, secondsShowValue, devalueTime]);\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 {label}\n </Container>\n );\n};\n\nexport default Timer;\n"],"mappings":"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","ignoreList":[]}
@@ -0,0 +1,42 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.Container = void 0;
7
+ var _styledComponents = _interopRequireDefault(require("styled-components"));
8
+ var _Slider = require("../slider/Slider.styles");
9
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
10
+ const Container = exports.Container = (0, _styledComponents.default)(_Slider.Track)`
11
+ height: ${({
12
+ $height
13
+ }) => $height}px !important;
14
+ background-color: ${({
15
+ $color
16
+ }) => $color};
17
+ display: flex;
18
+ flex-direction: row;
19
+ align-items: center;
20
+ justify-content: center;
21
+ font-size: 4.5vw;
22
+ font-weight: 700;
23
+ cursor: pointer;
24
+ color: white;
25
+
26
+ @media (min-width: 450px) {
27
+ font-size: 4vw;
28
+ }
29
+
30
+ @media (min-width: 768px) {
31
+ font-size: 2vw;
32
+ }
33
+
34
+ @media (min-width: 1024px) {
35
+ font-size: 1.5vw;
36
+ }
37
+
38
+ @media (min-width: 1200px) {
39
+ font-size: 25px;
40
+ }
41
+ `;
42
+ //# sourceMappingURL=Timer.styles.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Timer.styles.js","names":["_styledComponents","_interopRequireDefault","require","_Slider","e","__esModule","default","Container","exports","styled","Track","$height","$color"],"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 font-size: 4.5vw;\n font-weight: 700;\n cursor: pointer;\n color: white;\n\n @media (min-width: 450px) {\n font-size: 4vw;\n }\n\n @media (min-width: 768px) {\n font-size: 2vw;\n }\n\n @media (min-width: 1024px) {\n font-size: 1.5vw;\n }\n\n @media (min-width: 1200px) {\n font-size: 25px;\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAAgD,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEzC,MAAMG,SAAS,GAAAC,OAAA,CAAAD,SAAA,GAAG,IAAAE,yBAAM,EAACC,aAAK,CAInC;AACF,cAAc,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACtC,wBAAwB,CAAC;EAAEC;AAAO,CAAC,KAAKA,MAAM;AAC9C;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","ignoreList":[]}
@@ -0,0 +1,29 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useThumbIcon = void 0;
7
+ var _framerMotion = require("framer-motion");
8
+ var _react = require("react");
9
+ const useThumbIcon = (x, iconColor) => {
10
+ const [icon, setIcon] = (0, _react.useState)('fas fa-arrow-right');
11
+ const opacity = (0, _framerMotion.useTransform)(x, [0, 5, 6, 200], [1, 0, 0, 1]);
12
+ const styles = (0, _react.useMemo)(() => ({
13
+ opacity,
14
+ color: iconColor
15
+ }), [iconColor, opacity]);
16
+ (0, _react.useEffect)(() => x.on('change', value => {
17
+ if (value > 5) {
18
+ setIcon('fas fa-check');
19
+ } else {
20
+ setIcon('fas fa-arrow-right');
21
+ }
22
+ }), [x]);
23
+ return (0, _react.useMemo)(() => ({
24
+ icon,
25
+ styles
26
+ }), [icon, styles]);
27
+ };
28
+ exports.useThumbIcon = useThumbIcon;
29
+ //# sourceMappingURL=design.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"design.js","names":["_framerMotion","require","_react","useThumbIcon","x","iconColor","icon","setIcon","useState","opacity","useTransform","styles","useMemo","color","useEffect","on","value","exports"],"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,IAAAA,aAAA,GAAAC,OAAA;AACA,IAAAC,MAAA,GAAAD,OAAA;AAMO,MAAME,YAAY,GAAGA,CAACC,CAAsB,EAAEC,SAAiB,KAAsB;EACxF,MAAM,CAACC,IAAI,EAAEC,OAAO,CAAC,GAAG,IAAAC,eAAQ,EAAC,oBAAoB,CAAC;EACtD,MAAMC,OAAO,GAAG,IAAAC,0BAAY,EAACN,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;EAC7D,MAAMO,MAAM,GAAG,IAAAC,cAAO,EAClB,OAAO;IACHH,OAAO;IACPI,KAAK,EAAER;EACX,CAAC,CAAC,EACF,CAACA,SAAS,EAAEI,OAAO,CACvB,CAAC;EAED,IAAAK,gBAAS,EACL,MACIV,CAAC,CAACW,EAAE,CAAC,QAAQ,EAAGC,KAAK,IAAK;IACtB,IAAIA,KAAK,GAAG,CAAC,EAAE;MACXT,OAAO,CAAC,cAAc,CAAC;IAC3B,CAAC,MAAM;MACHA,OAAO,CAAC,oBAAoB,CAAC;IACjC;EACJ,CAAC,CAAC,EACN,CAACH,CAAC,CACN,CAAC;EAED,OAAO,IAAAQ,cAAO,EAAC,OAAO;IAAEN,IAAI;IAAEK;EAAO,CAAC,CAAC,EAAE,CAACL,IAAI,EAAEK,MAAM,CAAC,CAAC;AAC5D,CAAC;AAACM,OAAA,CAAAd,YAAA,GAAAA,YAAA","ignoreList":[]}
@@ -0,0 +1,14 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ Object.defineProperty(exports, "DevalueSlider", {
7
+ enumerable: true,
8
+ get: function () {
9
+ return _DevalueSlider.default;
10
+ }
11
+ });
12
+ var _DevalueSlider = _interopRequireDefault(require("./components/DevalueSlider"));
13
+ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":["_DevalueSlider","_interopRequireDefault","require","e","__esModule","default"],"sources":["../../src/index.ts"],"sourcesContent":["export { default as DevalueSlider } from './components/DevalueSlider';\nexport type {\n DevalueSliderOnChangeHandler,\n DevalueSliderOnCompleteHandler,\n DevalueSliderOnDevalueHandler,\n DevalueSliderProps,\n} from './components/DevalueSlider';\n"],"mappings":";;;;;;;;;;;AAAA,IAAAA,cAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAsE,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA","ignoreList":[]}
@@ -0,0 +1,11 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.sleep = void 0;
7
+ const sleep = ms => new Promise(resolve => {
8
+ setTimeout(resolve, ms);
9
+ });
10
+ exports.sleep = sleep;
11
+ //# sourceMappingURL=common.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"common.js","names":["sleep","ms","Promise","resolve","setTimeout","exports"],"sources":["../../../src/utils/common.ts"],"sourcesContent":["export const sleep = (ms: number) =>\n new Promise((resolve) => {\n setTimeout(resolve, ms);\n });\n"],"mappings":";;;;;;AAAO,MAAMA,KAAK,GAAIC,EAAU,IAC5B,IAAIC,OAAO,CAAEC,OAAO,IAAK;EACrBC,UAAU,CAACD,OAAO,EAAEF,EAAE,CAAC;AAC3B,CAAC,CAAC;AAACI,OAAA,CAAAL,KAAA,GAAAA,KAAA","ignoreList":[]}
@@ -0,0 +1,47 @@
1
+ import React, { useCallback, useEffect, useRef, useState } from 'react';
2
+ import Slider from './slider/Slider';
3
+ import Timer from './timer/Timer';
4
+ const DevalueSlider = _ref => {
5
+ let {
6
+ backgroundColor = 'red',
7
+ devalueBackgroundColor = 'green',
8
+ devalueTime,
9
+ isDisabled,
10
+ onDevalue,
11
+ onChange,
12
+ onComplete
13
+ } = _ref;
14
+ const [timerDevalueTime, setTimerDevalueTime] = useState(devalueTime);
15
+ const sliderRef = useRef(null);
16
+ useEffect(() => {
17
+ if (devalueTime) return;
18
+ setTimerDevalueTime(devalueTime);
19
+ }, [devalueTime]);
20
+ const handleCompleted = useCallback(() => {
21
+ setTimerDevalueTime(new Date());
22
+ onComplete?.();
23
+ }, [onComplete]);
24
+ useEffect(() => {
25
+ if (isDisabled) {
26
+ sliderRef.current?.disable();
27
+ return;
28
+ }
29
+ sliderRef.current?.enable();
30
+ }, [isDisabled]);
31
+ if (timerDevalueTime) {
32
+ return /*#__PURE__*/React.createElement(Timer, {
33
+ color: devalueBackgroundColor,
34
+ devalueTime: timerDevalueTime
35
+ });
36
+ }
37
+ return /*#__PURE__*/React.createElement(Slider, {
38
+ ref: sliderRef,
39
+ onDevalue: onDevalue,
40
+ color: backgroundColor,
41
+ devalueColor: devalueBackgroundColor,
42
+ onComplete: handleCompleted,
43
+ onChange: onChange
44
+ });
45
+ };
46
+ export default DevalueSlider;
47
+ //# sourceMappingURL=DevalueSlider.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"DevalueSlider.js","names":["React","useCallback","useEffect","useRef","useState","Slider","Timer","DevalueSlider","_ref","backgroundColor","devalueBackgroundColor","devalueTime","isDisabled","onDevalue","onChange","onComplete","timerDevalueTime","setTimerDevalueTime","sliderRef","handleCompleted","Date","current","disable","enable","createElement","color","ref","devalueColor"],"sources":["../../../src/components/DevalueSlider.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef, useState, type CSSProperties } from 'react';\nimport Slider, { type SliderRef } from './slider/Slider';\nimport Timer from './timer/Timer';\n\nexport type DevalueSliderOnDevalueHandlerResult = { success: boolean };\nexport type DevalueSliderOnDevalueHandler = () => Promise<DevalueSliderOnDevalueHandlerResult>;\n\nexport type DevalueSliderOnChangeHandler = (relativeValue: number) => void;\nexport type DevalueSliderOnCompleteHandler = () => void;\n\nexport type DevalueSliderProps = {\n /**\n * The basic color of the slider.\n * This color is the background of the track before the slider is devalued.\n */\n backgroundColor?: CSSProperties['backgroundColor'];\n /**\n * The devalue color of the slider.\n * This color fills the track from the left on user movement.\n * This color is the background of the timer after the slider is devalued.\n */\n devalueBackgroundColor?: CSSProperties['backgroundColor'];\n /**\n * If this slider was devalued, provide the time when it was devalued.\n * This will show a timer.\n */\n devalueTime?: Date;\n /**\n * Disables the slider and cancels any active drags.\n */\n isDisabled?: boolean;\n /**\n * This function is called when the slider is devalued.\n */\n onDevalue?: DevalueSliderOnDevalueHandler;\n /**\n * This function is called when the slider value changes.\n * With this function you can keep track of the movement of the slider.\n */\n onChange?: DevalueSliderOnChangeHandler;\n /**\n * This function is called when the slider is completed.\n * The slider is completed when the user devalues the slider\n * and the animation is completed.\n */\n onComplete?: DevalueSliderOnCompleteHandler;\n};\n\nconst DevalueSlider: React.FC<DevalueSliderProps> = ({\n backgroundColor = 'red',\n devalueBackgroundColor = 'green',\n devalueTime,\n isDisabled,\n onDevalue,\n onChange,\n onComplete,\n}) => {\n const [timerDevalueTime, setTimerDevalueTime] = useState(devalueTime);\n\n const sliderRef = useRef<SliderRef>(null);\n\n useEffect(() => {\n if (devalueTime) return;\n\n setTimerDevalueTime(devalueTime);\n }, [devalueTime]);\n\n const handleCompleted = useCallback(() => {\n setTimerDevalueTime(new Date());\n\n onComplete?.();\n }, [onComplete]);\n\n useEffect(() => {\n if (isDisabled) {\n sliderRef.current?.disable();\n\n return;\n }\n\n sliderRef.current?.enable();\n }, [isDisabled]);\n\n if (timerDevalueTime) {\n return <Timer color={devalueBackgroundColor} devalueTime={timerDevalueTime} />;\n }\n\n return (\n <Slider\n ref={sliderRef}\n onDevalue={onDevalue}\n color={backgroundColor}\n devalueColor={devalueBackgroundColor}\n onComplete={handleCompleted}\n onChange={onChange}\n />\n );\n};\n\nexport default DevalueSlider;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAA4B,OAAO;AAC3F,OAAOC,MAAM,MAA0B,iBAAiB;AACxD,OAAOC,KAAK,MAAM,eAAe;AA8CjC,MAAMC,aAA2C,GAAGC,IAAA,IAQ9C;EAAA,IAR+C;IACjDC,eAAe,GAAG,KAAK;IACvBC,sBAAsB,GAAG,OAAO;IAChCC,WAAW;IACXC,UAAU;IACVC,SAAS;IACTC,QAAQ;IACRC;EACJ,CAAC,GAAAP,IAAA;EACG,MAAM,CAACQ,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGb,QAAQ,CAACO,WAAW,CAAC;EAErE,MAAMO,SAAS,GAAGf,MAAM,CAAY,IAAI,CAAC;EAEzCD,SAAS,CAAC,MAAM;IACZ,IAAIS,WAAW,EAAE;IAEjBM,mBAAmB,CAACN,WAAW,CAAC;EACpC,CAAC,EAAE,CAACA,WAAW,CAAC,CAAC;EAEjB,MAAMQ,eAAe,GAAGlB,WAAW,CAAC,MAAM;IACtCgB,mBAAmB,CAAC,IAAIG,IAAI,CAAC,CAAC,CAAC;IAE/BL,UAAU,GAAG,CAAC;EAClB,CAAC,EAAE,CAACA,UAAU,CAAC,CAAC;EAEhBb,SAAS,CAAC,MAAM;IACZ,IAAIU,UAAU,EAAE;MACZM,SAAS,CAACG,OAAO,EAAEC,OAAO,CAAC,CAAC;MAE5B;IACJ;IAEAJ,SAAS,CAACG,OAAO,EAAEE,MAAM,CAAC,CAAC;EAC/B,CAAC,EAAE,CAACX,UAAU,CAAC,CAAC;EAEhB,IAAII,gBAAgB,EAAE;IAClB,oBAAOhB,KAAA,CAAAwB,aAAA,CAAClB,KAAK;MAACmB,KAAK,EAAEf,sBAAuB;MAACC,WAAW,EAAEK;IAAiB,CAAE,CAAC;EAClF;EAEA,oBACIhB,KAAA,CAAAwB,aAAA,CAACnB,MAAM;IACHqB,GAAG,EAAER,SAAU;IACfL,SAAS,EAAEA,SAAU;IACrBY,KAAK,EAAEhB,eAAgB;IACvBkB,YAAY,EAAEjB,sBAAuB;IACrCK,UAAU,EAAEI,eAAgB;IAC5BL,QAAQ,EAAEA;EAAS,CACtB,CAAC;AAEV,CAAC;AAED,eAAeP,aAAa","ignoreList":[]}
@@ -0,0 +1,199 @@
1
+ import { SmallWaitCursor } from '@chayns-components/core';
2
+ import useSize from '@react-hook/size';
3
+ import { invokeCall, vibrate } from 'chayns-api';
4
+ import { useAnimation, useDragControls, useMotionValue, useTransform } from 'framer-motion';
5
+ import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useMemo, useRef, useState } from 'react';
6
+ import { useThumbIcon } from '../../hooks/design';
7
+ import { sleep } from '../../utils/common';
8
+ import { Container, createThumbVariants, Thumb, ThumbIcon, ThumbIconContainer, THUMB_ICON_VARIANTS, Track, TrackBackground, TrackText } from './Slider.styles';
9
+ const Slider = /*#__PURE__*/forwardRef((_ref, ref) => {
10
+ let {
11
+ color,
12
+ devalueColor,
13
+ trackHeight = 50,
14
+ thumbSize = 40,
15
+ borderSize = 2,
16
+ trackText = 'EINLÖSEN',
17
+ onChange = () => {},
18
+ onDevalue = () => Promise.resolve({
19
+ success: true
20
+ }),
21
+ onComplete
22
+ } = _ref;
23
+ const [trackRef, setTrackRef] = useState(null);
24
+ const [trackWidth] = useSize(trackRef, {
25
+ initialWidth: 300,
26
+ initialHeight: 50
27
+ });
28
+ const [iconColor, setIconColor] = useState('black');
29
+ const [isCompleted, setIsCompleted] = useState(false);
30
+ const [isDisabled, setIsDisabled] = useState(false);
31
+ const isCompletedRef = useRef(isCompleted);
32
+ const [showWaitCursor, setShowWaitCursor] = useState(false);
33
+ const scaleFactor = useMemo(() => trackHeight / thumbSize, [thumbSize, trackHeight]);
34
+ const x = useMotionValue(0);
35
+ const {
36
+ icon,
37
+ styles: iconStyles
38
+ } = useThumbIcon(x, iconColor);
39
+ const dragControls = useDragControls();
40
+ const vibrationTrigger = useTransform(x,
41
+ // round to 10 to avoid unnecessary vibrate calls
42
+ value => Math.round(value / 10) * 10);
43
+ const lastVibrationValue = useRef(0);
44
+ useEffect(() => {
45
+ vibrationTrigger.on('change', value => {
46
+ if (!isCompletedRef.current && value !== lastVibrationValue.current) {
47
+ lastVibrationValue.current = value;
48
+ void vibrate({
49
+ pattern: [10]
50
+ });
51
+ }
52
+ });
53
+ }, [vibrationTrigger]);
54
+ const containerAnimation = useAnimation();
55
+ const thumbVariants = useMemo(() => createThumbVariants({
56
+ thumbSize,
57
+ trackWidth,
58
+ scaleFactor
59
+ }), [scaleFactor, thumbSize, trackWidth]);
60
+ const textOpacity = useTransform(x, [0, 120], [1, 0]);
61
+
62
+ // this is the relative value of the right edge of the thumb
63
+ const relativeValue = useTransform(x, value => {
64
+ if (!value) return 0;
65
+ const thumbRadius = thumbSize * scaleFactor;
66
+ return parseFloat(((value + thumbRadius) / trackWidth * 100).toPrecision(2));
67
+ });
68
+
69
+ // this is the relative value of the center of the thumb, it is used for the background gradient
70
+ const relativeBackgroundValue = useTransform(x, value => {
71
+ if (!value) return 0;
72
+ const thumbRadius = thumbSize * scaleFactor / 2;
73
+ return parseFloat(((value + thumbRadius) / trackWidth * 100).toPrecision(2));
74
+ });
75
+ const trackBackground = useTransform(relativeBackgroundValue, value => {
76
+ if (isCompleted) return devalueColor;
77
+ if (!value) return 'transparent';
78
+ return `linear-gradient(to right, ${devalueColor} ${value}%, transparent ${value}%)`;
79
+ });
80
+ const handlePointerDownCapture = useCallback(() => {
81
+ void invokeCall({
82
+ action: 19,
83
+ value: {
84
+ pattern: [50],
85
+ iOSFeedbackVibration: 7
86
+ }
87
+ });
88
+ }, []);
89
+ const handleRedeem = useCallback(async () => {
90
+ setShowWaitCursor(true);
91
+ setIsCompleted(true);
92
+ isCompletedRef.current = true;
93
+ const devaluePromise = onDevalue();
94
+ const sleepPromise = sleep(1000);
95
+ const [devalued] = await Promise.all([devaluePromise, sleepPromise]);
96
+ if (!devalued.success) {
97
+ setShowWaitCursor(false);
98
+ setIsCompleted(false);
99
+ isCompletedRef.current = false;
100
+ await containerAnimation.start('base');
101
+ return;
102
+ }
103
+ setShowWaitCursor(false);
104
+ setIconColor('white');
105
+ void invokeCall({
106
+ action: 19,
107
+ value: {
108
+ iOSFeedbackVibration: 3,
109
+ pattern: [100, 200, 100]
110
+ }
111
+ });
112
+ await containerAnimation.start('completed');
113
+ await containerAnimation.start('leaving');
114
+ onComplete?.();
115
+ }, [containerAnimation, onComplete, onDevalue]);
116
+ const handleTrackRef = useCallback(node => {
117
+ setTrackRef(node);
118
+ }, []);
119
+ const handleDragStart = useCallback(() => {
120
+ void containerAnimation.start('dragging');
121
+ }, [containerAnimation]);
122
+ const handleDragEnd = useCallback(() => {
123
+ if (relativeValue.get() > 98) {
124
+ void handleRedeem();
125
+ return;
126
+ }
127
+ void containerAnimation.start('base');
128
+ }, [relativeValue, containerAnimation, handleRedeem]);
129
+ useEffect(() => {
130
+ void containerAnimation.start('base');
131
+ }, [containerAnimation]);
132
+ useEffect(() => {
133
+ if (isCompleted) return () => {};
134
+ return relativeValue.on('change', onChange);
135
+ }, [isCompleted, onChange, relativeValue]);
136
+ useImperativeHandle(ref, () => ({
137
+ disable: () => {
138
+ setIsDisabled(true);
139
+ setShowWaitCursor(false);
140
+ setIsCompleted(false);
141
+ isCompletedRef.current = false;
142
+ void containerAnimation.start('base');
143
+ },
144
+ enable: () => {
145
+ setIsDisabled(false);
146
+ }
147
+ }), [containerAnimation]);
148
+ const baseFontSize = useMemo(() => 22, []);
149
+ return /*#__PURE__*/React.createElement(Container, {
150
+ animate: containerAnimation
151
+ }, /*#__PURE__*/React.createElement(Track, {
152
+ $height: trackHeight,
153
+ $borderSize: borderSize,
154
+ $backgroundColor: color,
155
+ ref: handleTrackRef
156
+ }, /*#__PURE__*/React.createElement(TrackBackground, {
157
+ $height: trackHeight,
158
+ style: {
159
+ background: trackBackground
160
+ }
161
+ }), /*#__PURE__*/React.createElement(Thumb, {
162
+ variants: thumbVariants,
163
+ $size: thumbSize,
164
+ $trackHeight: trackHeight,
165
+ style: {
166
+ x
167
+ },
168
+ drag: isCompleted || isDisabled ? false : 'x',
169
+ dragElastic: 0,
170
+ onPointerDownCapture: handlePointerDownCapture,
171
+ whileTap: {
172
+ scale: 1.4,
173
+ cursor: 'grabbing'
174
+ },
175
+ onDragStart: handleDragStart,
176
+ onDragEnd: handleDragEnd,
177
+ dragControls: dragControls,
178
+ dragConstraints: {
179
+ right: trackWidth - thumbSize * scaleFactor,
180
+ left: 0
181
+ }
182
+ }, /*#__PURE__*/React.createElement(ThumbIconContainer, null, !showWaitCursor && /*#__PURE__*/React.createElement(ThumbIcon, {
183
+ key: "thumb-icon",
184
+ icon: icon,
185
+ variants: THUMB_ICON_VARIANTS,
186
+ style: iconStyles
187
+ }), showWaitCursor && /*#__PURE__*/React.createElement(SmallWaitCursor, {
188
+ shouldHideBackground: true,
189
+ color: "black"
190
+ }))), /*#__PURE__*/React.createElement(TrackText, {
191
+ style: {
192
+ opacity: textOpacity
193
+ },
194
+ $color: "white",
195
+ $baseFontSize: baseFontSize
196
+ }, trackText)));
197
+ });
198
+ export default Slider;
199
+ //# sourceMappingURL=Slider.js.map
@@ -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","action","iOSFeedbackVibration","handleRedeem","devaluePromise","sleepPromise","devalued","all","start","handleTrackRef","node","handleDragStart","handleDragEnd","get","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 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 void invokeCall({\n action: 19,\n value: {\n pattern: [50],\n iOSFeedbackVibration: 7,\n },\n });\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":[]}