@salutejs/plasma-new-hope 0.144.0-dev.0 → 0.145.0-canary.1421.10845314144.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (153) hide show
  1. package/cjs/components/Slider/Slider.css +12 -10
  2. package/cjs/components/Slider/Slider.js +19 -6
  3. package/cjs/components/Slider/Slider.js.map +1 -1
  4. package/cjs/components/Slider/components/Double/Double.css +6 -5
  5. package/cjs/components/Slider/components/Double/Double.js +36 -2
  6. package/cjs/components/Slider/components/Double/Double.js.map +1 -1
  7. package/cjs/components/Slider/components/Double/Double.styles.js +7 -1
  8. package/cjs/components/Slider/components/Double/Double.styles.js.map +1 -1
  9. package/cjs/components/Slider/components/Double/{Double.styles_1jhda4u.css → Double.styles_4053ky.css} +1 -0
  10. package/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +56 -0
  11. package/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js.map +1 -0
  12. package/cjs/components/Slider/components/Single/Single.css +6 -5
  13. package/cjs/components/Slider/components/Single/Single.js +35 -12
  14. package/cjs/components/Slider/components/Single/Single.js.map +1 -1
  15. package/cjs/components/Slider/components/Single/Single.styles.js +7 -1
  16. package/cjs/components/Slider/components/Single/Single.styles.js.map +1 -1
  17. package/cjs/components/Slider/components/Single/{Single.styles_1r9f1e0.css → Single.styles_9lxkbx.css} +1 -0
  18. package/cjs/components/Slider/utils/index.js +6 -0
  19. package/cjs/components/Slider/utils/index.js.map +1 -1
  20. package/cjs/components/TextArea/TextArea.js +3 -2
  21. package/cjs/components/TextArea/TextArea.js.map +1 -1
  22. package/cjs/hooks/useForm.js +96 -0
  23. package/cjs/hooks/useForm.js.map +1 -0
  24. package/cjs/index.css +12 -10
  25. package/cjs/index.js +5 -0
  26. package/cjs/index.js.map +1 -1
  27. package/cjs/utils/index.js.map +1 -1
  28. package/cjs/utils/setRefList.js +28 -0
  29. package/cjs/utils/setRefList.js.map +1 -0
  30. package/emotion/cjs/components/Slider/Slider.js +15 -6
  31. package/emotion/cjs/components/Slider/components/Double/Double.js +36 -2
  32. package/emotion/cjs/components/Slider/components/Double/Double.styles.js +28 -15
  33. package/emotion/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +60 -0
  34. package/emotion/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.js +5 -0
  35. package/emotion/cjs/components/Slider/components/Single/Single.js +30 -7
  36. package/emotion/cjs/components/Slider/components/Single/Single.styles.js +26 -13
  37. package/emotion/cjs/components/Slider/components/index.js +11 -0
  38. package/emotion/cjs/components/Slider/utils/index.js +6 -1
  39. package/emotion/cjs/components/TextArea/TextArea.js +3 -3
  40. package/emotion/cjs/examples/plasma_b2c/components/Form/Form.stories.tsx +191 -0
  41. package/emotion/cjs/hooks/index.js +8 -1
  42. package/emotion/cjs/hooks/useForm.js +102 -0
  43. package/emotion/cjs/utils/index.js +15 -0
  44. package/emotion/cjs/utils/setRefList.js +27 -0
  45. package/emotion/es/components/Slider/Slider.js +16 -6
  46. package/emotion/es/components/Slider/components/Double/Double.js +38 -4
  47. package/emotion/es/components/Slider/components/Double/Double.styles.js +27 -14
  48. package/emotion/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +51 -0
  49. package/emotion/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.js +1 -0
  50. package/emotion/es/components/Slider/components/Single/Single.js +32 -9
  51. package/emotion/es/components/Slider/components/Single/Single.styles.js +25 -12
  52. package/emotion/es/components/Slider/components/index.js +1 -0
  53. package/emotion/es/components/Slider/utils/index.js +5 -0
  54. package/emotion/es/components/TextArea/TextArea.js +4 -4
  55. package/emotion/es/examples/plasma_b2c/components/Form/Form.stories.tsx +191 -0
  56. package/emotion/es/hooks/index.js +2 -1
  57. package/emotion/es/hooks/useForm.js +93 -0
  58. package/emotion/es/utils/index.js +1 -0
  59. package/emotion/es/utils/setRefList.js +20 -0
  60. package/es/components/Slider/Slider.css +12 -10
  61. package/es/components/Slider/Slider.js +20 -7
  62. package/es/components/Slider/Slider.js.map +1 -1
  63. package/es/components/Slider/components/Double/Double.css +6 -5
  64. package/es/components/Slider/components/Double/Double.js +38 -4
  65. package/es/components/Slider/components/Double/Double.js.map +1 -1
  66. package/es/components/Slider/components/Double/Double.styles.js +7 -2
  67. package/es/components/Slider/components/Double/Double.styles.js.map +1 -1
  68. package/es/components/Slider/components/Double/{Double.styles_1jhda4u.css → Double.styles_4053ky.css} +1 -0
  69. package/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +52 -0
  70. package/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js.map +1 -0
  71. package/es/components/Slider/components/Single/Single.css +6 -5
  72. package/es/components/Slider/components/Single/Single.js +32 -9
  73. package/es/components/Slider/components/Single/Single.js.map +1 -1
  74. package/es/components/Slider/components/Single/Single.styles.js +7 -2
  75. package/es/components/Slider/components/Single/Single.styles.js.map +1 -1
  76. package/es/components/Slider/components/Single/{Single.styles_1r9f1e0.css → Single.styles_9lxkbx.css} +1 -0
  77. package/es/components/Slider/utils/index.js +6 -1
  78. package/es/components/Slider/utils/index.js.map +1 -1
  79. package/es/components/TextArea/TextArea.js +3 -2
  80. package/es/components/TextArea/TextArea.js.map +1 -1
  81. package/es/hooks/useForm.js +92 -0
  82. package/es/hooks/useForm.js.map +1 -0
  83. package/es/index.css +12 -10
  84. package/es/index.js +2 -0
  85. package/es/index.js.map +1 -1
  86. package/es/utils/index.js.map +1 -1
  87. package/es/utils/setRefList.js +23 -0
  88. package/es/utils/setRefList.js.map +1 -0
  89. package/package.json +3 -2
  90. package/styled-components/cjs/components/Slider/Slider.js +15 -6
  91. package/styled-components/cjs/components/Slider/components/Double/Double.js +36 -2
  92. package/styled-components/cjs/components/Slider/components/Double/Double.styles.js +5 -2
  93. package/styled-components/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +60 -0
  94. package/styled-components/cjs/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.js +5 -0
  95. package/styled-components/cjs/components/Slider/components/Single/Single.js +30 -7
  96. package/styled-components/cjs/components/Slider/components/Single/Single.styles.js +5 -2
  97. package/styled-components/cjs/components/Slider/components/index.js +11 -0
  98. package/styled-components/cjs/components/Slider/utils/index.js +6 -1
  99. package/styled-components/cjs/components/TextArea/TextArea.js +2 -2
  100. package/styled-components/cjs/examples/plasma_b2c/components/Form/Form.stories.tsx +191 -0
  101. package/styled-components/cjs/hooks/index.js +8 -1
  102. package/styled-components/cjs/hooks/useForm.js +102 -0
  103. package/styled-components/cjs/utils/index.js +15 -0
  104. package/styled-components/cjs/utils/setRefList.js +27 -0
  105. package/styled-components/es/components/Slider/Slider.js +16 -6
  106. package/styled-components/es/components/Slider/components/Double/Double.js +38 -4
  107. package/styled-components/es/components/Slider/components/Double/Double.styles.js +4 -1
  108. package/styled-components/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.js +51 -0
  109. package/styled-components/es/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.js +1 -0
  110. package/styled-components/es/components/Slider/components/Single/Single.js +32 -9
  111. package/styled-components/es/components/Slider/components/Single/Single.styles.js +4 -1
  112. package/styled-components/es/components/Slider/components/index.js +1 -0
  113. package/styled-components/es/components/Slider/utils/index.js +5 -0
  114. package/styled-components/es/components/TextArea/TextArea.js +3 -3
  115. package/styled-components/es/examples/plasma_b2c/components/Form/Form.stories.tsx +191 -0
  116. package/styled-components/es/hooks/index.js +2 -1
  117. package/styled-components/es/hooks/useForm.js +93 -0
  118. package/styled-components/es/utils/index.js +1 -0
  119. package/styled-components/es/utils/setRefList.js +20 -0
  120. package/types/components/Slider/Slider.d.ts.map +1 -1
  121. package/types/components/Slider/Slider.types.d.ts +2 -2
  122. package/types/components/Slider/Slider.types.d.ts.map +1 -1
  123. package/types/components/Slider/components/Double/Double.d.ts.map +1 -1
  124. package/types/components/Slider/components/Double/Double.styles.d.ts +1 -0
  125. package/types/components/Slider/components/Double/Double.styles.d.ts.map +1 -1
  126. package/types/components/Slider/components/Double/Double.types.d.ts +2 -0
  127. package/types/components/Slider/components/Double/Double.types.d.ts.map +1 -1
  128. package/types/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.d.ts +4 -0
  129. package/types/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.d.ts.map +1 -0
  130. package/types/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.d.ts +5 -0
  131. package/types/components/Slider/components/DoubleUncontrolled/DoubleUncontrolled.types.d.ts.map +1 -0
  132. package/types/components/Slider/components/Single/Single.d.ts.map +1 -1
  133. package/types/components/Slider/components/Single/Single.styles.d.ts +1 -0
  134. package/types/components/Slider/components/Single/Single.styles.d.ts.map +1 -1
  135. package/types/components/Slider/components/Single/Single.types.d.ts +3 -1
  136. package/types/components/Slider/components/Single/Single.types.d.ts.map +1 -1
  137. package/types/components/Slider/components/index.d.ts +2 -0
  138. package/types/components/Slider/components/index.d.ts.map +1 -1
  139. package/types/components/Slider/utils/index.d.ts +1 -0
  140. package/types/components/Slider/utils/index.d.ts.map +1 -1
  141. package/types/components/TextArea/TextArea.d.ts.map +1 -1
  142. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts +3 -1
  143. package/types/examples/plasma_b2c/components/Slider/Slider.d.ts.map +1 -1
  144. package/types/examples/plasma_web/components/Slider/Slider.d.ts +3 -1
  145. package/types/examples/plasma_web/components/Slider/Slider.d.ts.map +1 -1
  146. package/types/hooks/index.d.ts +1 -0
  147. package/types/hooks/index.d.ts.map +1 -1
  148. package/types/hooks/useForm.d.ts +10 -0
  149. package/types/hooks/useForm.d.ts.map +1 -0
  150. package/types/utils/index.d.ts +1 -0
  151. package/types/utils/index.d.ts.map +1 -1
  152. package/types/utils/setRefList.d.ts +6 -0
  153. package/types/utils/setRefList.d.ts.map +1 -0
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/utils/index.ts"],"sourcesContent":["import { CSSProperties } from '@linaria/core';\n\nexport { canUseDOM } from './canUseDOM';\nexport { extractTextFrom } from './extractTextFrom';\nexport { getSizeValueFromProp } from './getSizeValueFromProp';\nexport { IS_REACT_18, safeUseId } from './react';\nexport { isNumber } from './isNumber';\nexport { isEmpty } from './isEmpty';\nexport * as constants from './constants';\nexport * from './getPopoverPlacement';\n\nexport const cx = (...classes: (string | undefined)[]) => classes.filter((classItem) => classItem).join(' ');\n\nexport const composableStyle = (s: TemplateStringsArray, ...expr: Array<string | number | CSSProperties>): string => {\n let res = '';\n for (let i = 0; i < Math.max(s.length, expr.length); ++i) {\n res += s[i] ?? '';\n res += expr[i] ?? '';\n }\n\n return res;\n};\n"],"names":["cx","_len","arguments","length","classes","Array","_key","filter","classItem","join","composableStyle","s","res","i","Math","max","_s$i","_ref","undefined"],"mappings":";;;AAWaA,IAAAA,EAAE,GAAG,SAALA,EAAEA,GAAA;AAAA,EAAA,KAAA,IAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAOC,OAAO,GAAAC,IAAAA,KAAA,CAAAJ,IAAA,GAAAK,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,EAAA,EAAA;AAAPF,IAAAA,OAAO,CAAAE,IAAA,CAAAJ,GAAAA,SAAA,CAAAI,IAAA,CAAA,CAAA;AAAA,GAAA;AAAA,EAAA,OAA6BF,OAAO,CAACG,MAAM,CAAC,UAACC,SAAS,EAAA;AAAA,IAAA,OAAKA,SAAS,CAAA;AAAA,GAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAAA;AAAA,EAAA;IAE/FC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,CAAuB,EAA8D;EACjH,IAAIC,GAAG,GAAG,EAAE,CAAA;EACZ,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGC,IAAI,CAACC,GAAG,CAACJ,CAAC,CAACR,MAAM,EAAAD,SAAA,CAAAC,MAAA,IAAA,CAAA,GAAA,CAAA,GAAAD,SAAA,CAAAC,MAAA,GAAA,CAAa,CAAC,EAAE,EAAEU,CAAC,EAAE;IAAA,IAAAG,IAAA,EAAAC,IAAA,CAAA;AACtDL,IAAAA,GAAG,IAAAI,CAAAA,IAAA,GAAIL,CAAC,CAACE,CAAC,CAAC,MAAA,IAAA,IAAAG,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAI,EAAE,CAAA;IACjBJ,GAAG,IAAA,CAAAK,IAAA,GAASJ,CAAC,YAAAX,SAAA,CAAAC,MAAA,IAADU,CAAC,OAAAK,SAAA,GAAAhB,SAAA,CAADW,CAAC,mBAAAI,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAK,EAAE,CAAA;AACxB,GAAA;AAEA,EAAA,OAAOL,GAAG,CAAA;AACd;;;;"}
1
+ {"version":3,"file":"index.js","sources":["../../src/utils/index.ts"],"sourcesContent":["import { CSSProperties } from '@linaria/core';\n\nexport { canUseDOM } from './canUseDOM';\nexport { extractTextFrom } from './extractTextFrom';\nexport { getSizeValueFromProp } from './getSizeValueFromProp';\nexport { IS_REACT_18, safeUseId } from './react';\nexport { isNumber } from './isNumber';\nexport { mergeRefs, setRefList } from './setRefList';\nexport { isEmpty } from './isEmpty';\nexport * as constants from './constants';\nexport * from './getPopoverPlacement';\n\nexport const cx = (...classes: (string | undefined)[]) => classes.filter((classItem) => classItem).join(' ');\n\nexport const composableStyle = (s: TemplateStringsArray, ...expr: Array<string | number | CSSProperties>): string => {\n let res = '';\n for (let i = 0; i < Math.max(s.length, expr.length); ++i) {\n res += s[i] ?? '';\n res += expr[i] ?? '';\n }\n\n return res;\n};\n"],"names":["cx","_len","arguments","length","classes","Array","_key","filter","classItem","join","composableStyle","s","res","i","Math","max","_s$i","_ref","undefined"],"mappings":";;;AAYaA,IAAAA,EAAE,GAAG,SAALA,EAAEA,GAAA;AAAA,EAAA,KAAA,IAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAOC,OAAO,GAAAC,IAAAA,KAAA,CAAAJ,IAAA,GAAAK,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,EAAA,EAAA;AAAPF,IAAAA,OAAO,CAAAE,IAAA,CAAAJ,GAAAA,SAAA,CAAAI,IAAA,CAAA,CAAA;AAAA,GAAA;AAAA,EAAA,OAA6BF,OAAO,CAACG,MAAM,CAAC,UAACC,SAAS,EAAA;AAAA,IAAA,OAAKA,SAAS,CAAA;AAAA,GAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAC,CAAA;AAAA,EAAA;IAE/FC,eAAe,GAAG,SAAlBA,eAAeA,CAAIC,CAAuB,EAA8D;EACjH,IAAIC,GAAG,GAAG,EAAE,CAAA;EACZ,KAAK,IAAIC,CAAC,GAAG,CAAC,EAAEA,CAAC,GAAGC,IAAI,CAACC,GAAG,CAACJ,CAAC,CAACR,MAAM,EAAAD,SAAA,CAAAC,MAAA,IAAA,CAAA,GAAA,CAAA,GAAAD,SAAA,CAAAC,MAAA,GAAA,CAAa,CAAC,EAAE,EAAEU,CAAC,EAAE;IAAA,IAAAG,IAAA,EAAAC,IAAA,CAAA;AACtDL,IAAAA,GAAG,IAAAI,CAAAA,IAAA,GAAIL,CAAC,CAACE,CAAC,CAAC,MAAA,IAAA,IAAAG,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAI,EAAE,CAAA;IACjBJ,GAAG,IAAA,CAAAK,IAAA,GAASJ,CAAC,YAAAX,SAAA,CAAAC,MAAA,IAADU,CAAC,OAAAK,SAAA,GAAAhB,SAAA,CAADW,CAAC,mBAAAI,IAAA,KAAA,KAAA,CAAA,GAAAA,IAAA,GAAK,EAAE,CAAA;AACxB,GAAA;AAEA,EAAA,OAAOL,GAAG,CAAA;AACd;;;;"}
@@ -0,0 +1,23 @@
1
+ function mergeRefs() {
2
+ for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
3
+ refs[_key] = arguments[_key];
4
+ }
5
+ return function (val) {
6
+ setRefList.apply(void 0, [val].concat(refs));
7
+ };
8
+ }
9
+ function setRefList(val) {
10
+ for (var _len2 = arguments.length, refs = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
11
+ refs[_key2 - 1] = arguments[_key2];
12
+ }
13
+ refs.forEach(function (ref) {
14
+ if (typeof ref === 'function') {
15
+ ref(val);
16
+ } else if (ref != null) {
17
+ ref.current = val;
18
+ }
19
+ });
20
+ }
21
+
22
+ export { mergeRefs, setRefList };
23
+ //# sourceMappingURL=setRefList.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"setRefList.js","sources":["../../src/utils/setRefList.ts"],"sourcesContent":["import type { MutableRefObject, RefCallback } from 'react';\n\ntype MutableRefList<T> = Array<RefCallback<T> | MutableRefObject<T> | undefined | null>;\n\nexport function mergeRefs<T>(...refs: MutableRefList<T>): RefCallback<T> {\n return (val: T) => {\n setRefList(val, ...refs);\n };\n}\n\nexport function setRefList<T>(val: T, ...refs: MutableRefList<T>): void {\n refs.forEach((ref) => {\n if (typeof ref === 'function') {\n ref(val);\n } else if (ref != null) {\n ref.current = val;\n }\n });\n}\n"],"names":["mergeRefs","_len","arguments","length","refs","Array","_key","val","setRefList","apply","concat","_len2","_key2","forEach","ref","current"],"mappings":"AAIO,SAASA,SAASA,GAAgD;AAAA,EAAA,KAAA,IAAAC,IAAA,GAAAC,SAAA,CAAAC,MAAA,EAAzCC,IAAI,GAAAC,IAAAA,KAAA,CAAAJ,IAAA,GAAAK,IAAA,GAAA,CAAA,EAAAA,IAAA,GAAAL,IAAA,EAAAK,IAAA,EAAA,EAAA;AAAJF,IAAAA,IAAI,CAAAE,IAAA,CAAAJ,GAAAA,SAAA,CAAAI,IAAA,CAAA,CAAA;AAAA,GAAA;EAChC,OAAO,UAACC,GAAM,EAAK;IACfC,UAAU,CAAAC,KAAA,CAACF,KAAAA,CAAAA,EAAAA,CAAAA,GAAG,EAAAG,MAAA,CAAKN,IAAI,CAAC,CAAA,CAAA;GAC3B,CAAA;AACL,CAAA;AAEO,SAASI,UAAUA,CAAID,GAAM,EAAoC;EAAA,KAAAI,IAAAA,KAAA,GAAAT,SAAA,CAAAC,MAAA,EAA/BC,IAAI,OAAAC,KAAA,CAAAM,KAAA,GAAAA,CAAAA,GAAAA,KAAA,WAAAC,KAAA,GAAA,CAAA,EAAAA,KAAA,GAAAD,KAAA,EAAAC,KAAA,EAAA,EAAA;AAAJR,IAAAA,IAAI,CAAAQ,KAAA,GAAAV,CAAAA,CAAAA,GAAAA,SAAA,CAAAU,KAAA,CAAA,CAAA;AAAA,GAAA;AACzCR,EAAAA,IAAI,CAACS,OAAO,CAAC,UAACC,GAAG,EAAK;AAClB,IAAA,IAAI,OAAOA,GAAG,KAAK,UAAU,EAAE;MAC3BA,GAAG,CAACP,GAAG,CAAC,CAAA;AACZ,KAAC,MAAM,IAAIO,GAAG,IAAI,IAAI,EAAE;MACpBA,GAAG,CAACC,OAAO,GAAGR,GAAG,CAAA;AACrB,KAAA;AACJ,GAAC,CAAC,CAAA;AACN;;;;"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.144.0-dev.0",
3
+ "version": "0.145.0-canary.1421.10845314144.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -100,6 +100,7 @@
100
100
  "default-browser-id": "2.0.0",
101
101
  "react": "18.2.0",
102
102
  "react-dom": "18.2.0",
103
+ "react-hook-form": "7.52.1",
103
104
  "rollup": "^3.28.0",
104
105
  "storybook": "7.6.17",
105
106
  "styled-components": "5.3.1",
@@ -121,5 +122,5 @@
121
122
  "react-popper": "2.3.0",
122
123
  "storeon": "3.1.5"
123
124
  },
124
- "gitHead": "c97a2af1c1c2d13650b7681c724c6f1a8094d903"
125
+ "gitHead": "aea932f7110a952f5a10fec8e84fc6d81a8e8d35"
125
126
  }
@@ -1,6 +1,5 @@
1
1
  "use strict";
2
2
 
3
- function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
3
  Object.defineProperty(exports, "__esModule", {
5
4
  value: true
6
5
  });
@@ -10,17 +9,27 @@ var _base = /*#__PURE__*/require("./variations/_view/base");
10
9
  var _base2 = /*#__PURE__*/require("./variations/_size/base");
11
10
  var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
12
11
  var _components = /*#__PURE__*/require("./components");
12
+ var _excluded = ["type"];
13
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
14
14
  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; }
15
15
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
16
- var isSingleValueProps = function isSingleValueProps(props) {
17
- return typeof props.value === 'number';
16
+ function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
17
+ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
18
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
19
+ var isSingleValueProps = function isSingleValueProps(props, type) {
20
+ return typeof props.value === 'number' || type === 'single' && _typeof(props.value) !== 'object';
21
+ };
22
+ var isDoubleValueProps = function isDoubleValueProps(props, type) {
23
+ return _typeof(props.value) === 'object' || type === 'double';
18
24
  };
19
25
  var sliderRoot = exports.sliderRoot = function sliderRoot(Root) {
20
- return /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
21
- return /*#__PURE__*/_react["default"].createElement(Root, _extends({
26
+ return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
27
+ var _ref$type = _ref.type,
28
+ type = _ref$type === void 0 ? 'single' : _ref$type,
29
+ props = _objectWithoutProperties(_ref, _excluded);
30
+ return /*#__PURE__*/_react["default"].createElement(Root, _extends({}, props, {
22
31
  ref: ref
23
- }, props), isSingleValueProps(props) && /*#__PURE__*/_react["default"].createElement(_components.SingleSlider, props), !isSingleValueProps(props) && /*#__PURE__*/_react["default"].createElement(_components.DoubleSlider, props));
32
+ }), isSingleValueProps(props, type) && /*#__PURE__*/_react["default"].createElement(_components.SingleSlider, props), isDoubleValueProps(props, type) && /*#__PURE__*/_react["default"].createElement(_components.DoubleUncontrolled, props));
24
33
  });
25
34
  };
26
35
  var sliderConfig = exports.sliderConfig = {
@@ -12,7 +12,7 @@ var _utils = /*#__PURE__*/require("../../utils");
12
12
  var _utils2 = /*#__PURE__*/require("../../../../utils");
13
13
  var _Slider = /*#__PURE__*/require("../../Slider.tokens");
14
14
  var _Double = /*#__PURE__*/require("./Double.styles");
15
- var _excluded = ["min", "max", "value", "disabled", "label", "labelContentLeft", "size", "onChangeCommitted", "onChangeTextField", "onBlurTextField", "onKeyDownTextField", "onChange", "ariaLabel", "multipleStepSize"];
15
+ var _excluded = ["min", "max", "value", "disabled", "label", "labelContentLeft", "size", "onChangeCommitted", "onChangeTextField", "onBlurTextField", "onKeyDownTextField", "onChange", "ariaLabel", "multipleStepSize", "name"];
16
16
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
17
  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; }
18
18
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -53,6 +53,7 @@ var DoubleSlider = exports.DoubleSlider = function DoubleSlider(_ref) {
53
53
  ariaLabel = _ref.ariaLabel,
54
54
  _ref$multipleStepSize = _ref.multipleStepSize,
55
55
  multipleStepSize = _ref$multipleStepSize === void 0 ? 10 : _ref$multipleStepSize,
56
+ name = _ref.name,
56
57
  rest = _objectWithoutProperties(_ref, _excluded);
57
58
  var _useState = (0, _react.useState)({
58
59
  stepSize: 0,
@@ -88,6 +89,8 @@ var DoubleSlider = exports.DoubleSlider = function DoubleSlider(_ref) {
88
89
  var secondHandleRef = (0, _react.useRef)(null);
89
90
  var firstHandleValue = (0, _react.useRef)(value[0]);
90
91
  var secondHandleValue = (0, _react.useRef)(value[1]);
92
+ var innerRefFirst = (0, _react.useRef)(null);
93
+ var innerRefSecond = (0, _react.useRef)(null);
91
94
  var stepSize = state.stepSize;
92
95
  var hasLabelContent = label || labelContentLeft;
93
96
  var firstInputActiveClass = firstInputActive && !disabled ? _Slider.classes.textFieldActive : undefined;
@@ -106,6 +109,23 @@ var DoubleSlider = exports.DoubleSlider = function DoubleSlider(_ref) {
106
109
  });
107
110
  });
108
111
  }, [value, stepSize, min, max, setFirstValue, setSecondValue]);
112
+ (0, _react.useEffect)(function () {
113
+ if (innerRefSecond.current && onChangeCommitted) {
114
+ innerRefSecond.current.addEventListener('setInitValue', function (e) {
115
+ var firstElement = innerRefFirst.current;
116
+ var firstValueInit = Number(firstElement.getAttribute('defaultValue'));
117
+ var secondValueInit = (0, _utils.setInitValue)(e);
118
+ onChangeCommitted([firstValueInit, secondValueInit]);
119
+ setFirstValue(firstValueInit);
120
+ setSecondValue(secondValueInit);
121
+ });
122
+ }
123
+ return function () {
124
+ if (innerRefSecond.current && onChangeCommitted) {
125
+ innerRefSecond.current.addEventListener('setInitValue', function () {});
126
+ }
127
+ };
128
+ }, [innerRefSecond]);
109
129
  var setStepSize = (0, _react.useCallback)(function (newStepSize) {
110
130
  setState(function (prevState) {
111
131
  return _objectSpread(_objectSpread({}, prevState), {}, {
@@ -314,5 +334,19 @@ var DoubleSlider = exports.DoubleSlider = function DoubleSlider(_ref) {
314
334
  onChange: onSecondTextfieldChange,
315
335
  onBlur: onSecondTextfieldBlur,
316
336
  onKeyDown: onTextfieldKeyDown
317
- }))));
337
+ }))), /*#__PURE__*/_react["default"].createElement(_Double.InputHidden, {
338
+ name: name,
339
+ type: "number",
340
+ datatype: "slider-double",
341
+ "data-slidertype": "min",
342
+ value: firstValue,
343
+ ref: innerRefFirst
344
+ }), /*#__PURE__*/_react["default"].createElement(_Double.InputHidden, {
345
+ name: name,
346
+ type: "number",
347
+ datatype: "slider-double",
348
+ "data-slidertype": "max",
349
+ value: secondValue,
350
+ ref: innerRefSecond
351
+ }));
318
352
  };
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.StyledInput = exports.SliderWrapper = exports.LabelWrapper = exports.LabelContentLeft = exports.Label = exports.InputsWrapper = exports.DoubleWrapper = void 0;
6
+ exports.StyledInput = exports.SliderWrapper = exports.LabelWrapper = exports.LabelContentLeft = exports.Label = exports.InputsWrapper = exports.InputHidden = exports.DoubleWrapper = void 0;
7
7
  var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
8
8
  var _Slider = /*#__PURE__*/require("../../Slider.tokens");
9
9
  var _engines = /*#__PURE__*/require("../../../../engines");
@@ -33,4 +33,7 @@ var DoubleWrapper = exports.DoubleWrapper = /*#__PURE__*/_styledComponents["defa
33
33
  })(["opacity:var(", ");"], _Slider.tokens.disabledOpacity);
34
34
  var SliderWrapper = exports.SliderWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
35
35
  componentId: "plasma-new-hope__sc-97pdfk-6"
36
- })([""]);
36
+ })([""]);
37
+ var InputHidden = exports.InputHidden = /*#__PURE__*/_styledComponents["default"].input.withConfig({
38
+ componentId: "plasma-new-hope__sc-97pdfk-7"
39
+ })(["visibility:hidden;width:0;height:0;opacity:0;margin:0;padding:0;"]);
@@ -0,0 +1,60 @@
1
+ "use strict";
2
+
3
+ function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.DoubleUncontrolled = void 0;
8
+ var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
9
+ var _index = /*#__PURE__*/require("../index");
10
+ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
11
+ 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; }
12
+ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
13
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
14
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
15
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
16
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
17
+ function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
18
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
19
+ var DoubleUncontrolled = exports.DoubleUncontrolled = function DoubleUncontrolled(props) {
20
+ var _useState = (0, _react.useState)([props.min, props.max]),
21
+ _useState2 = _slicedToArray(_useState, 2),
22
+ sliderValue = _useState2[0],
23
+ setSliderValue = _useState2[1];
24
+ var sortValues = function sortValues(values) {
25
+ return values.map(function (val) {
26
+ if (val < props.min) {
27
+ return props.min;
28
+ }
29
+ if (val > props.max) {
30
+ return props.max;
31
+ }
32
+ return val;
33
+ }).sort(function (a, b) {
34
+ return a - b;
35
+ });
36
+ };
37
+ var onChangeHandle = function onChangeHandle(values) {
38
+ setSliderValue(sortValues(values));
39
+ };
40
+ var onChangeCommitedHandle = function onChangeCommitedHandle(values) {
41
+ setSliderValue(sortValues(values));
42
+ };
43
+ var onBlurTextField = function onBlurTextField(values) {
44
+ setSliderValue(sortValues(values));
45
+ };
46
+ var onKeyDownTextField = function onKeyDownTextField(values, event) {
47
+ if (event.key === 'Enter') {
48
+ setSliderValue(sortValues(values));
49
+ }
50
+ };
51
+ return props.value ? /*#__PURE__*/_react["default"].createElement(_index.DoubleSlider, _extends({}, props, {
52
+ value: props.value
53
+ })) : /*#__PURE__*/_react["default"].createElement(_index.DoubleSlider, _extends({
54
+ value: sliderValue,
55
+ onKeyDownTextField: onKeyDownTextField,
56
+ onBlurTextField: onBlurTextField,
57
+ onChangeCommitted: onChangeCommitedHandle,
58
+ onChange: onChangeHandle
59
+ }, props));
60
+ };
@@ -0,0 +1,5 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
@@ -12,7 +12,7 @@ var _utils = /*#__PURE__*/require("../../utils");
12
12
  var _utils2 = /*#__PURE__*/require("../../../../utils");
13
13
  var _Slider = /*#__PURE__*/require("../../Slider.tokens");
14
14
  var _Single = /*#__PURE__*/require("./Single.styles");
15
- var _excluded = ["min", "max", "value", "disabled", "onChangeCommitted", "onChange", "ariaLabel", "label", "labelContentLeft", "showRangeValues", "showCurrentValue", "hideMinValueDiff", "hideMaxValueDiff", "labelPlacement", "rangeValuesPlacement", "multipleStepSize", "size"];
15
+ var _excluded = ["min", "max", "value", "disabled", "onChangeCommitted", "onChange", "ariaLabel", "label", "labelContentLeft", "showRangeValues", "showCurrentValue", "hideMinValueDiff", "hideMaxValueDiff", "labelPlacement", "rangeValuesPlacement", "multipleStepSize", "size", "name"];
16
16
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
17
17
  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; }
18
18
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
@@ -32,7 +32,8 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
32
32
  var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
33
33
  var min = _ref.min,
34
34
  max = _ref.max,
35
- value = _ref.value,
35
+ _ref$value = _ref.value,
36
+ value = _ref$value === void 0 ? min : _ref$value,
36
37
  disabled = _ref.disabled,
37
38
  onChangeCommitted = _ref.onChangeCommitted,
38
39
  onChange = _ref.onChange,
@@ -51,6 +52,7 @@ var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
51
52
  multipleStepSize = _ref$multipleStepSize === void 0 ? 10 : _ref$multipleStepSize,
52
53
  _ref$size = _ref.size,
53
54
  size = _ref$size === void 0 ? 'm' : _ref$size,
55
+ name = _ref.name,
54
56
  rest = _objectWithoutProperties(_ref, _excluded);
55
57
  var _useState = (0, _react.useState)({
56
58
  xHandle: 0,
@@ -60,6 +62,7 @@ var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
60
62
  _useState2 = _slicedToArray(_useState, 2),
61
63
  state = _useState2[0],
62
64
  setState = _useState2[1];
65
+ var innerRef = (0, _react.useRef)(null);
63
66
  var _useState3 = (0, _react.useState)(0),
64
67
  _useState4 = _slicedToArray(_useState3, 2),
65
68
  startOffset = _useState4[0],
@@ -76,14 +79,14 @@ var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
76
79
  var hasLabelContent = label || labelContentLeft;
77
80
  var labelPlacementClass = labelPlacement === 'outer' ? _Slider.classes.labelPlacementOuter : _Slider.classes.labelPlacementInner;
78
81
  var rangeValuesPlacementClass = rangeValuesPlacement === 'outer' ? _Slider.classes.rangeValuesPlacementOuter : _Slider.classes.rangeValuesPlacementInner;
79
- var hideMinValueDiffClass = hideMinValueDiff && value - min <= hideMinValueDiff ? _Slider.classes.hideMinValue : '';
80
- var hideMaxValueDiffClass = hideMaxValueDiff && max - value <= hideMaxValueDiff ? _Slider.classes.hideMaxValue : '';
82
+ var hideMinValueDiffClass = hideMinValueDiff && dragValue - min <= hideMinValueDiff ? _Slider.classes.hideMinValue : '';
83
+ var hideMaxValueDiffClass = hideMaxValueDiff && max - dragValue <= hideMaxValueDiff ? _Slider.classes.hideMaxValue : '';
81
84
  var startLabelRef = (0, _react.useRef)(null);
82
85
  var endLabelRef = (0, _react.useRef)(null);
83
86
  var activeFirstValue = dragValue === min ? _Slider.classes.activeRangeValue : undefined;
84
87
  var activeSecondValue = dragValue === max ? _Slider.classes.activeRangeValue : undefined;
85
88
  (0, _react.useEffect)(function () {
86
- var localValue = Math.min(Math.max(value, min), max) - min;
89
+ var localValue = Math.min(Math.max(dragValue, min), max) - min;
87
90
  if (rangeValuesPlacement === 'outer') {
88
91
  var _startLabelRef$curren, _endLabelRef$current;
89
92
  var startWidth = (_startLabelRef$curren = startLabelRef.current) === null || _startLabelRef$curren === void 0 ? void 0 : _startLabelRef$curren.offsetWidth;
@@ -104,7 +107,21 @@ var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
104
107
  railFillWidth: stepSize * localValue
105
108
  });
106
109
  });
107
- }, [value, labelPlacement, stepSize, rangeValuesPlacement, min, max, setStartOffset, setEndOffset]);
110
+ }, [dragValue, labelPlacement, stepSize, rangeValuesPlacement, min, max, setStartOffset, setEndOffset]);
111
+ (0, _react.useEffect)(function () {
112
+ if (innerRef.current) {
113
+ innerRef.current.addEventListener('setInitValue', function (e) {
114
+ return setDragValue((0, _utils.setInitValue)(e));
115
+ });
116
+ }
117
+ return function () {
118
+ if (innerRef.current) {
119
+ innerRef.current.addEventListener('setInitValue', function (e) {
120
+ return setDragValue((0, _utils.setInitValue)(e));
121
+ });
122
+ }
123
+ };
124
+ }, [innerRef]);
108
125
  var setStepSize = (0, _react.useCallback)(function (newStepSize) {
109
126
  setState(function (prevState) {
110
127
  return _objectSpread(_objectSpread({}, prevState), {}, {
@@ -172,5 +189,11 @@ var SingleSlider = exports.SingleSlider = function SingleSlider(_ref) {
172
189
  })), showRangeValues && /*#__PURE__*/_react["default"].createElement(_Single.StyledRangeValue, {
173
190
  ref: endLabelRef,
174
191
  className: (0, _utils2.cx)(_Slider.classes.maxRangeValue, hideMaxValueDiffClass, activeSecondValue)
175
- }, max)));
192
+ }, max)), /*#__PURE__*/_react["default"].createElement(_Single.InputHidden, {
193
+ name: name,
194
+ type: "number",
195
+ datatype: "slider-single",
196
+ value: dragValue,
197
+ ref: innerRef
198
+ }));
176
199
  };
@@ -3,7 +3,7 @@
3
3
  Object.defineProperty(exports, "__esModule", {
4
4
  value: true
5
5
  });
6
- exports.StyledRangeValue = exports.SliderBaseWrapper = exports.SingleWrapper = exports.LabelWrapper = exports.LabelContentLeft = exports.Label = void 0;
6
+ exports.StyledRangeValue = exports.SliderBaseWrapper = exports.SingleWrapper = exports.LabelWrapper = exports.LabelContentLeft = exports.Label = exports.InputHidden = void 0;
7
7
  var _styledComponents = /*#__PURE__*/_interopRequireDefault( /*#__PURE__*/require("styled-components"));
8
8
  var _Slider = /*#__PURE__*/require("../../Slider.tokens");
9
9
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
@@ -24,4 +24,7 @@ var SliderBaseWrapper = exports.SliderBaseWrapper = /*#__PURE__*/_styledComponen
24
24
  })(["position:relative;display:flex;flex:1;&.", "{", "{position:absolute;bottom:var(", ");left:0;&.", "{left:unset;right:0;}}}&.", "{align-items:center;", "{margin-right:var(", ");&.", "{margin-right:0;margin-left:var(", ");}}}"], _Slider.classes.rangeValuesPlacementOuter, StyledRangeValue, _Slider.tokens.rangeValueBottomOffset, _Slider.classes.maxRangeValue, _Slider.classes.rangeValuesPlacementInner, StyledRangeValue, _Slider.tokens.rangeMinValueMargin, _Slider.classes.maxRangeValue, _Slider.tokens.rangeMaxValueMargin);
25
25
  var SingleWrapper = exports.SingleWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
26
26
  componentId: "plasma-new-hope__sc-1qm4elt-5"
27
- })(["display:flex;opacity:var(", ");&.", "{flex-direction:column;", "{margin-bottom:var(", ");}}&.", "{", "{margin-right:var(", ");}}"], _Slider.tokens.disabledOpacity, _Slider.classes.labelPlacementOuter, LabelWrapper, _Slider.tokens.labelWrapperMarginBottom, _Slider.classes.labelPlacementInner, LabelWrapper, _Slider.tokens.labelWrapperMarginRight);
27
+ })(["display:flex;opacity:var(", ");&.", "{flex-direction:column;", "{margin-bottom:var(", ");}}&.", "{", "{margin-right:var(", ");}}"], _Slider.tokens.disabledOpacity, _Slider.classes.labelPlacementOuter, LabelWrapper, _Slider.tokens.labelWrapperMarginBottom, _Slider.classes.labelPlacementInner, LabelWrapper, _Slider.tokens.labelWrapperMarginRight);
28
+ var InputHidden = exports.InputHidden = /*#__PURE__*/_styledComponents["default"].input.withConfig({
29
+ componentId: "plasma-new-hope__sc-1qm4elt-6"
30
+ })(["visibility:hidden;width:0;height:0;opacity:0;margin:0;padding:0;"]);
@@ -24,4 +24,15 @@ Object.keys(_Double).forEach(function (key) {
24
24
  return _Double[key];
25
25
  }
26
26
  });
27
+ });
28
+ var _DoubleUncontrolled = /*#__PURE__*/require("./DoubleUncontrolled/DoubleUncontrolled");
29
+ Object.keys(_DoubleUncontrolled).forEach(function (key) {
30
+ if (key === "default" || key === "__esModule") return;
31
+ if (key in exports && exports[key] === _DoubleUncontrolled[key]) return;
32
+ Object.defineProperty(exports, key, {
33
+ enumerable: true,
34
+ get: function get() {
35
+ return _DoubleUncontrolled[key];
36
+ }
37
+ });
27
38
  });
@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
5
5
  });
6
6
  exports.getOffsets = getOffsets;
7
7
  exports.getSliderThumbValue = getSliderThumbValue;
8
- exports.sizeData = void 0;
8
+ exports.sizeData = exports.setInitValue = void 0;
9
9
  /**
10
10
  * Расчитать значение слайдера с учетом его координат и шага изменений.
11
11
  * @param {number} handleCenterXRelative
@@ -52,4 +52,9 @@ var sizeData = exports.sizeData = {
52
52
  indent: 0.75,
53
53
  fontSizeMultiplier: 16
54
54
  }
55
+ };
56
+ var setInitValue = exports.setInitValue = function setInitValue(e) {
57
+ var item = e.target;
58
+ var defaultValue = Number(item.getAttribute('defaultValue'));
59
+ return defaultValue;
55
60
  };
@@ -126,7 +126,7 @@ var textAreaRoot = exports.textAreaRoot = function textAreaRoot(Root) {
126
126
  _useState6 = _slicedToArray(_useState5, 2),
127
127
  uncontrolledValue = _useState6[0],
128
128
  setUncontrolledValue = _useState6[1];
129
- var outerRef = innerRef && 'current' in innerRef ? innerRef : /*#__PURE__*/(0, _react.createRef)();
129
+ var outerRef = /*#__PURE__*/(0, _react.createRef)();
130
130
  var innerOptional = required ? false : optional;
131
131
  var hasHelper = Boolean(leftHelper || rightHelper || helperText);
132
132
  var hasOuterLabel = Boolean(label && labelPlacement === 'outer');
@@ -198,7 +198,7 @@ var textAreaRoot = exports.textAreaRoot = function textAreaRoot(Root) {
198
198
  hasContentRight: Boolean(contentRight),
199
199
  hasHelper: hasHelper,
200
200
  applyCustomWidth: applyCustomWidth,
201
- ref: outerRef,
201
+ ref: (0, _utils.mergeRefs)(outerRef, innerRef),
202
202
  disabled: disabled,
203
203
  height: autoResize ? minAuto : height,
204
204
  width: width,
@@ -0,0 +1,191 @@
1
+ import { useForm, Controller } from 'react-hook-form';
2
+ import React from 'react';
3
+ import type { Meta, StoryObj } from '@storybook/react';
4
+
5
+ import { WithTheme } from '../../../_helpers';
6
+ import { Button } from '../Button/Button';
7
+ import { TextField } from '../TextField/TextField';
8
+ import { TextArea } from '../TextArea/TextArea'; // TextArea.tsx 120 строка, не работает из-за некорректного ref
9
+ import { Checkbox } from '../Checkbox/Checkbox';
10
+ import { Switch } from '../Switch/Switch';
11
+ import { Radiobox } from '../Radiobox/Radiobox';
12
+ import { RadioGroup } from '../../../../components/Radiobox';
13
+ import { Slider } from '../Slider/Slider';
14
+ import { useFormPlasma } from '../../../../hooks';
15
+ import { Calendar, CalendarBase, CalendarBaseRange, CalendarDouble, CalendarDoubleRange } from '../Calendar/Calendar';
16
+
17
+ type StoryDropdownProps = {};
18
+
19
+ const langName = 'language';
20
+ const itemsRadiobox = [
21
+ { langName, value: 'c', label: 'C', disabled: false },
22
+ { langName, value: 'cpp', label: 'C++', disabled: false },
23
+ { langName, value: 'assembly', label: 'Assembly', disabled: false },
24
+ ];
25
+
26
+ const DefaultForm = () => {
27
+ const onSubmit = (data) => {
28
+ console.log(data);
29
+ };
30
+
31
+ const { formRef, formData } = useFormPlasma(onSubmit, {
32
+ textfield: 'textfield',
33
+ textarea: 'textarea',
34
+ checkbox: 'checkobox',
35
+ switch: true,
36
+ radiobox: 'c',
37
+ slider: 10,
38
+ sliderd: [10, 20],
39
+ });
40
+
41
+ return (
42
+ <form onSubmit={formData} style={{ display: 'flex', flexDirection: 'column', gap: '20px' }} ref={formRef}>
43
+ <TextField name="textfield" placeholder="Textfield" required={false} />
44
+ <TextArea name="textarea" autoResize placeholder="Textarea" />
45
+ <Checkbox name="checkbox" label="Checkbox" />
46
+ <Switch name="switch" label="Switch" labelPosition="after" />
47
+ <RadioGroup aria-labelledby="radiogroup-title-id">
48
+ <div id="radiogroup-title-id" style={{ margin: '1rem 0', fontWeight: '600' }}>
49
+ Выберите язык программирования для изучения.
50
+ </div>
51
+ {itemsRadiobox.map((item) => (
52
+ <Radiobox
53
+ name="radiobox"
54
+ key={item.value}
55
+ value={item.value}
56
+ label={item.label}
57
+ disabled={item.disabled}
58
+ />
59
+ ))}
60
+ </RadioGroup>
61
+ <Slider name="slider" label="Slider" type="single" min={0} max={100} />
62
+ <Slider name="sliderd" label="Slider" type="double" min={0} max={100} />
63
+ <Button type="submit">Отправить</Button>
64
+ </form>
65
+ );
66
+ };
67
+
68
+ const meta: Meta<StoryDropdownProps> = {
69
+ title: 'plasma_b2c/Form',
70
+ decorators: [WithTheme],
71
+ component: DefaultForm,
72
+ };
73
+
74
+ export default meta;
75
+
76
+ const StoryPlasmaForm = () => {
77
+ return <DefaultForm />;
78
+ };
79
+
80
+ export const Default: StoryObj<StoryDropdownProps> = {
81
+ render: () => <StoryPlasmaForm />,
82
+ };
83
+
84
+ const DefaultUseForm = () => {
85
+ const { register, handleSubmit } = useForm({
86
+ defaultValues: {
87
+ textfield: 'John Doe',
88
+ textarea: 'Default description',
89
+ checkbox: true,
90
+ switch: true,
91
+ radiobox: 'c',
92
+ slider: 10,
93
+ },
94
+ });
95
+ const onSubmit = (data) => {
96
+ console.log(data);
97
+ };
98
+
99
+ return (
100
+ <form onSubmit={handleSubmit(onSubmit)} style={{ display: 'flex', flexDirection: 'column', gap: '20px' }}>
101
+ <TextField {...register('textfield')} placeholder="Textfield" required={false} />
102
+ <TextArea {...register('textarea')} autoResize placeholder="Textarea" />
103
+ <Checkbox {...register('checkbox')} label="Checkbox" />
104
+ <Switch {...register('switch')} label="Switch" labelPosition="after" />
105
+ <RadioGroup aria-labelledby="radiogroup-title-id">
106
+ <div id="radiogroup-title-id" style={{ margin: '1rem 0', fontWeight: '600' }}>
107
+ Выберите язык программирования для изучения.
108
+ </div>
109
+ {itemsRadiobox.map((item) => (
110
+ <Radiobox
111
+ {...register('radiobox')}
112
+ key={item.value}
113
+ value={item.value}
114
+ label={item.label}
115
+ disabled={item.disabled}
116
+ />
117
+ ))}
118
+ </RadioGroup>
119
+ <Button type="submit">Отправить</Button>
120
+ </form>
121
+ );
122
+ };
123
+
124
+ const StoryHookForm = () => {
125
+ return <DefaultUseForm />;
126
+ };
127
+
128
+ export const UseHookForm: StoryObj<StoryDropdownProps> = {
129
+ render: () => <StoryHookForm />,
130
+ };
131
+
132
+ const DefaultUseFormController = () => {
133
+ const { control, handleSubmit } = useForm({
134
+ defaultValues: {
135
+ textfield: 'John Doe',
136
+ textarea: 'Default description',
137
+ checkbox: true,
138
+ switch: true,
139
+ radiobox: 'c',
140
+ slider: 10,
141
+ sliderd: [10, 20],
142
+ },
143
+ });
144
+ const onSubmit = (data) => {
145
+ console.log(data);
146
+ };
147
+
148
+ return (
149
+ <form onSubmit={handleSubmit(onSubmit)} style={{ display: 'flex', flexDirection: 'column', gap: '20px' }}>
150
+ <Controller
151
+ name="textfield"
152
+ control={control}
153
+ render={({ field }) => <TextField {...field} label="TextField" />}
154
+ />
155
+ <Controller
156
+ name="textarea"
157
+ control={control}
158
+ render={({ field }) => <TextArea {...field} label="TextArea" />}
159
+ />
160
+ <Controller
161
+ name="checkbox"
162
+ control={control}
163
+ render={({ field }) => <Checkbox {...field} checked={field.value} label="Checkbox" />}
164
+ />
165
+ <Controller
166
+ name="switch"
167
+ control={control}
168
+ render={({ field }) => <Switch {...field} checked={field.value} labelPosition="after" label="Switch" />}
169
+ />
170
+ <Controller
171
+ name="slider"
172
+ control={control}
173
+ render={({ field }) => <Slider {...field} type="single" label="Slider" min={0} max={100} />}
174
+ />
175
+ <Controller
176
+ name="sliderd"
177
+ control={control}
178
+ render={({ field }) => <Slider {...field} type="double" label="Slider" min={0} max={100} />}
179
+ />
180
+ <Button type="submit">Отправить</Button>
181
+ </form>
182
+ );
183
+ };
184
+
185
+ const StoryHookFormController = () => {
186
+ return <DefaultUseFormController />;
187
+ };
188
+
189
+ export const UseHookFormController: StoryObj<StoryDropdownProps> = {
190
+ render: () => <StoryHookFormController />,
191
+ };