@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.
- package/cjs/components/Combobox/Combobox.js +16 -13
- package/cjs/components/Combobox/Combobox.js.map +1 -1
- package/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/cjs/components/DatePicker/DatePickerBase.styles.js.map +1 -1
- package/cjs/components/DatePicker/DatePickerBase.styles_192va2p.css +1 -0
- package/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/cjs/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
- package/cjs/components/DatePicker/SingleDate/SingleDate.css +4 -4
- package/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/cjs/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
- package/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +1 -1
- package/cjs/components/DatePicker/SingleDate/SingleDate.styles.js.map +1 -1
- package/cjs/components/DatePicker/SingleDate/SingleDate.styles_18z9fw1.css +5 -0
- package/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/cjs/components/DatePicker/SingleDate/variations/_size/base.js.map +1 -1
- package/cjs/components/DatePicker/SingleDate/variations/_size/base_lf7y25.css +1 -0
- package/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +30 -0
- package/cjs/components/DatePicker/hooks/useKeyboardNavigation.js.map +1 -0
- package/cjs/components/Select/Select.js +1 -1
- package/cjs/components/Select/Select.js.map +1 -1
- package/cjs/components/Select/ui/Target/Target.js +3 -3
- package/cjs/components/Select/ui/Target/Target.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/cjs/components/Select/ui/Target/ui/Button/Button.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
- package/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
- package/cjs/components/Sheet/Sheet.js +8 -6
- package/cjs/components/Sheet/Sheet.js.map +1 -1
- package/cjs/components/Sheet/hooks/useOverflow.js +3 -3
- package/cjs/components/Sheet/hooks/useOverflow.js.map +1 -1
- package/cjs/components/Sheet/utils/handleTransition.js.map +1 -1
- package/cjs/index.css +4 -4
- package/emotion/cjs/components/Combobox/Combobox.js +16 -13
- package/emotion/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/emotion/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/emotion/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/emotion/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +14 -5
- package/emotion/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/emotion/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +32 -0
- package/emotion/cjs/components/Select/Select.js +1 -1
- package/emotion/cjs/components/Select/ui/Target/Target.js +3 -3
- package/emotion/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/emotion/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +14 -14
- package/emotion/cjs/components/Sheet/Sheet.js +8 -6
- package/emotion/cjs/components/Sheet/Sheet.template-doc.mdx +6 -6
- package/emotion/cjs/components/Sheet/hooks/useOverflow.js +3 -3
- package/emotion/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +7 -7
- package/emotion/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/emotion/cjs/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
- package/emotion/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/emotion/cjs/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
- package/emotion/es/components/Combobox/Combobox.js +16 -13
- package/emotion/es/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/emotion/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/emotion/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/emotion/es/components/DatePicker/SingleDate/SingleDate.styles.js +15 -6
- package/emotion/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/emotion/es/components/DatePicker/hooks/useKeyboardNavigation.js +26 -0
- package/emotion/es/components/Select/Select.js +1 -1
- package/emotion/es/components/Select/ui/Target/Target.js +3 -3
- package/emotion/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/emotion/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +14 -14
- package/emotion/es/components/Sheet/Sheet.js +8 -6
- package/emotion/es/components/Sheet/Sheet.template-doc.mdx +6 -6
- package/emotion/es/components/Sheet/hooks/useOverflow.js +3 -3
- package/emotion/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/es/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +7 -7
- package/emotion/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/emotion/es/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
- package/emotion/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
- package/emotion/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/emotion/es/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
- package/es/components/Combobox/Combobox.js +16 -13
- package/es/components/Combobox/Combobox.js.map +1 -1
- package/es/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/es/components/DatePicker/DatePickerBase.styles.js.map +1 -1
- package/es/components/DatePicker/DatePickerBase.styles_192va2p.css +1 -0
- package/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/es/components/DatePicker/RangeDate/RangeDate.js.map +1 -1
- package/es/components/DatePicker/SingleDate/SingleDate.css +4 -4
- package/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/es/components/DatePicker/SingleDate/SingleDate.js.map +1 -1
- package/es/components/DatePicker/SingleDate/SingleDate.styles.js +1 -1
- package/es/components/DatePicker/SingleDate/SingleDate.styles.js.map +1 -1
- package/es/components/DatePicker/SingleDate/SingleDate.styles_18z9fw1.css +5 -0
- package/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/es/components/DatePicker/SingleDate/variations/_size/base.js.map +1 -1
- package/es/components/DatePicker/SingleDate/variations/_size/base_lf7y25.css +1 -0
- package/es/components/DatePicker/hooks/useKeyboardNavigation.js +25 -0
- package/es/components/DatePicker/hooks/useKeyboardNavigation.js.map +1 -0
- package/es/components/Select/Select.js +1 -1
- package/es/components/Select/Select.js.map +1 -1
- package/es/components/Select/ui/Target/Target.js +3 -3
- package/es/components/Select/ui/Target/Target.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/es/components/Select/ui/Target/ui/Button/Button.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.js.map +1 -1
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
- package/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js.map +1 -1
- package/es/components/Sheet/Sheet.js +8 -6
- package/es/components/Sheet/Sheet.js.map +1 -1
- package/es/components/Sheet/hooks/useOverflow.js +3 -3
- package/es/components/Sheet/hooks/useOverflow.js.map +1 -1
- package/es/components/Sheet/utils/handleTransition.js.map +1 -1
- package/es/index.css +4 -4
- package/package.json +2 -2
- package/styled-components/cjs/components/Combobox/Combobox.js +16 -13
- package/styled-components/cjs/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/styled-components/cjs/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/styled-components/cjs/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/styled-components/cjs/components/DatePicker/SingleDate/SingleDate.styles.js +2 -2
- package/styled-components/cjs/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/styled-components/cjs/components/DatePicker/hooks/useKeyboardNavigation.js +32 -0
- package/styled-components/cjs/components/Select/Select.js +1 -1
- package/styled-components/cjs/components/Select/ui/Target/Target.js +3 -3
- package/styled-components/cjs/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/styled-components/cjs/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
- package/styled-components/cjs/components/Sheet/Sheet.js +8 -6
- package/styled-components/cjs/components/Sheet/Sheet.template-doc.mdx +6 -6
- package/styled-components/cjs/components/Sheet/hooks/useOverflow.js +3 -3
- package/styled-components/cjs/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +1 -1
- package/styled-components/cjs/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/styled-components/cjs/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
- package/styled-components/cjs/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/cjs/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/styled-components/cjs/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
- package/styled-components/es/components/Combobox/Combobox.js +16 -13
- package/styled-components/es/components/DatePicker/DatePickerBase.styles.js +1 -1
- package/styled-components/es/components/DatePicker/RangeDate/RangeDate.js +13 -9
- package/styled-components/es/components/DatePicker/SingleDate/SingleDate.js +13 -5
- package/styled-components/es/components/DatePicker/SingleDate/SingleDate.styles.js +3 -3
- package/styled-components/es/components/DatePicker/SingleDate/variations/_size/base.js +1 -1
- package/styled-components/es/components/DatePicker/hooks/useKeyboardNavigation.js +26 -0
- package/styled-components/es/components/Select/Select.js +1 -1
- package/styled-components/es/components/Select/ui/Target/Target.js +3 -3
- package/styled-components/es/components/Select/ui/Target/ui/Button/Button.js +4 -4
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.js +6 -4
- package/styled-components/es/components/Select/ui/Target/ui/Textfield/Textfield.styles.js +2 -2
- package/styled-components/es/components/Sheet/Sheet.js +8 -6
- package/styled-components/es/components/Sheet/Sheet.template-doc.mdx +6 -6
- package/styled-components/es/components/Sheet/hooks/useOverflow.js +3 -3
- package/styled-components/es/examples/plasma_b2c/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.config.js +1 -1
- package/styled-components/es/examples/plasma_b2c/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/styled-components/es/examples/plasma_b2c/components/Sheet/Sheet.stories.tsx +5 -5
- package/styled-components/es/examples/plasma_web/components/Combobox/Combobox.stories.tsx +1 -1
- package/styled-components/es/examples/plasma_web/components/DatePicker/DatePicker.stories.tsx +1 -80
- package/styled-components/es/examples/plasma_web/components/Sheet/Sheet.stories.tsx +5 -5
- package/types/components/Combobox/Combobox.d.ts.map +1 -1
- package/types/components/Combobox/Combobox.types.d.ts +7 -0
- package/types/components/Combobox/Combobox.types.d.ts.map +1 -1
- package/types/components/DatePicker/DatePickerBase.styles.d.ts.map +1 -1
- package/types/components/DatePicker/RangeDate/RangeDate.d.ts.map +1 -1
- package/types/components/DatePicker/SingleDate/SingleDate.d.ts.map +1 -1
- package/types/components/DatePicker/SingleDate/SingleDate.styles.d.ts.map +1 -1
- package/types/components/DatePicker/SingleDate/variations/_size/base.d.ts.map +1 -1
- package/types/components/DatePicker/hooks/useKeyboardNavigation.d.ts +13 -0
- package/types/components/DatePicker/hooks/useKeyboardNavigation.d.ts.map +1 -0
- package/types/components/Select/ui/Target/Target.types.d.ts +2 -1
- package/types/components/Select/ui/Target/Target.types.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Button/Button.types.d.ts +1 -1
- package/types/components/Select/ui/Target/ui/Button/Button.types.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.d.ts.map +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.styles.d.ts +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.types.d.ts +1 -1
- package/types/components/Select/ui/Target/ui/Textfield/Textfield.types.d.ts.map +1 -1
- package/types/components/Sheet/Sheet.d.ts.map +1 -1
- package/types/components/Sheet/Sheet.types.d.ts +5 -3
- package/types/components/Sheet/Sheet.types.d.ts.map +1 -1
- package/types/components/Sheet/hooks/useOverflow.d.ts +1 -1
- package/types/components/Sheet/utils/handleTransition.d.ts +1 -1
- package/cjs/components/DatePicker/DatePickerBase.styles_1whkrlf.css +0 -1
- package/cjs/components/DatePicker/SingleDate/SingleDate.styles_qt45m5.css +0 -5
- package/cjs/components/DatePicker/SingleDate/variations/_size/base_g7zrur.css +0 -1
- package/es/components/DatePicker/DatePickerBase.styles_1whkrlf.css +0 -1
- package/es/components/DatePicker/SingleDate/SingleDate.styles_qt45m5.css +0 -5
- 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
|
-
.
|
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
|
-
.
|
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
|
-
.
|
616
|
-
.
|
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.
|
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": "
|
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)(
|
88
|
+
var _useState3 = (0, _react.useState)(innerIsOpen),
|
86
89
|
_useState4 = _slicedToArray(_useState3, 2),
|
87
|
-
|
88
|
-
|
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
|
-
|
112
|
-
}, [
|
114
|
+
setIsVisible(innerIsOpen);
|
115
|
+
}, [innerIsOpen, disabled, readOnly]);
|
113
116
|
(0, _react.useEffect)(function () {
|
114
117
|
// INFO: Для кейсов, когда значение выбрано и нужно вывести весь список
|
115
|
-
if (
|
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 (!
|
128
|
+
if (!isVisible) {
|
126
129
|
setFilterValue('');
|
127
130
|
}
|
128
131
|
if (onToggle) {
|
129
132
|
onToggle(openValue, event);
|
130
133
|
return;
|
131
134
|
}
|
132
|
-
|
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:
|
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
|
-
|
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:
|
206
|
+
isOpen: isVisible,
|
204
207
|
onToggle: onInnerToggle,
|
205
208
|
target: /*#__PURE__*/_react["default"].createElement(_ui.ComboboxTarget, _extends({
|
206
|
-
opened:
|
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
|
-
})(["
|
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
|
-
|
236
|
-
|
237
|
-
|
238
|
-
|
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:
|
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
|
-
|
146
|
-
|
147
|
-
|
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:
|
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
|
-
})(["
|
27
|
-
var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["display:inline-block
|
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
|
-
|
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
|
-
|
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
|
-
|
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
|
-
|
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
|
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 =
|
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:
|
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":
|
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
|
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
|
-
|
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,
|
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":
|
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
|
21
|
-
return
|
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
|
-
|
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 =
|
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
|
-
|
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
|
-
|
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 &&
|
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,
|