@salutejs/plasma-new-hope 0.114.0-canary.1332.10195467656.0 → 0.115.0-canary.1335.10199765951.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (186) hide show
  1. package/cjs/components/Combobox/Combobox.js +16 -13
  2. package/cjs/components/Combobox/Combobox.js.map +1 -1
  3. package/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
  4. package/cjs/components/DatePicker/DatePickerBase.styles.js.map +1 -1
  5. package/cjs/components/DatePicker/DatePickerBase.styles_192va2p.css +1 -0
  6. package/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
  7. package/cjs/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  8. package/cjs/components/DatePicker/SingleDate/SingleDate.css +4 -4
  9. package/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
  10. package/cjs/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
  11. package/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +1 -1
  12. package/cjs/components/DatePicker/SingleDate/SingleDate.styles.js.map +1 -1
  13. package/cjs/components/DatePicker/SingleDate/SingleDate.styles_18z9fw1.css +5 -0
  14. package/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  15. package/cjs/components/DatePicker/SingleDate/variations/_size/base.js.map +1 -1
  16. package/cjs/components/DatePicker/SingleDate/variations/_size/base_lf7y25.css +1 -0
  17. package/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +30 -0
  18. package/cjs/components/DatePicker/hooks/useKeyboardNavigation.js.map +1 -0
  19. package/cjs/components/Select/Select.js +1 -1
  20. package/cjs/components/Select/Select.js.map +1 -1
  21. package/cjs/components/Select/ui/Target/Target.js +3 -3
  22. package/cjs/components/Select/ui/Target/Target.js.map +1 -1
  23. package/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
  24. package/cjs/components/Select/ui/Target/ui/Button/Button.js.map +1 -1
  25. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  26. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
  27. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
  28. package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
  29. package/cjs/components/Sheet/Sheet.js +8 -6
  30. package/cjs/components/Sheet/Sheet.js.map +1 -1
  31. package/cjs/components/Sheet/hooks/useOverflow.js +3 -3
  32. package/cjs/components/Sheet/hooks/useOverflow.js.map +1 -1
  33. package/cjs/components/Sheet/utils/handleTransition.js.map +1 -1
  34. package/cjs/index.css +4 -4
  35. package/emotion/cjs/components/Combobox/Combobox.js +16 -13
  36. package/emotion/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
  37. package/emotion/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
  38. package/emotion/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
  39. package/emotion/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +14 -5
  40. package/emotion/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  41. package/emotion/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +32 -0
  42. package/emotion/cjs/components/Select/Select.js +1 -1
  43. package/emotion/cjs/components/Select/ui/Target/Target.js +3 -3
  44. package/emotion/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
  45. package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  46. package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +14 -14
  47. package/emotion/cjs/components/Sheet/Sheet.js +8 -6
  48. package/emotion/cjs/components/Sheet/Sheet.template-doc.mdx +6 -6
  49. package/emotion/cjs/components/Sheet/hooks/useOverflow.js +3 -3
  50. package/emotion/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
  51. package/emotion/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +7 -7
  52. package/emotion/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
  53. package/emotion/cjs/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
  54. package/emotion/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
  55. package/emotion/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
  56. package/emotion/cjs/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
  57. package/emotion/es/components/Combobox/Combobox.js +16 -13
  58. package/emotion/es/components/DatePicker/DatePickerBase.styles.js +1 -1
  59. package/emotion/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
  60. package/emotion/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
  61. package/emotion/es/components/DatePicker/SingleDate/SingleDate.styles.js +15 -6
  62. package/emotion/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  63. package/emotion/es/components/DatePicker/hooks/useKeyboardNavigation.js +26 -0
  64. package/emotion/es/components/Select/Select.js +1 -1
  65. package/emotion/es/components/Select/ui/Target/Target.js +3 -3
  66. package/emotion/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
  67. package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  68. package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +14 -14
  69. package/emotion/es/components/Sheet/Sheet.js +8 -6
  70. package/emotion/es/components/Sheet/Sheet.template-doc.mdx +6 -6
  71. package/emotion/es/components/Sheet/hooks/useOverflow.js +3 -3
  72. package/emotion/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
  73. package/emotion/es/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +7 -7
  74. package/emotion/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
  75. package/emotion/es/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
  76. package/emotion/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
  77. package/emotion/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
  78. package/emotion/es/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
  79. package/es/components/Combobox/Combobox.js +16 -13
  80. package/es/components/Combobox/Combobox.js.map +1 -1
  81. package/es/components/DatePicker/DatePickerBase.styles.js +1 -1
  82. package/es/components/DatePicker/DatePickerBase.styles.js.map +1 -1
  83. package/es/components/DatePicker/DatePickerBase.styles_192va2p.css +1 -0
  84. package/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
  85. package/es/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
  86. package/es/components/DatePicker/SingleDate/SingleDate.css +4 -4
  87. package/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
  88. package/es/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
  89. package/es/components/DatePicker/SingleDate/SingleDate.styles.js +1 -1
  90. package/es/components/DatePicker/SingleDate/SingleDate.styles.js.map +1 -1
  91. package/es/components/DatePicker/SingleDate/SingleDate.styles_18z9fw1.css +5 -0
  92. package/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  93. package/es/components/DatePicker/SingleDate/variations/_size/base.js.map +1 -1
  94. package/es/components/DatePicker/SingleDate/variations/_size/base_lf7y25.css +1 -0
  95. package/es/components/DatePicker/hooks/useKeyboardNavigation.js +25 -0
  96. package/es/components/DatePicker/hooks/useKeyboardNavigation.js.map +1 -0
  97. package/es/components/Select/Select.js +1 -1
  98. package/es/components/Select/Select.js.map +1 -1
  99. package/es/components/Select/ui/Target/Target.js +3 -3
  100. package/es/components/Select/ui/Target/Target.js.map +1 -1
  101. package/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
  102. package/es/components/Select/ui/Target/ui/Button/Button.js.map +1 -1
  103. package/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  104. package/es/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
  105. package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
  106. package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
  107. package/es/components/Sheet/Sheet.js +8 -6
  108. package/es/components/Sheet/Sheet.js.map +1 -1
  109. package/es/components/Sheet/hooks/useOverflow.js +3 -3
  110. package/es/components/Sheet/hooks/useOverflow.js.map +1 -1
  111. package/es/components/Sheet/utils/handleTransition.js.map +1 -1
  112. package/es/index.css +4 -4
  113. package/package.json +2 -2
  114. package/styled-components/cjs/components/Combobox/Combobox.js +16 -13
  115. package/styled-components/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
  116. package/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
  117. package/styled-components/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
  118. package/styled-components/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +2 -2
  119. package/styled-components/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  120. package/styled-components/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +32 -0
  121. package/styled-components/cjs/components/Select/Select.js +1 -1
  122. package/styled-components/cjs/components/Select/ui/Target/Target.js +3 -3
  123. package/styled-components/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
  124. package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  125. package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
  126. package/styled-components/cjs/components/Sheet/Sheet.js +8 -6
  127. package/styled-components/cjs/components/Sheet/Sheet.template-doc.mdx +6 -6
  128. package/styled-components/cjs/components/Sheet/hooks/useOverflow.js +3 -3
  129. package/styled-components/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
  130. package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +1 -1
  131. package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
  132. package/styled-components/cjs/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
  133. package/styled-components/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
  134. package/styled-components/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
  135. package/styled-components/cjs/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
  136. package/styled-components/es/components/Combobox/Combobox.js +16 -13
  137. package/styled-components/es/components/DatePicker/DatePickerBase.styles.js +1 -1
  138. package/styled-components/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
  139. package/styled-components/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
  140. package/styled-components/es/components/DatePicker/SingleDate/SingleDate.styles.js +3 -3
  141. package/styled-components/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
  142. package/styled-components/es/components/DatePicker/hooks/useKeyboardNavigation.js +26 -0
  143. package/styled-components/es/components/Select/Select.js +1 -1
  144. package/styled-components/es/components/Select/ui/Target/Target.js +3 -3
  145. package/styled-components/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
  146. package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
  147. package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
  148. package/styled-components/es/components/Sheet/Sheet.js +8 -6
  149. package/styled-components/es/components/Sheet/Sheet.template-doc.mdx +6 -6
  150. package/styled-components/es/components/Sheet/hooks/useOverflow.js +3 -3
  151. package/styled-components/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
  152. package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +1 -1
  153. package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
  154. package/styled-components/es/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
  155. package/styled-components/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
  156. package/styled-components/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
  157. package/styled-components/es/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
  158. package/types/components/Combobox/Combobox.d.ts.map +1 -1
  159. package/types/components/Combobox/Combobox.types.d.ts +7 -0
  160. package/types/components/Combobox/Combobox.types.d.ts.map +1 -1
  161. package/types/components/DatePicker/DatePickerBase.styles.d.ts.map +1 -1
  162. package/types/components/DatePicker/RangeDate/RangeDate.d.ts.map +1 -1
  163. package/types/components/DatePicker/SingleDate/SingleDate.d.ts.map +1 -1
  164. package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts.map +1 -1
  165. package/types/components/DatePicker/SingleDate/variations/_size/base.d.ts.map +1 -1
  166. package/types/components/DatePicker/hooks/useKeyboardNavigation.d.ts +13 -0
  167. package/types/components/DatePicker/hooks/useKeyboardNavigation.d.ts.map +1 -0
  168. package/types/components/Select/ui/Target/Target.types.d.ts +2 -1
  169. package/types/components/Select/ui/Target/Target.types.d.ts.map +1 -1
  170. package/types/components/Select/ui/Target/ui/Button/Button.types.d.ts +1 -1
  171. package/types/components/Select/ui/Target/ui/Button/Button.types.d.ts.map +1 -1
  172. package/types/components/Select/ui/Target/ui/Textfield/Textfield.d.ts.map +1 -1
  173. package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts +1 -1
  174. package/types/components/Select/ui/Target/ui/Textfield/Textfield.types.d.ts +1 -1
  175. package/types/components/Select/ui/Target/ui/Textfield/Textfield.types.d.ts.map +1 -1
  176. package/types/components/Sheet/Sheet.d.ts.map +1 -1
  177. package/types/components/Sheet/Sheet.types.d.ts +5 -3
  178. package/types/components/Sheet/Sheet.types.d.ts.map +1 -1
  179. package/types/components/Sheet/hooks/useOverflow.d.ts +1 -1
  180. package/types/components/Sheet/utils/handleTransition.d.ts +1 -1
  181. package/cjs/components/DatePicker/DatePickerBase.styles_1whkrlf.css +0 -1
  182. package/cjs/components/DatePicker/SingleDate/SingleDate.styles_qt45m5.css +0 -5
  183. package/cjs/components/DatePicker/SingleDate/variations/_size/base_g7zrur.css +0 -1
  184. package/es/components/DatePicker/DatePickerBase.styles_1whkrlf.css +0 -1
  185. package/es/components/DatePicker/SingleDate/SingleDate.styles_qt45m5.css +0 -5
  186. package/es/components/DatePicker/SingleDate/variations/_size/base_g7zrur.css +0 -1
package/es/index.css CHANGED
@@ -601,9 +601,9 @@
601
601
 
602
602
  .Accordion_styles_rsiff6_bjv6ypd__465a9c67{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column;gap:var(--plasma-accordion-gap);-webkit-align-items:stretch;-webkit-box-align:stretch;-ms-flex-align:stretch;align-items:stretch;height:auto;background:var(--plasma-accordion-background);}.Accordion_styles_rsiff6_bjv6ypd__465a9c67.Accordion_styles_rsiff6_accordionStretchingFixed__465a9c67{width:var(--plasma-accordion-width);}.Accordion_styles_rsiff6_bjv6ypd__465a9c67.Accordion_styles_rsiff6_accordionStretchingFilled__465a9c67{width:100%;}
603
603
 
604
- .DatePickerBase_styles_1whkrlf_s1ywkx25__0de2a50c{width:var(--plasma-date-picker-width);padding-top:var(--plasma-date-picker-calendar-padding-top);box-shadow:var(--plasma-date-picker-calendar-shadow);border-radius:var(--plasma-date-picker-calendar-border-radius);--plasma-calendar-background:var(--plasma-date-picker-calendar__background-color);--plasma-calendar-selected-item-background:var(--plasma-date-picker-calendar__selected-item-background);--plasma-calendar-selected-item-color:var(--plasma-date-picker-calendar__selected-item-color);--plasma-calendar-selectable-item-bg-hover:var(--plasma-date-picker-calendar__selectable-item-background-hover);--plasma-calendar-current-item-border-color:var(--plasma-date-picker-calendar__current-item-border-color);--plasma-calendar-current-item-bg-hover:var(--plasma-date-picker-calendar__current-item-background-hover);--plasma-calendar-current-item-color-hover:var(--plasma-date-picker-calendar__current-item-color-hover);--plasma-calendar-current-item-child-bg-hover:var(--plasma-date-picker-calendar__current-item-child-background-hover);--plasma-calendar-active-item-bg:var(--plasma-date-picker-calendar__active-item-background);--plasma-calendar-active-item-color:var(--plasma-date-picker-calendar__active-item-color);--plasma-calendar-hovered-item-bg:var(--plasma-date-picker-calendar__hovered-item-background);--plasma-calendar-hovered-item-color:var(--plasma-date-picker-calendar__hovered-item-color);--plasma-calendar-range-background:var(--plasma-date-picker-calendar__range-background);--plasma-calendar-outline-focus-color:var(--plasma-date-picker-calendar__outline-focus-color);--plasma-calendar-content-primary-color:var(--plasma-date-picker-calendar__content-primary-color);--plasma-calendar-content-secondary-color:var(--plasma-date-picker-calendar__content-secondary-color);--plasma-calendar-icon-button-color:var(--plasma-date-picker-icon-button__color);--plasma-calendar-icon-button-background:var(--plasma-date-picker-icon-button__background-color);--plasma-calendar-icon-button-color-hover:var(--plasma-date-picker-icon-button__color-hover);--plasma-calendar-icon-button-background-hover:var(--plasma-date-picker-icon-button__background-color-hover);--plasma-calendar-icon-button-color-active:var(--plasma-date-picker-icon-button__color-active);--plasma-calendar-icon-button-background-active:var(--plasma-date-picker-icon-button__background-color-active);--plasma-calendar-width:var(--plasma-date-picker-calendar-width);--plasma-calendar-height:var(--plasma-date-picker-calendar-height);--plasma-calendar-years-padding:var(--plasma-date-picker-calendar__years-padding);--plasma-calendar-year-item-border-radius:var(--plasma-date-picker-calendar__year-item-border-radius);--plasma-calendar-year-item-width:var(--plasma-date-picker-calendar__year-item-width);--plasma-calendar-year-item-height:var(--plasma-date-picker-calendar__year-item-height);--plasma-calendar-year-font-family:var(--plasma-date-picker-calendar__year-font-family);--plasma-calendar-year-font-size:var(--plasma-date-picker-calendar__year-font-size);--plasma-calendar-year-font-style:var(--plasma-date-picker-calendar__year-font-style);--plasma-calendar-year-font-letter-spacing:var(--plasma-date-picker-calendar__year-letter-spacing);--plasma-calendar-year-line-height:var(--plasma-date-picker-calendar__year-line-height);--plasma-calendar-year-font-weight:var(--plasma-date-picker-calendar__year-font-weight);--plasma-calendar-year-selected-font-weight:var(--plasma-date-picker-calendar__year-selected-font-weight);--plasma-calendar-months-padding:var(--plasma-date-picker-calendar__months-padding);--plasma-calendar-month-item-border-radius:var(--plasma-date-picker-calendar__month-item-border-radius);--plasma-calendar-month-item-width:var(--plasma-date-picker-calendar__month-item-width);--plasma-calendar-month-item-height:var(--plasma-date-picker-calendar__month-item-height);--plasma-calendar-month-font-family:var(--plasma-date-picker-calendar__month-font-family);--plasma-calendar-month-font-size:var(--plasma-date-picker-calendar__month-font-size);--plasma-calendar-month-font-style:var(--plasma-date-picker-calendar__month-font-style);--plasma-calendar-month-font-letter-spacing:var(--plasma-date-picker-calendar__month-letter-spacing);--plasma-calendar-month-line-height:var(--plasma-date-picker-calendar__month-line-height);--plasma-calendar-month-font-weight:var(--plasma-date-picker-calendar__month-font-weight);--plasma-calendar-month-selected-font-weight:var(--plasma-date-picker-calendar__month-selected-font-weight);--plasma-calendar-quarters-padding:var(--plasma-date-picker-calendar__quarters-padding);--plasma-calendar-quarter-item-border-radius:var(--plasma-date-picker-calendar__quarter-item-border-radius);--plasma-calendar-quarter-item-width:var(--plasma-date-picker-calendar__quarter-item-width);--plasma-calendar-quarter-item-height:var(--plasma-date-picker-calendar__quarter-item-height);--plasma-calendar-quarter-font-family:var(--plasma-date-picker-calendar__quarter-font-family);--plasma-calendar-quarter-font-size:var(--plasma-date-picker-calendar__quarter-font-size);--plasma-calendar-quarter-font-style:var(--plasma-date-picker-calendar__quarter-font-style);--plasma-calendar-quarter-font-letter-spacing:var(--plasma-date-picker-calendar__quarter-letter-spacing);--plasma-calendar-quarter-line-height:var(--plasma-date-picker-calendar__quarter-line-height);--plasma-calendar-quarter-font-weight:var(--plasma-date-picker-calendar__quarter-font-weight);--plasma-calendar-quarter-selected-font-weight:var(--plasma-date-picker-calendar__quarter-selected-font-weight);--plasma-calendar-days-padding:var(--plasma-date-picker-calendar__days-padding);--plasma-calendar-day-item-border-radius:var(--plasma-date-picker-calendar__day-item-border-radius);--plasma-calendar-day-item-width:var(--plasma-date-picker-calendar__day-item-width);--plasma-calendar-day-item-height:var(--plasma-date-picker-calendar__day-item-height);--plasma-calendar-day-font-family:var(--plasma-date-picker-calendar__day-font-family);--plasma-calendar-day-font-size:var(--plasma-date-picker-calendar__day-font-size);--plasma-calendar-day-font-style:var(--plasma-date-picker-calendar__day-font-style);--plasma-calendar-day-font-letter-spacing:var(--plasma-date-picker-calendar__day-letter-spacing);--plasma-calendar-day-line-height:var(--plasma-date-picker-calendar__day-line-height);--plasma-calendar-day-font-weight:var(--plasma-date-picker-calendar__day-font-weight);--plasma-calendar-day-selected-font-weight:var(--plasma-date-picker-calendar__day-selected-font-weight);--plasma-calendar-header-wrapper-padding:var(--plasma-date-picker-calendar__header-wrapper-padding);--plasma-calendar-arrow-container-gap:var(--plasma-date-picker-calendar__header-arrow-gap);--plasma-calendar-arrow-container-padding:var(--plasma-date-picker-calendar__header-arrow-padding);--plasma-calendar-header-padding:var(--plasma-date-picker-calendar__header-padding);--plasma-calendar-header-date-gap:var(--plasma-date-picker-calendar__header-date-gap);--plasma-calendar-header-font-family:var(--plasma-date-picker-calendar__header-font-family);--plasma-calendar-header-font-size:var(--plasma-date-picker-calendar__header-font-size);--plasma-calendar-header-font-style:var(--plasma-date-picker-calendar__header-font-style);--plasma-calendar-header-font-letter-spacing:var(--plasma-date-picker-calendar__header-letter-spacing);--plasma-calendar-header-line-height:var(--plasma-date-picker-calendar__header-line-height);--plasma-calendar-header-font-weight:var(--plasma-date-picker-calendar__header-font-weight);--plasma-calendar-header-font-weight-bold:var(--plasma-date-picker-calendar__header-font-weight-bold);--plasma-calendar-icon-button-height:var(--plasma-date-picker-icon-button__height);--plasma-calendar-icon-button-width:var(--plasma-date-picker-icon-button__width);--plasma-calendar-icon-button-padding:var(--plasma-date-picker-icon-button__padding);--plasma-calendar-icon-button-radius:var(--plasma-date-picker-icon-button__radius);--plasma-calendar-icon-button-focus-color:var(--plasma-date-picker-icon-button__focus-color);}
604
+ .DatePickerBase_styles_192va2p_s1ywkx25__54f0dcc0{padding-top:var(--plasma-date-picker-calendar-padding-top);box-shadow:var(--plasma-date-picker-calendar-shadow);border-radius:var(--plasma-date-picker-calendar-border-radius);--plasma-calendar-background:var(--plasma-date-picker-calendar__background-color);--plasma-calendar-selected-item-background:var(--plasma-date-picker-calendar__selected-item-background);--plasma-calendar-selected-item-color:var(--plasma-date-picker-calendar__selected-item-color);--plasma-calendar-selectable-item-bg-hover:var(--plasma-date-picker-calendar__selectable-item-background-hover);--plasma-calendar-current-item-border-color:var(--plasma-date-picker-calendar__current-item-border-color);--plasma-calendar-current-item-bg-hover:var(--plasma-date-picker-calendar__current-item-background-hover);--plasma-calendar-current-item-color-hover:var(--plasma-date-picker-calendar__current-item-color-hover);--plasma-calendar-current-item-child-bg-hover:var(--plasma-date-picker-calendar__current-item-child-background-hover);--plasma-calendar-active-item-bg:var(--plasma-date-picker-calendar__active-item-background);--plasma-calendar-active-item-color:var(--plasma-date-picker-calendar__active-item-color);--plasma-calendar-hovered-item-bg:var(--plasma-date-picker-calendar__hovered-item-background);--plasma-calendar-hovered-item-color:var(--plasma-date-picker-calendar__hovered-item-color);--plasma-calendar-range-background:var(--plasma-date-picker-calendar__range-background);--plasma-calendar-outline-focus-color:var(--plasma-date-picker-calendar__outline-focus-color);--plasma-calendar-content-primary-color:var(--plasma-date-picker-calendar__content-primary-color);--plasma-calendar-content-secondary-color:var(--plasma-date-picker-calendar__content-secondary-color);--plasma-calendar-icon-button-color:var(--plasma-date-picker-icon-button__color);--plasma-calendar-icon-button-background:var(--plasma-date-picker-icon-button__background-color);--plasma-calendar-icon-button-color-hover:var(--plasma-date-picker-icon-button__color-hover);--plasma-calendar-icon-button-background-hover:var(--plasma-date-picker-icon-button__background-color-hover);--plasma-calendar-icon-button-color-active:var(--plasma-date-picker-icon-button__color-active);--plasma-calendar-icon-button-background-active:var(--plasma-date-picker-icon-button__background-color-active);--plasma-calendar-width:var(--plasma-date-picker-calendar-width);--plasma-calendar-height:var(--plasma-date-picker-calendar-height);--plasma-calendar-years-padding:var(--plasma-date-picker-calendar__years-padding);--plasma-calendar-year-item-border-radius:var(--plasma-date-picker-calendar__year-item-border-radius);--plasma-calendar-year-item-width:var(--plasma-date-picker-calendar__year-item-width);--plasma-calendar-year-item-height:var(--plasma-date-picker-calendar__year-item-height);--plasma-calendar-year-font-family:var(--plasma-date-picker-calendar__year-font-family);--plasma-calendar-year-font-size:var(--plasma-date-picker-calendar__year-font-size);--plasma-calendar-year-font-style:var(--plasma-date-picker-calendar__year-font-style);--plasma-calendar-year-font-letter-spacing:var(--plasma-date-picker-calendar__year-letter-spacing);--plasma-calendar-year-line-height:var(--plasma-date-picker-calendar__year-line-height);--plasma-calendar-year-font-weight:var(--plasma-date-picker-calendar__year-font-weight);--plasma-calendar-year-selected-font-weight:var(--plasma-date-picker-calendar__year-selected-font-weight);--plasma-calendar-months-padding:var(--plasma-date-picker-calendar__months-padding);--plasma-calendar-month-item-border-radius:var(--plasma-date-picker-calendar__month-item-border-radius);--plasma-calendar-month-item-width:var(--plasma-date-picker-calendar__month-item-width);--plasma-calendar-month-item-height:var(--plasma-date-picker-calendar__month-item-height);--plasma-calendar-month-font-family:var(--plasma-date-picker-calendar__month-font-family);--plasma-calendar-month-font-size:var(--plasma-date-picker-calendar__month-font-size);--plasma-calendar-month-font-style:var(--plasma-date-picker-calendar__month-font-style);--plasma-calendar-month-font-letter-spacing:var(--plasma-date-picker-calendar__month-letter-spacing);--plasma-calendar-month-line-height:var(--plasma-date-picker-calendar__month-line-height);--plasma-calendar-month-font-weight:var(--plasma-date-picker-calendar__month-font-weight);--plasma-calendar-month-selected-font-weight:var(--plasma-date-picker-calendar__month-selected-font-weight);--plasma-calendar-quarters-padding:var(--plasma-date-picker-calendar__quarters-padding);--plasma-calendar-quarter-item-border-radius:var(--plasma-date-picker-calendar__quarter-item-border-radius);--plasma-calendar-quarter-item-width:var(--plasma-date-picker-calendar__quarter-item-width);--plasma-calendar-quarter-item-height:var(--plasma-date-picker-calendar__quarter-item-height);--plasma-calendar-quarter-font-family:var(--plasma-date-picker-calendar__quarter-font-family);--plasma-calendar-quarter-font-size:var(--plasma-date-picker-calendar__quarter-font-size);--plasma-calendar-quarter-font-style:var(--plasma-date-picker-calendar__quarter-font-style);--plasma-calendar-quarter-font-letter-spacing:var(--plasma-date-picker-calendar__quarter-letter-spacing);--plasma-calendar-quarter-line-height:var(--plasma-date-picker-calendar__quarter-line-height);--plasma-calendar-quarter-font-weight:var(--plasma-date-picker-calendar__quarter-font-weight);--plasma-calendar-quarter-selected-font-weight:var(--plasma-date-picker-calendar__quarter-selected-font-weight);--plasma-calendar-days-padding:var(--plasma-date-picker-calendar__days-padding);--plasma-calendar-day-item-border-radius:var(--plasma-date-picker-calendar__day-item-border-radius);--plasma-calendar-day-item-width:var(--plasma-date-picker-calendar__day-item-width);--plasma-calendar-day-item-height:var(--plasma-date-picker-calendar__day-item-height);--plasma-calendar-day-font-family:var(--plasma-date-picker-calendar__day-font-family);--plasma-calendar-day-font-size:var(--plasma-date-picker-calendar__day-font-size);--plasma-calendar-day-font-style:var(--plasma-date-picker-calendar__day-font-style);--plasma-calendar-day-font-letter-spacing:var(--plasma-date-picker-calendar__day-letter-spacing);--plasma-calendar-day-line-height:var(--plasma-date-picker-calendar__day-line-height);--plasma-calendar-day-font-weight:var(--plasma-date-picker-calendar__day-font-weight);--plasma-calendar-day-selected-font-weight:var(--plasma-date-picker-calendar__day-selected-font-weight);--plasma-calendar-header-wrapper-padding:var(--plasma-date-picker-calendar__header-wrapper-padding);--plasma-calendar-arrow-container-gap:var(--plasma-date-picker-calendar__header-arrow-gap);--plasma-calendar-arrow-container-padding:var(--plasma-date-picker-calendar__header-arrow-padding);--plasma-calendar-header-padding:var(--plasma-date-picker-calendar__header-padding);--plasma-calendar-header-date-gap:var(--plasma-date-picker-calendar__header-date-gap);--plasma-calendar-header-font-family:var(--plasma-date-picker-calendar__header-font-family);--plasma-calendar-header-font-size:var(--plasma-date-picker-calendar__header-font-size);--plasma-calendar-header-font-style:var(--plasma-date-picker-calendar__header-font-style);--plasma-calendar-header-font-letter-spacing:var(--plasma-date-picker-calendar__header-letter-spacing);--plasma-calendar-header-line-height:var(--plasma-date-picker-calendar__header-line-height);--plasma-calendar-header-font-weight:var(--plasma-date-picker-calendar__header-font-weight);--plasma-calendar-header-font-weight-bold:var(--plasma-date-picker-calendar__header-font-weight-bold);--plasma-calendar-icon-button-height:var(--plasma-date-picker-icon-button__height);--plasma-calendar-icon-button-width:var(--plasma-date-picker-icon-button__width);--plasma-calendar-icon-button-padding:var(--plasma-date-picker-icon-button__padding);--plasma-calendar-icon-button-radius:var(--plasma-date-picker-icon-button__radius);--plasma-calendar-icon-button-focus-color:var(--plasma-date-picker-icon-button__focus-color);}
605
605
 
606
- .base_g7zrur_bjvjzuw__a2d99c62 .base_g7zrur_svfqi8__a2d99c62{margin:var(--plasma-date-picker__label-offset);font-family:var(--plasma-date-picker__label-font-family);font-size:var(--plasma-date-picker__label-font-size);font-style:var(--plasma-date-picker__label-font-style);font-weight:var(--plasma-date-picker__label-font-weight);-webkit-letter-spacing:var(--plasma-date-picker__label-letter-spacing);-moz-letter-spacing:var(--plasma-date-picker__label-letter-spacing);-ms-letter-spacing:var(--plasma-date-picker__label-letter-spacing);letter-spacing:var(--plasma-date-picker__label-letter-spacing);line-height:var(--plasma-date-picker__label-line-height);}.base_g7zrur_bjvjzuw__a2d99c62 .base_g7zrur_l5dd1qs__a2d99c62{margin:var(--plasma-date-picker__left-helper-offset);font-family:var(--plasma-date-picker__left-helper-font-family);font-size:var(--plasma-date-picker__left-helper-font-size);font-style:var(--plasma-date-picker__left-helper-font-style);font-weight:var(--plasma-date-picker__left-helper-font-weight);-webkit-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);-moz-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);-ms-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);line-height:var(--plasma-date-picker__left-helper-line-height);}
606
+ .base_lf7y25_bjvjzuw__c1098ff4{width:var(--plasma-date-picker-width);}.base_lf7y25_bjvjzuw__c1098ff4 .base_lf7y25_svfqi8__c1098ff4{margin:var(--plasma-date-picker__label-offset);font-family:var(--plasma-date-picker__label-font-family);font-size:var(--plasma-date-picker__label-font-size);font-style:var(--plasma-date-picker__label-font-style);font-weight:var(--plasma-date-picker__label-font-weight);-webkit-letter-spacing:var(--plasma-date-picker__label-letter-spacing);-moz-letter-spacing:var(--plasma-date-picker__label-letter-spacing);-ms-letter-spacing:var(--plasma-date-picker__label-letter-spacing);letter-spacing:var(--plasma-date-picker__label-letter-spacing);line-height:var(--plasma-date-picker__label-line-height);}.base_lf7y25_bjvjzuw__c1098ff4 .base_lf7y25_l5dd1qs__c1098ff4{margin:var(--plasma-date-picker__left-helper-offset);font-family:var(--plasma-date-picker__left-helper-font-family);font-size:var(--plasma-date-picker__left-helper-font-size);font-style:var(--plasma-date-picker__left-helper-font-style);font-weight:var(--plasma-date-picker__left-helper-font-weight);-webkit-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);-moz-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);-ms-letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);letter-spacing:var(--plasma-date-picker__left-helper-letter-spacing);line-height:var(--plasma-date-picker__left-helper-line-height);}
607
607
 
608
608
  .base_15vaheb_bgt8q06__7d0ca642 .base_15vaheb_svfqi8__7d0ca642{display:block;color:var(--plasma-date-picker__label-color);}.base_15vaheb_bgt8q06__7d0ca642 .base_15vaheb_l5dd1qs__7d0ca642{color:var(--plasma-date-picker__left-helper-color);}
609
609
 
@@ -612,8 +612,8 @@
612
612
  .base_1jucwp_b160pc19__2f1aa288[readonly]{cursor:default;}.base_1jucwp_b160pc19__2f1aa288[readonly] .base_1jucwp_svfqi8__2f1aa288{display:block;color:var(--plasma-date-picker__label-color-readonly);}.base_1jucwp_b160pc19__2f1aa288[readonly] .base_1jucwp_l5dd1qs__2f1aa288{color:var(--plasma-date-picker__left-helper-color-readonly);}
613
613
 
614
614
 
615
- .SingleDate_styles_qt45m5_s15omatb__8a7c51cd{width:100%;--plasma-textfield-color:var(--plasma-date-picker-textfield-color);--plasma-textfield__placeholder-color:var(--plasma-date-picker-textfield-placeholder-color);--plasma-textfield__caret-color:var(--plasma-date-picker-textfield-caret-color);--plasma-textfield-focus-color:var(--plasma-date-picker-textfield-focus-color);--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-focus);--plasma-textfield-border-color:var(--plasma-date-picker_range-border-color);--plasma-textfield-border-color-hover:var(--plasma-date-picker_range-border-color-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker_range-border-color-focus);--plasma-textfield-color-readonly:var(--plasma-date-picker-textfield-color-readonly);--plasma-textfield-bg-color-readonly:var(--plasma-date-picker-textfield-background-color-readonly);--plasma-textfield-border-color-readonly:var(--plasma-date-picker-textfield-border-color-readonly);--plasma-textfield__placeholder-color-readonly:var(--plasma-date-picker-textfield-placeholder-color-readonly);--plasma-textfield-height:var(--plasma-date-picker-textfield-height);--plasma-textfield-border-width:var(--plasma-date-picker-textfield-border-width);--plasma-textfield-border-radius:var(--plasma-date-picker-textfield-border-radius);--plasma-textfield-padding:var(--plasma-date-picker-textfield-padding);--plasma-textfield-placement_inner__label-padding:var(--plasma-date-picker-placement_inner__label-padding);--plasma-textfield-placement_inner__content-padding:var(--plasma-date-picker-placement_inner__content-padding);--plasma-textfield-placement_inner__label-font-family:var(--plasma-date-picker-placement_inner__label-font-family);--plasma-textfield-placement_inner__label-font-size:var(--plasma-date-picker-placement_inner__label-font-size);--plasma-textfield-placement_inner__label-font-style:var(--plasma-date-picker-placement_inner__label-font-style);--plasma-textfield-placement_inner__label-font-weight:var(--plasma-date-picker-placement_inner__label-font-weight);--plasma-textfield-placement_inner__label-letter-spacing:var(--plasma-date-picker-placement_inner__label-letter-spacing);--plasma-textfield-placement_inner__label-line-height:var(--plasma-date-picker-placement_inner__label-line-height);--plasma-textfield__left-content-margin:var(--plasma-date-picker-textfield__left-content-margin);--plasma-textfield__right-content-margin:var(--plasma-date-picker-textfield__right-content-margin);--plasma-textfield-font-family:var(--plasma-date-picker-textfield-font-family);--plasma-textfield-font-size:var(--plasma-date-picker-textfield-font-size);--plasma-textfield-font-style:var(--plasma-date-picker-textfield-font-style);--plasma-textfield-font-weight:var(--plasma-date-picker-textfield-font-weight);--plasma-textfield-letter-spacing:var(--plasma-date-picker-textfield-letter-spacing);--plasma-textfield-line-height:var(--plasma-date-picker-textfield-line-height);--plasma-textfield-disabled-opacity:var(--plasma-date-picker-disabled-opacity);--plasma-textfield__before-text-color:var(--plasma-date-picker-textfield__before-text-color);--plasma-textfield__after-text-color:var(--plasma-date-picker-textfield__after-text-color);--plasma-textfield__before-text-margin:var(--plasma-date-picker-textfield__before-text-margin);--plasma-textfield__after-text-margin:var(--plasma-date-picker-textfield__after-text-margin);}.SingleDate_styles_qt45m5_s15omatb__8a7c51cd.SingleDate_styles_qt45m5_datePickerError__8a7c51cd{--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color-error);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-error-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-error-focus);--plasma-textfield-border-color:var(--plasma-date-picker-textfield-border-color-error);--plasma-textfield-border-color-hover:var(--plasma-date-picker-textfield-border-color-error-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker-textfield-border-color-error-focus);}.SingleDate_styles_qt45m5_s15omatb__8a7c51cd.SingleDate_styles_qt45m5_datePickerSuccess__8a7c51cd{--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color-success);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-success-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-success-focus);--plasma-textfield-border-color:var(--plasma-date-picker-textfield-border-color-success);--plasma-textfield-border-color-hover:var(--plasma-date-picker-textfield-border-color-success-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker-textfield-border-color-success-focus);}
616
- .SingleDate_styles_qt45m5_boba7w3__8a7c51cd{display:inline-block;}.SingleDate_styles_qt45m5_boba7w3__8a7c51cd .SingleDate_styles_qt45m5_popoverWrapper__8a7c51cd,.SingleDate_styles_qt45m5_boba7w3__8a7c51cd .SingleDate_styles_qt45m5_popoverTarget__8a7c51cd{width:inherit;}
615
+ .SingleDate_styles_18z9fw1_s15omatb__5966bc9e{--plasma-textfield-color:var(--plasma-date-picker-textfield-color);--plasma-textfield__placeholder-color:var(--plasma-date-picker-textfield-placeholder-color);--plasma-textfield__caret-color:var(--plasma-date-picker-textfield-caret-color);--plasma-textfield-focus-color:var(--plasma-date-picker-textfield-focus-color);--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-focus);--plasma-textfield-border-color:var(--plasma-date-picker_range-border-color);--plasma-textfield-border-color-hover:var(--plasma-date-picker_range-border-color-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker_range-border-color-focus);--plasma-textfield-color-readonly:var(--plasma-date-picker-textfield-color-readonly);--plasma-textfield-bg-color-readonly:var(--plasma-date-picker-textfield-background-color-readonly);--plasma-textfield-border-color-readonly:var(--plasma-date-picker-textfield-border-color-readonly);--plasma-textfield__placeholder-color-readonly:var(--plasma-date-picker-textfield-placeholder-color-readonly);--plasma-textfield-height:var(--plasma-date-picker-textfield-height);--plasma-textfield-border-width:var(--plasma-date-picker-textfield-border-width);--plasma-textfield-border-radius:var(--plasma-date-picker-textfield-border-radius);--plasma-textfield-padding:var(--plasma-date-picker-textfield-padding);--plasma-textfield-placement_inner__label-padding:var(--plasma-date-picker-placement_inner__label-padding);--plasma-textfield-placement_inner__content-padding:var(--plasma-date-picker-placement_inner__content-padding);--plasma-textfield-placement_inner__label-font-family:var(--plasma-date-picker-placement_inner__label-font-family);--plasma-textfield-placement_inner__label-font-size:var(--plasma-date-picker-placement_inner__label-font-size);--plasma-textfield-placement_inner__label-font-style:var(--plasma-date-picker-placement_inner__label-font-style);--plasma-textfield-placement_inner__label-font-weight:var(--plasma-date-picker-placement_inner__label-font-weight);--plasma-textfield-placement_inner__label-letter-spacing:var(--plasma-date-picker-placement_inner__label-letter-spacing);--plasma-textfield-placement_inner__label-line-height:var(--plasma-date-picker-placement_inner__label-line-height);--plasma-textfield__left-content-margin:var(--plasma-date-picker-textfield__left-content-margin);--plasma-textfield__right-content-margin:var(--plasma-date-picker-textfield__right-content-margin);--plasma-textfield-font-family:var(--plasma-date-picker-textfield-font-family);--plasma-textfield-font-size:var(--plasma-date-picker-textfield-font-size);--plasma-textfield-font-style:var(--plasma-date-picker-textfield-font-style);--plasma-textfield-font-weight:var(--plasma-date-picker-textfield-font-weight);--plasma-textfield-letter-spacing:var(--plasma-date-picker-textfield-letter-spacing);--plasma-textfield-line-height:var(--plasma-date-picker-textfield-line-height);--plasma-textfield-disabled-opacity:var(--plasma-date-picker-disabled-opacity);--plasma-textfield__before-text-color:var(--plasma-date-picker-textfield__before-text-color);--plasma-textfield__after-text-color:var(--plasma-date-picker-textfield__after-text-color);--plasma-textfield__before-text-margin:var(--plasma-date-picker-textfield__before-text-margin);--plasma-textfield__after-text-margin:var(--plasma-date-picker-textfield__after-text-margin);}.SingleDate_styles_18z9fw1_s15omatb__5966bc9e.SingleDate_styles_18z9fw1_datePickerError__5966bc9e{--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color-error);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-error-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-error-focus);--plasma-textfield-border-color:var(--plasma-date-picker-textfield-border-color-error);--plasma-textfield-border-color-hover:var(--plasma-date-picker-textfield-border-color-error-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker-textfield-border-color-error-focus);}.SingleDate_styles_18z9fw1_s15omatb__5966bc9e.SingleDate_styles_18z9fw1_datePickerSuccess__5966bc9e{--plasma-textfield-bg-color:var(--plasma-date-picker-textfield-background-color-success);--plasma-textfield-bg-color-hover:var(--plasma-date-picker-textfield-background-color-success-hover);--plasma-textfield-bg-color-focus:var(--plasma-date-picker-textfield-background-color-success-focus);--plasma-textfield-border-color:var(--plasma-date-picker-textfield-border-color-success);--plasma-textfield-border-color-hover:var(--plasma-date-picker-textfield-border-color-success-hover);--plasma-textfield-border-color-focus:var(--plasma-date-picker-textfield-border-color-success-focus);}
616
+ .SingleDate_styles_18z9fw1_boba7w3__5966bc9e{display:inline-block;}
617
617
 
618
618
 
619
619
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@salutejs/plasma-new-hope",
3
- "version": "0.114.0-canary.1332.10195467656.0",
3
+ "version": "0.115.0-canary.1335.10199765951.0",
4
4
  "description": "Salute Design System blueprint",
5
5
  "main": "cjs/index.js",
6
6
  "module": "es/index.js",
@@ -118,5 +118,5 @@
118
118
  "react-popper": "2.3.0",
119
119
  "storeon": "3.1.5"
120
120
  },
121
- "gitHead": "485c2c0af136bf26323ef5c58d96ace1480248b8"
121
+ "gitHead": "d82bf636acf10efbb9659197290f075efb3b74fa"
122
122
  }
@@ -15,7 +15,7 @@ var _base = /*#__PURE__*/require("./variations/_view/base");
15
15
  var _base2 = /*#__PURE__*/require("./variations/_size/base");
16
16
  var _ui = /*#__PURE__*/require("./ui");
17
17
  var _Combobox = /*#__PURE__*/require("./Combobox.styles");
18
- var _excluded = ["name", "form", "readOnly", "disabled", "label", "placeholder", "id", "children", "role", "view", "size", "frame", "usePortal", "negativeResultContent", "enumerationType", "opened", "placement", "onToggle", "onKeyDown", "filterFunction"];
18
+ var _excluded = ["name", "form", "readOnly", "disabled", "label", "placeholder", "id", "children", "role", "view", "size", "frame", "usePortal", "negativeResultContent", "enumerationType", "opened", "isOpen", "placement", "onToggle", "onKeyDown", "filterFunction"];
19
19
  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); }
20
20
  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; }
21
21
  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); }
@@ -52,12 +52,15 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
52
52
  enumerationType = _ref$enumerationType === void 0 ? 'comma' : _ref$enumerationType,
53
53
  _ref$opened = _ref.opened,
54
54
  opened = _ref$opened === void 0 ? false : _ref$opened,
55
+ _ref$isOpen = _ref.isOpen,
56
+ isOpen = _ref$isOpen === void 0 ? false : _ref$isOpen,
55
57
  _ref$placement = _ref.placement,
56
58
  placement = _ref$placement === void 0 ? 'bottom' : _ref$placement,
57
59
  onToggle = _ref.onToggle,
58
60
  onKeyDown = _ref.onKeyDown,
59
61
  filterFunction = _ref.filterFunction,
60
62
  rest = _objectWithoutProperties(_ref, _excluded);
63
+ var innerIsOpen = opened || isOpen;
61
64
  var forceUpdate = (0, _hooks.useForceUpdate)();
62
65
  var uniqId = (0, _plasmaCore.safeUseId)();
63
66
  var innerId = id || uniqId;
@@ -82,10 +85,10 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
82
85
  itemsRefs: itemsRefs,
83
86
  inputRef: inputRef
84
87
  };
85
- var _useState3 = (0, _react.useState)(opened),
88
+ var _useState3 = (0, _react.useState)(innerIsOpen),
86
89
  _useState4 = _slicedToArray(_useState3, 2),
87
- innerOpened = _useState4[0],
88
- setInnerOpened = _useState4[1];
90
+ isVisible = _useState4[0],
91
+ setIsVisible = _useState4[1];
89
92
  var _useState5 = (0, _react.useState)(''),
90
93
  _useState6 = _slicedToArray(_useState5, 2),
91
94
  search = _useState6[0],
@@ -108,11 +111,11 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
108
111
  if (disabled || readOnly) {
109
112
  return;
110
113
  }
111
- setInnerOpened(opened);
112
- }, [opened, disabled, readOnly]);
114
+ setIsVisible(innerIsOpen);
115
+ }, [innerIsOpen, disabled, readOnly]);
113
116
  (0, _react.useEffect)(function () {
114
117
  // INFO: Для кейсов, когда значение выбрано и нужно вывести весь список
115
- if (opened) {
118
+ if (innerIsOpen) {
116
119
  setFilterValue('');
117
120
  }
118
121
  }, []);
@@ -122,14 +125,14 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
122
125
  }
123
126
 
124
127
  // INFO: Для кейсов, когда значение выбрано и нужно вывести весь список
125
- if (!innerOpened) {
128
+ if (!isVisible) {
126
129
  setFilterValue('');
127
130
  }
128
131
  if (onToggle) {
129
132
  onToggle(openValue, event);
130
133
  return;
131
134
  }
132
- setInnerOpened(openValue);
135
+ setIsVisible(openValue);
133
136
  };
134
137
  var closedWithoutChanges = (0, _react.useRef)(true);
135
138
  var updateValue = function updateValue(item, event) {
@@ -161,7 +164,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
161
164
  };
162
165
  var _useKeyNavigation = (0, _hooks2.useKeyNavigation)({
163
166
  controlledRefs: controlledRefs,
164
- opened: innerOpened,
167
+ opened: isVisible,
165
168
  enumerationType: enumerationType,
166
169
  valueType: valueType,
167
170
  componentType: 'combobox',
@@ -181,7 +184,7 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
181
184
  var onSearch = function onSearch(newSearch, newOpened) {
182
185
  setSearch(newSearch);
183
186
  setFilterValue(newSearch);
184
- setInnerOpened(newOpened !== null && newOpened !== void 0 ? newOpened : true);
187
+ setIsVisible(newOpened !== null && newOpened !== void 0 ? newOpened : true);
185
188
  };
186
189
  var onKeyDownHandle = function onKeyDownHandle(event) {
187
190
  onKeyDown === null || onKeyDown === void 0 || onKeyDown(event);
@@ -200,10 +203,10 @@ var comboboxRoot = exports.comboboxRoot = function comboboxRoot(Root) {
200
203
  disabled: disabled || readOnly
201
204
  }), /*#__PURE__*/_react["default"].createElement(_Combobox.StyledPopover, {
202
205
  role: role,
203
- isOpen: innerOpened,
206
+ isOpen: isVisible,
204
207
  onToggle: onInnerToggle,
205
208
  target: /*#__PURE__*/_react["default"].createElement(_ui.ComboboxTarget, _extends({
206
- opened: innerOpened,
209
+ opened: isVisible,
207
210
  values: values,
208
211
  label: label,
209
212
  placeholder: placeholder,
@@ -16,4 +16,4 @@ var baseCalendarTokens = exports.baseCalendarTokens = /*#__PURE__*/"\n paddin
16
16
  // NOTE: переопределение токенов Calendar
17
17
  var StyledCalendar = exports.StyledCalendar = /*#__PURE__*/(0, _styledComponents["default"])(Calendar).withConfig({
18
18
  componentId: "plasma-new-hope__sc-1i6o09y-0"
19
- })(["width:var(", ");", ""], _DatePicker.tokens.width, baseCalendarTokens);
19
+ })(["", ""], baseCalendarTokens);
@@ -10,6 +10,7 @@ var _utils = /*#__PURE__*/require("../../../utils");
10
10
  var _dateHelper = /*#__PURE__*/require("../utils/dateHelper");
11
11
  var _useDatePicker3 = /*#__PURE__*/require("../hooks/useDatePicker");
12
12
  var _DatePicker = /*#__PURE__*/require("../DatePicker.tokens");
13
+ var _useKeyboardNavigation = /*#__PURE__*/require("../hooks/useKeyboardNavigation");
13
14
  var _base = /*#__PURE__*/require("./variations/_size/base");
14
15
  var _base2 = /*#__PURE__*/require("./variations/_view/base");
15
16
  var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
@@ -181,6 +182,11 @@ var datePickerRangeRoot = exports.datePickerRangeRoot = function datePickerRange
181
182
  }
182
183
  setIsInnerOpen(isCalendarOpen);
183
184
  };
185
+ var _useKeyNavigation = (0, _useKeyboardNavigation.useKeyNavigation)({
186
+ isCalendarOpen: isInnerOpen,
187
+ onToggle: handleToggle
188
+ }),
189
+ onKeyDown = _useKeyNavigation.onKeyDown;
184
190
  var RangeComponent = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_RangeDate.StyledRange, {
185
191
  ref: rangeRef,
186
192
  dividerIcon: dividerIcon,
@@ -224,7 +230,8 @@ var datePickerRangeRoot = exports.datePickerRangeRoot = function datePickerRange
224
230
  onFocusFirstTextfield: onFocusFirstTextfield,
225
231
  onFocusSecondTextfield: onFocusSecondTextfield,
226
232
  onBlurFirstTextfield: onBlurFirstTextfield,
227
- onBlurSecondTextfield: onBlurSecondTextfield
233
+ onBlurSecondTextfield: onBlurSecondTextfield,
234
+ onKeyDown: onKeyDown
228
235
  }));
229
236
  (0, _react.useEffect)(function () {
230
237
  var _rangeRef$current5, _rangeRef$current6;
@@ -232,13 +239,10 @@ var datePickerRangeRoot = exports.datePickerRangeRoot = function datePickerRange
232
239
  setSecondInputRef((_rangeRef$current6 = rangeRef.current) === null || _rangeRef$current6 === void 0 ? void 0 : _rangeRef$current6.secondTextField());
233
240
  }, [rangeRef.current]);
234
241
  (0, _react.useEffect)(function () {
235
- setCalendarFirstValue((0, _dateHelper.formatCalendarValue)(defaultFirstDate, format));
236
- setInputFirstValue((0, _dateHelper.formatInputValue)(defaultFirstDate, format));
237
- }, [defaultFirstDate]);
238
- (0, _react.useEffect)(function () {
239
- setCalendarSecondValue((0, _dateHelper.formatCalendarValue)(defaultSecondDate, format));
240
- setInputSecondValue((0, _dateHelper.formatInputValue)(defaultSecondDate, format));
241
- }, [defaultSecondDate]);
242
+ setIsInnerOpen(function (prevOpen) {
243
+ return prevOpen !== isOpen && isOpen;
244
+ });
245
+ }, [isOpen]);
242
246
  return /*#__PURE__*/_react["default"].createElement(Root, _extends({
243
247
  ref: rootRef,
244
248
  view: view,
@@ -249,7 +253,7 @@ var datePickerRangeRoot = exports.datePickerRangeRoot = function datePickerRange
249
253
  }, rest), label && /*#__PURE__*/_react["default"].createElement(_RangeDate.StyledLabel, null, label), /*#__PURE__*/_react["default"].createElement(_RangeDatePopover.RangeDatePopover, {
250
254
  calendarValue: [calendarFirstValue, calendarSecondValue],
251
255
  target: RangeComponent,
252
- isOpen: isOpen || isInnerOpen,
256
+ isOpen: isInnerOpen,
253
257
  includeEdgeDates: includeEdgeDates,
254
258
  eventList: eventList,
255
259
  disabledList: disabledList,
@@ -11,6 +11,7 @@ var _dateHelper = /*#__PURE__*/require("../utils/dateHelper");
11
11
  var _useDatePicker2 = /*#__PURE__*/require("../hooks/useDatePicker");
12
12
  var _DatePicker = /*#__PURE__*/require("../DatePicker.tokens");
13
13
  var _DatePickerBase = /*#__PURE__*/require("../DatePickerBase.styles");
14
+ var _useKeyboardNavigation = /*#__PURE__*/require("../hooks/useKeyboardNavigation");
14
15
  var _base = /*#__PURE__*/require("./variations/_size/base");
15
16
  var _base2 = /*#__PURE__*/require("./variations/_view/base");
16
17
  var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
@@ -119,6 +120,11 @@ var datePickerRoot = exports.datePickerRoot = function datePickerRoot(Root) {
119
120
  handleToggle = _useDatePicker.handleToggle,
120
121
  handleChangeValue = _useDatePicker.handleChangeValue,
121
122
  handleCommitDate = _useDatePicker.handleCommitDate;
123
+ var _useKeyNavigation = (0, _useKeyboardNavigation.useKeyNavigation)({
124
+ isCalendarOpen: isInnerOpen,
125
+ onToggle: handleToggle
126
+ }),
127
+ onKeyDown = _useKeyNavigation.onKeyDown;
122
128
  var DatePickerInput = /*#__PURE__*/_react["default"].createElement(_SingleDate.StyledInput, _extends({
123
129
  ref: inputRef,
124
130
  className: (0, _utils.cx)(datePickerErrorClass, datePickerSuccessClass),
@@ -136,15 +142,17 @@ var datePickerRoot = exports.datePickerRoot = function datePickerRoot(Root) {
136
142
  return handleCommitDate(date, true, false);
137
143
  },
138
144
  onFocus: onFocus,
139
- onBlur: onBlur
145
+ onBlur: onBlur,
146
+ onKeyDown: onKeyDown
140
147
  }, innerLabelPlacement && {
141
148
  label: label,
142
149
  labelPlacement: labelPlacement
143
150
  }));
144
151
  (0, _react.useEffect)(function () {
145
- setCalendarValue((0, _dateHelper.formatCalendarValue)(defaultDate, format));
146
- setInputValue((0, _dateHelper.formatInputValue)(defaultDate, format));
147
- }, [defaultDate]);
152
+ setIsInnerOpen(function (prevOpen) {
153
+ return prevOpen !== isOpen && isOpen;
154
+ });
155
+ }, [isOpen]);
148
156
  return /*#__PURE__*/_react["default"].createElement(Root, _extends({
149
157
  view: view,
150
158
  size: size,
@@ -153,7 +161,7 @@ var datePickerRoot = exports.datePickerRoot = function datePickerRoot(Root) {
153
161
  readOnly: !disabled && readOnly,
154
162
  ref: ref
155
163
  }, rest), !innerLabelPlacement && label && /*#__PURE__*/_react["default"].createElement(_SingleDate.StyledLabel, null, label), /*#__PURE__*/_react["default"].createElement(_SingleDate.StyledPopover, {
156
- isOpen: isOpen || isInnerOpen,
164
+ isOpen: isInnerOpen,
157
165
  usePortal: false,
158
166
  onToggle: handleToggle,
159
167
  offset: offset,
@@ -23,8 +23,8 @@ var StyledPopover = exports.StyledPopover = /*#__PURE__*/(0, _styledComponents["
23
23
  // NOTE: переопределение токенов TextField
24
24
  var StyledInput = exports.StyledInput = /*#__PURE__*/(0, _styledComponents["default"])(TextField).withConfig({
25
25
  componentId: "plasma-new-hope__sc-1ye0xbz-1"
26
- })(["width:100%;", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], _TextField.textFieldTokens.color, _DatePicker.tokens.textFieldColor, _TextField.textFieldTokens.placeholderColor, _DatePicker.tokens.textFieldPlaceholderColor, _TextField.textFieldTokens.caretColor, _DatePicker.tokens.textFieldCaretColor, _TextField.textFieldTokens.focusColor, _DatePicker.tokens.textFieldFocusColor, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.borderColor, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.borderColorFocus, _TextField.textFieldTokens.colorReadOnly, _DatePicker.tokens.textFieldColorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _DatePicker.tokens.textFieldBackgroundColorReadOnly, _TextField.textFieldTokens.borderColorReadOnly, _DatePicker.tokens.textFieldBorderColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _DatePicker.tokens.textFieldPlaceholderColorReadOnly, _TextField.textFieldTokens.height, _DatePicker.tokens.textFieldHeight, _TextField.textFieldTokens.borderWidth, _DatePicker.tokens.textFieldBorderWidth, _TextField.textFieldTokens.borderRadius, _DatePicker.tokens.textFieldBorderRadius, _TextField.textFieldTokens.padding, _DatePicker.tokens.textFieldPadding, _TextField.textFieldTokens.labelInnerPadding, _DatePicker.tokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _DatePicker.tokens.contentLabelInnerPadding, _TextField.textFieldTokens.labelInnerFontFamily, _DatePicker.tokens.labelInnerFontFamily, _TextField.textFieldTokens.labelInnerFontSize, _DatePicker.tokens.labelInnerFontSize, _TextField.textFieldTokens.labelInnerFontStyle, _DatePicker.tokens.labelInnerFontStyle, _TextField.textFieldTokens.labelInnerFontWeight, _DatePicker.tokens.labelInnerFontWeight, _TextField.textFieldTokens.labelInnerLetterSpacing, _DatePicker.tokens.labelInnerLetterSpacing, _TextField.textFieldTokens.labelInnerLineHeight, _DatePicker.tokens.labelInnerLineHeight, _TextField.textFieldTokens.leftContentMargin, _DatePicker.tokens.textFieldLeftContentMargin, _TextField.textFieldTokens.rightContentMargin, _DatePicker.tokens.textFieldRightContentMargin, _TextField.textFieldTokens.fontFamily, _DatePicker.tokens.textFieldFontFamily, _TextField.textFieldTokens.fontSize, _DatePicker.tokens.textFieldFontSize, _TextField.textFieldTokens.fontStyle, _DatePicker.tokens.textFieldFontStyle, _TextField.textFieldTokens.fontWeight, _DatePicker.tokens.textFieldFontWeight, _TextField.textFieldTokens.letterSpacing, _DatePicker.tokens.textFieldLetterSpacing, _TextField.textFieldTokens.lineHeight, _DatePicker.tokens.textFieldLineHeight, _TextField.textFieldTokens.disabledOpacity, _DatePicker.tokens.disabledOpacity, _TextField.textFieldTokens.textBeforeColor, _DatePicker.tokens.textFieldTextBeforeColor, _TextField.textFieldTokens.textAfterColor, _DatePicker.tokens.textFieldTextAfterColor, _TextField.textFieldTokens.textBeforeMargin, _DatePicker.tokens.textFieldTextBeforeMargin, _TextField.textFieldTokens.textAfterMargin, _DatePicker.tokens.textFieldTextAfterMargin, _DatePicker.classes.datePickerError, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundErrorColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundErrorColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundErrorColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.textFieldBorderColorError, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.textFieldBorderColorErrorHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.textFieldBorderColorErrorFocus, _DatePicker.classes.datePickerSuccess, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundSuccessColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundSuccessColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundSuccessColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.textFieldBorderColorSuccess, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.textFieldBorderColorSuccessHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.textFieldBorderColorSuccessFocus);
27
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:inline-block;.", ",.", "{width:inherit;}"], /*#__PURE__*/String(_Popover.popoverClasses.wrapper), /*#__PURE__*/String(_Popover.popoverClasses.target));
26
+ })([" ", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}&.", "{", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");}"], _TextField.textFieldTokens.color, _DatePicker.tokens.textFieldColor, _TextField.textFieldTokens.placeholderColor, _DatePicker.tokens.textFieldPlaceholderColor, _TextField.textFieldTokens.caretColor, _DatePicker.tokens.textFieldCaretColor, _TextField.textFieldTokens.focusColor, _DatePicker.tokens.textFieldFocusColor, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.borderColor, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.borderColorHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.borderColorFocus, _TextField.textFieldTokens.colorReadOnly, _DatePicker.tokens.textFieldColorReadOnly, _TextField.textFieldTokens.backgroundColorReadOnly, _DatePicker.tokens.textFieldBackgroundColorReadOnly, _TextField.textFieldTokens.borderColorReadOnly, _DatePicker.tokens.textFieldBorderColorReadOnly, _TextField.textFieldTokens.placeholderColorReadOnly, _DatePicker.tokens.textFieldPlaceholderColorReadOnly, _TextField.textFieldTokens.height, _DatePicker.tokens.textFieldHeight, _TextField.textFieldTokens.borderWidth, _DatePicker.tokens.textFieldBorderWidth, _TextField.textFieldTokens.borderRadius, _DatePicker.tokens.textFieldBorderRadius, _TextField.textFieldTokens.padding, _DatePicker.tokens.textFieldPadding, _TextField.textFieldTokens.labelInnerPadding, _DatePicker.tokens.labelInnerPadding, _TextField.textFieldTokens.contentLabelInnerPadding, _DatePicker.tokens.contentLabelInnerPadding, _TextField.textFieldTokens.labelInnerFontFamily, _DatePicker.tokens.labelInnerFontFamily, _TextField.textFieldTokens.labelInnerFontSize, _DatePicker.tokens.labelInnerFontSize, _TextField.textFieldTokens.labelInnerFontStyle, _DatePicker.tokens.labelInnerFontStyle, _TextField.textFieldTokens.labelInnerFontWeight, _DatePicker.tokens.labelInnerFontWeight, _TextField.textFieldTokens.labelInnerLetterSpacing, _DatePicker.tokens.labelInnerLetterSpacing, _TextField.textFieldTokens.labelInnerLineHeight, _DatePicker.tokens.labelInnerLineHeight, _TextField.textFieldTokens.leftContentMargin, _DatePicker.tokens.textFieldLeftContentMargin, _TextField.textFieldTokens.rightContentMargin, _DatePicker.tokens.textFieldRightContentMargin, _TextField.textFieldTokens.fontFamily, _DatePicker.tokens.textFieldFontFamily, _TextField.textFieldTokens.fontSize, _DatePicker.tokens.textFieldFontSize, _TextField.textFieldTokens.fontStyle, _DatePicker.tokens.textFieldFontStyle, _TextField.textFieldTokens.fontWeight, _DatePicker.tokens.textFieldFontWeight, _TextField.textFieldTokens.letterSpacing, _DatePicker.tokens.textFieldLetterSpacing, _TextField.textFieldTokens.lineHeight, _DatePicker.tokens.textFieldLineHeight, _TextField.textFieldTokens.disabledOpacity, _DatePicker.tokens.disabledOpacity, _TextField.textFieldTokens.textBeforeColor, _DatePicker.tokens.textFieldTextBeforeColor, _TextField.textFieldTokens.textAfterColor, _DatePicker.tokens.textFieldTextAfterColor, _TextField.textFieldTokens.textBeforeMargin, _DatePicker.tokens.textFieldTextBeforeMargin, _TextField.textFieldTokens.textAfterMargin, _DatePicker.tokens.textFieldTextAfterMargin, _DatePicker.classes.datePickerError, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundErrorColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundErrorColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundErrorColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.textFieldBorderColorError, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.textFieldBorderColorErrorHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.textFieldBorderColorErrorFocus, _DatePicker.classes.datePickerSuccess, _TextField.textFieldTokens.backgroundColor, _DatePicker.tokens.textFieldBackgroundSuccessColor, _TextField.textFieldTokens.backgroundColorHover, _DatePicker.tokens.textFieldBackgroundSuccessColorHover, _TextField.textFieldTokens.backgroundColorFocus, _DatePicker.tokens.textFieldBackgroundSuccessColorFocus, _TextField.textFieldTokens.borderColor, _DatePicker.tokens.textFieldBorderColorSuccess, _TextField.textFieldTokens.borderColorHover, _DatePicker.tokens.textFieldBorderColorSuccessHover, _TextField.textFieldTokens.borderColorFocus, _DatePicker.tokens.textFieldBorderColorSuccessFocus);
27
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:inline-block;"]);
28
28
  var StyledLabel = exports.StyledLabel = /*#__PURE__*/_styledComponents["default"].label.withConfig({
29
29
  componentId: "plasma-new-hope__sc-1ye0xbz-2"
30
30
  })([""]);
@@ -7,4 +7,4 @@ exports.base = void 0;
7
7
  var _styledComponents = /*#__PURE__*/require("styled-components");
8
8
  var _DatePicker = /*#__PURE__*/require("../../../DatePicker.tokens");
9
9
  var _SingleDate = /*#__PURE__*/require("../../SingleDate.styles");
10
- var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}"], _SingleDate.StyledLabel, _DatePicker.tokens.labelOffset, _DatePicker.tokens.labelFontFamily, _DatePicker.tokens.labelFontSize, _DatePicker.tokens.labelFontStyle, _DatePicker.tokens.labelFontWeight, _DatePicker.tokens.labelLetterSpacing, _DatePicker.tokens.labelLineHeight, _SingleDate.LeftHelper, _DatePicker.tokens.leftHelperOffset, _DatePicker.tokens.leftHelperFontFamily, _DatePicker.tokens.leftHelperFontSize, _DatePicker.tokens.leftHelperFontStyle, _DatePicker.tokens.leftHelperFontWeight, _DatePicker.tokens.leftHelperLetterSpacing, _DatePicker.tokens.leftHelperLineHeight);
10
+ var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["width:var(", ");", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}", "{margin:var(", ");font-family:var(", ");font-size:var(", ");font-style:var(", ");font-weight:var(", ");letter-spacing:var(", ");line-height:var(", ");}"], _DatePicker.tokens.width, _SingleDate.StyledLabel, _DatePicker.tokens.labelOffset, _DatePicker.tokens.labelFontFamily, _DatePicker.tokens.labelFontSize, _DatePicker.tokens.labelFontStyle, _DatePicker.tokens.labelFontWeight, _DatePicker.tokens.labelLetterSpacing, _DatePicker.tokens.labelLineHeight, _SingleDate.LeftHelper, _DatePicker.tokens.leftHelperOffset, _DatePicker.tokens.leftHelperFontFamily, _DatePicker.tokens.leftHelperFontSize, _DatePicker.tokens.leftHelperFontStyle, _DatePicker.tokens.leftHelperFontWeight, _DatePicker.tokens.leftHelperLetterSpacing, _DatePicker.tokens.leftHelperLineHeight);
@@ -0,0 +1,32 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.useKeyNavigation = exports.keys = void 0;
7
+ var keys = exports.keys = {
8
+ Space: 'Space'
9
+ };
10
+ var useKeyNavigation = exports.useKeyNavigation = function useKeyNavigation(_ref) {
11
+ var isCalendarOpen = _ref.isCalendarOpen,
12
+ onToggle = _ref.onToggle;
13
+ var onKeyDown = function onKeyDown(event) {
14
+ switch (event.code) {
15
+ case keys.Space:
16
+ {
17
+ if (!isCalendarOpen) {
18
+ event.preventDefault();
19
+ onToggle(true, event);
20
+ }
21
+ break;
22
+ }
23
+ default:
24
+ {
25
+ break;
26
+ }
27
+ }
28
+ };
29
+ return {
30
+ onKeyDown: onKeyDown
31
+ };
32
+ };
@@ -252,7 +252,7 @@ var selectRoot = exports.selectRoot = function selectRoot(Root) {
252
252
  onToggle: handleToggle,
253
253
  trigger: "click",
254
254
  target: /*#__PURE__*/_react["default"].createElement(_ui.Target, {
255
- opened: isCurrentListOpen,
255
+ isOpen: isCurrentListOpen,
256
256
  target: target,
257
257
  value: value,
258
258
  isTargetAmount: isTargetAmount,
@@ -12,7 +12,7 @@ var Target = exports.Target = function Target(_ref) {
12
12
  multiselect = _ref.multiselect,
13
13
  isTargetAmount = _ref.isTargetAmount,
14
14
  target = _ref.target,
15
- opened = _ref.opened,
15
+ isOpen = _ref.isOpen,
16
16
  valueToItemMap = _ref.valueToItemMap,
17
17
  onChipClick = _ref.onChipClick,
18
18
  label = _ref.label,
@@ -27,7 +27,7 @@ var Target = exports.Target = function Target(_ref) {
27
27
  focusedPath = _ref.focusedPath,
28
28
  focusedToValueMap = _ref.focusedToValueMap;
29
29
  return target === 'button-like' ? /*#__PURE__*/_react["default"].createElement(_ui.Button, {
30
- opened: opened,
30
+ isOpen: isOpen,
31
31
  value: value,
32
32
  isTargetAmount: isTargetAmount,
33
33
  multiselect: multiselect,
@@ -40,7 +40,7 @@ var Target = exports.Target = function Target(_ref) {
40
40
  focusedPath: focusedPath,
41
41
  focusedToValueMap: focusedToValueMap
42
42
  }) : /*#__PURE__*/_react["default"].createElement(_ui.Textfield, {
43
- opened: opened,
43
+ isOpen: isOpen,
44
44
  value: value,
45
45
  isTargetAmount: isTargetAmount,
46
46
  multiselect: multiselect,
@@ -11,7 +11,7 @@ var _utils2 = /*#__PURE__*/require("../../../../utils");
11
11
  var _Button = /*#__PURE__*/require("./Button.styles");
12
12
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
13
13
  var Button = exports.Button = function Button(_ref) {
14
- var opened = _ref.opened,
14
+ var isOpen = _ref.isOpen,
15
15
  value = _ref.value,
16
16
  isTargetAmount = _ref.isTargetAmount,
17
17
  multiselect = _ref.multiselect,
@@ -23,7 +23,7 @@ var Button = exports.Button = function Button(_ref) {
23
23
  renderValue = _ref.renderValue,
24
24
  focusedPath = _ref.focusedPath,
25
25
  focusedToValueMap = _ref.focusedToValueMap;
26
- var withArrowInverse = opened ? _Select.classes.arrowInverse : undefined;
26
+ var withArrowInverse = isOpen ? _Select.classes.arrowInverse : undefined;
27
27
  var getActiveDescendant = function getActiveDescendant() {
28
28
  var _focusedToValueMap$ge;
29
29
  var focusedPathAsString = focusedPath.reduce(function (acc, n) {
@@ -34,7 +34,7 @@ var Button = exports.Button = function Button(_ref) {
34
34
  return /*#__PURE__*/_react["default"].createElement(_Button.ButtonWrapper, null, /*#__PURE__*/_react["default"].createElement(_Button.StyledButton, {
35
35
  stretching: "filled",
36
36
  onKeyDown: onKeyDown,
37
- className: opened ? _Select.classes.selectWithoutBoxShadow : undefined,
37
+ className: isOpen ? _Select.classes.selectWithoutBoxShadow : undefined,
38
38
  disabled: disabled,
39
39
  contentRight: /*#__PURE__*/_react["default"].createElement(_Button.IconArrowWrapper, null, /*#__PURE__*/_react["default"].createElement(_Button.StyledArrow, {
40
40
  size: (0, _utils2.sizeToIconSize)(size),
@@ -43,7 +43,7 @@ var Button = exports.Button = function Button(_ref) {
43
43
  })),
44
44
  role: "combobox",
45
45
  "aria-controls": "tree_level_1",
46
- "aria-expanded": opened,
46
+ "aria-expanded": isOpen,
47
47
  "aria-activedescendant": getActiveDescendant(),
48
48
  "aria-label": label
49
49
  }, /*#__PURE__*/_react["default"].createElement(_Button.Label, null, (0, _utils2.getButtonLabel)({
@@ -55,6 +55,7 @@ var getLabel = function getLabel(_ref) {
55
55
  };
56
56
  var Textfield = exports.Textfield = function Textfield(_ref2) {
57
57
  var opened = _ref2.opened,
58
+ isOpen = _ref2.isOpen,
58
59
  value = _ref2.value,
59
60
  isTargetAmount = _ref2.isTargetAmount,
60
61
  multiselect = _ref2.multiselect,
@@ -71,7 +72,8 @@ var Textfield = exports.Textfield = function Textfield(_ref2) {
71
72
  renderValue = _ref2.renderValue,
72
73
  focusedPath = _ref2.focusedPath,
73
74
  focusedToValueMap = _ref2.focusedToValueMap;
74
- var withArrowInverse = opened ? _Select.classes.arrowInverse : undefined;
75
+ var innerIsOpen = opened || isOpen;
76
+ var withArrowInverse = innerIsOpen ? _Select.classes.arrowInverse : undefined;
75
77
  var getActiveDescendant = function getActiveDescendant() {
76
78
  var _focusedToValueMap$ge;
77
79
  var focusedPathAsString = focusedPath.reduce(function (acc, n) {
@@ -80,16 +82,16 @@ var Textfield = exports.Textfield = function Textfield(_ref2) {
80
82
  return focusedToValueMap === null || focusedToValueMap === void 0 || (_focusedToValueMap$ge = focusedToValueMap.get(focusedPathAsString)) === null || _focusedToValueMap$ge === void 0 ? void 0 : _focusedToValueMap$ge.value.toString();
81
83
  };
82
84
  return /*#__PURE__*/_react["default"].createElement(_Textfield.TextfieldWrapper, {
83
- opened: opened,
85
+ isOpen: innerIsOpen,
84
86
  value: value
85
87
  }, /*#__PURE__*/_react["default"].createElement(_Textfield.StyledButton, {
86
88
  stretching: "filled",
87
- className: (0, _utils.cx)(_Select.classes.textfieldTarget, opened || focusedChipIndex !== null ? _Select.classes.selectWithoutBoxShadow : undefined),
89
+ className: (0, _utils.cx)(_Select.classes.textfieldTarget, innerIsOpen || focusedChipIndex !== null ? _Select.classes.selectWithoutBoxShadow : undefined),
88
90
  onKeyDown: onKeyDown,
89
91
  disabled: disabled,
90
92
  role: "combobox",
91
93
  "aria-controls": "tree_level_1",
92
- "aria-expanded": opened,
94
+ "aria-expanded": innerIsOpen,
93
95
  "aria-activedescendant": getActiveDescendant(),
94
96
  "aria-label": label
95
97
  }, /*#__PURE__*/_react["default"].createElement(_Textfield.Wrapper, null, contentLeft && (!multiselect || (0, _utils.isEmpty)(value)) && /*#__PURE__*/_react["default"].createElement(_Textfield.ContentLeftWrapper, null, contentLeft), /*#__PURE__*/_react["default"].createElement(_Textfield.ChipWrapper, null, getLabel({
@@ -17,8 +17,8 @@ var Button = /*#__PURE__*/(0, _engines.component)(mergedButtonConfig);
17
17
  var TextfieldWrapper = exports.TextfieldWrapper = /*#__PURE__*/_styledComponents["default"].div.withConfig({
18
18
  componentId: "plasma-new-hope__sc-1akl2tk-0"
19
19
  })(["display:inline;.", "{background:", ";padding:", ";}.", "::before{box-shadow:none !important;}"], _Select.classes.textfieldTarget, function (_ref) {
20
- var opened = _ref.opened;
21
- return opened ? "var(".concat(_Select.tokens.targetTextfieldBackgroundColorOpened, ")") : "var(".concat(_Select.tokens.targetTextfieldBackgroundColor, ")");
20
+ var isOpen = _ref.isOpen;
21
+ return isOpen ? "var(".concat(_Select.tokens.targetTextfieldBackgroundColorOpened, ")") : "var(".concat(_Select.tokens.targetTextfieldBackgroundColor, ")");
22
22
  }, function (_ref2) {
23
23
  var value = _ref2.value;
24
24
  return Array.isArray(value) && !(0, _utils.isEmpty)(value) ? "0 var(".concat(_Select.tokens.targetTextfieldChipPadding, ")") : "0 var(".concat(_Select.tokens.targetTextfieldPadding, ")");
@@ -13,7 +13,7 @@ var _Sheet = /*#__PURE__*/require("./Sheet.tokens");
13
13
  var _Sheet2 = /*#__PURE__*/require("./Sheet.styles");
14
14
  var _base = /*#__PURE__*/require("./variations/_view/base");
15
15
  var _utils2 = /*#__PURE__*/require("./utils");
16
- var _excluded = ["opened", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
16
+ var _excluded = ["opened", "isOpen", "children", "onClose", "hasHandle", "contentHeader", "isHeaderFixed", "contentFooter", "isFooterFixed", "withOverlay", "withBlur", "withTransition", "throttleMs", "className", "view"];
17
17
  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); }
18
18
  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; }
19
19
  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); }
@@ -26,6 +26,7 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) r
26
26
  var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
27
27
  return /*#__PURE__*/(0, _react.forwardRef)(function (_ref, rootRef) {
28
28
  var opened = _ref.opened,
29
+ isOpen = _ref.isOpen,
29
30
  children = _ref.children,
30
31
  onClose = _ref.onClose,
31
32
  _ref$hasHandle = _ref.hasHandle,
@@ -46,11 +47,12 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
46
47
  className = _ref.className,
47
48
  view = _ref.view,
48
49
  restProps = _objectWithoutProperties(_ref, _excluded);
50
+ var innerIsOpen = opened || isOpen;
49
51
  var contentWrapperRef = (0, _react.useRef)(null);
50
52
  var contentRef = (0, _react.useRef)(null);
51
53
  var handleRef = (0, _react.useRef)(null);
52
54
  (0, _hooks.useOverflow)({
53
- opened: opened
55
+ isOpen: innerIsOpen
54
56
  });
55
57
  (0, _hooks.useSheetSwipe)({
56
58
  contentWrapperRef: contentWrapperRef,
@@ -61,15 +63,15 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
61
63
  });
62
64
  var hasHeader = Boolean(contentHeader);
63
65
  var hasFooter = Boolean(contentFooter);
64
- var closedClass = opened ? undefined : "".concat(_Sheet.classes.closed);
66
+ var closedClass = innerIsOpen ? undefined : "".concat(_Sheet.classes.closed);
65
67
  var overlayBackgroundToken = withBlur ? "var(".concat(_Sheet.tokens.sheetOverlayWithBlurColor, ")") : "var(".concat(_Sheet.tokens.sheetOverlayColor, ")");
66
68
  return /*#__PURE__*/_react["default"].createElement(Root, {
67
- opened: opened,
69
+ isOpen: innerIsOpen,
68
70
  onClose: onClose,
69
71
  view: view,
70
72
  ref: rootRef
71
73
  }, /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledContentWrapper, _extends({
72
- opened: opened,
74
+ isOpen: innerIsOpen,
73
75
  withTransition: withTransition,
74
76
  className: (0, _utils.cx)(closedClass, className),
75
77
  ref: contentWrapperRef
@@ -83,7 +85,7 @@ var sheetRoot = exports.sheetRoot = function sheetRoot(Root) {
83
85
  isHeaderFixed: isHeaderFixed
84
86
  }, contentHeader), /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledSheetBody, null, children), hasFooter && /*#__PURE__*/_react["default"].createElement(_Sheet2.StyledSheetFooter, {
85
87
  isFooterFixed: isFooterFixed
86
- }, contentFooter))), withOverlay && opened && /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
88
+ }, contentFooter))), withOverlay && innerIsOpen && /*#__PURE__*/_react["default"].createElement(_Overlay.Overlay, {
87
89
  zIndex: _utils2.DEFAULT_Z_INDEX,
88
90
  backgroundColorProperty: overlayBackgroundToken,
89
91
  withBlur: withBlur,