@semcore/dropdown 17.0.0 → 17.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +6 -0
- package/lib/cjs/Dropdown.js +17 -17
- package/lib/es6/Dropdown.js +17 -17
- package/lib/esm/Dropdown.mjs +19 -18
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
package/lib/cjs/Dropdown.js
CHANGED
|
@@ -18,25 +18,25 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
18
18
|
var _DropdownItem = require("./DropdownItem");
|
|
19
19
|
var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynamic-locales");
|
|
20
20
|
/*!__reshadow-styles__:"./style/dropdown.shadow.css"*/
|
|
21
|
-
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".
|
|
21
|
+
const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SDropdownPopper_ku5xf_gg_{position:relative;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;border:1px solid var(--intergalactic-border-secondary, #e0e1e9);white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));color:var(--intergalactic-text-primary, #191b23)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_{position:relative;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal;outline:0}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button){color:var(--intergalactic-text-primary, #191b23)}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button):hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{content:\"\";position:absolute;border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);box-sizing:content-box}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{display:inline-block;background:var(--intergalactic-bg-primary-neutral, #ffffff);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out;border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after{background-repeat:no-repeat;background-position:center center;background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8);background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_){background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7));box-shadow:2px 0 0 0 var(--intergalactic-control-primary-info, #008ff8) inset}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-color:var(--intergalactic-keyboard-focus-outline, #008ff8);outline-style:solid;outline-width:2px;outline-offset:2px;transition-duration:calc(var(--intergalactic-duration-extra-fast, 100)*1ms);transition-timing-function:ease-in-out;transition-property:outline-color,outline-width,outline-offset;transition:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-offset:-2px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__disabled_ku5xf_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);padding:var(--intergalactic-spacing-2x, 8px) var(--intergalactic-spacing-3x, 12px);min-height:40px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-3x, 12px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:20px;height:20px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-3x, 12px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);padding:calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px)) var(--intergalactic-spacing-2x, 8px);min-height:32px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-2x, 8px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:16px;height:16px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-2x, 8px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_{cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__nesting-trigger_ku5xf_gg_{justify-content:space-between}.___SDropdownPopper_ku5xf_gg_ .___SGroupTitle_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700)}.___SDropdownPopper_ku5xf_gg_ .___SGroupHint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_{position:sticky;top:0;background-color:var(--intergalactic-dropdown-menu-item, #ffffff);z-index:2}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item, #ffffff)}}", /*__inner_css_end__*/"ku5xf_gg_"),
|
|
22
22
|
/*__reshadow_css_end__*/
|
|
23
23
|
{
|
|
24
|
-
"__SDropdownPopper": "
|
|
25
|
-
"__SDropdownItem": "
|
|
26
|
-
"_isMenuItemCheckbox": "
|
|
27
|
-
"_selected": "
|
|
28
|
-
"_highlighted": "
|
|
29
|
-
"_disabled": "
|
|
30
|
-
"_size_l": "
|
|
31
|
-
"_size_m": "
|
|
32
|
-
"_notInteractive": "
|
|
33
|
-
"_variant_hint": "
|
|
34
|
-
"_variant_title": "
|
|
35
|
-
"_nesting-trigger": "__nesting-
|
|
36
|
-
"__SGroupTitle": "
|
|
37
|
-
"__SGroupHint": "
|
|
38
|
-
"__SDropdownItemContainer": "
|
|
39
|
-
"_sticky": "
|
|
24
|
+
"__SDropdownPopper": "___SDropdownPopper_ku5xf_gg_",
|
|
25
|
+
"__SDropdownItem": "___SDropdownItem_ku5xf_gg_",
|
|
26
|
+
"_isMenuItemCheckbox": "__isMenuItemCheckbox_ku5xf_gg_",
|
|
27
|
+
"_selected": "__selected_ku5xf_gg_",
|
|
28
|
+
"_highlighted": "__highlighted_ku5xf_gg_",
|
|
29
|
+
"_disabled": "__disabled_ku5xf_gg_",
|
|
30
|
+
"_size_l": "_size_l_ku5xf_gg_",
|
|
31
|
+
"_size_m": "_size_m_ku5xf_gg_",
|
|
32
|
+
"_notInteractive": "__notInteractive_ku5xf_gg_",
|
|
33
|
+
"_variant_hint": "_variant_hint_ku5xf_gg_",
|
|
34
|
+
"_variant_title": "_variant_title_ku5xf_gg_",
|
|
35
|
+
"_nesting-trigger": "__nesting-trigger_ku5xf_gg_",
|
|
36
|
+
"__SGroupTitle": "___SGroupTitle_ku5xf_gg_",
|
|
37
|
+
"__SGroupHint": "___SGroupHint_ku5xf_gg_",
|
|
38
|
+
"__SDropdownItemContainer": "___SDropdownItemContainer_ku5xf_gg_",
|
|
39
|
+
"_sticky": "__sticky_ku5xf_gg_"
|
|
40
40
|
});
|
|
41
41
|
const INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
|
|
42
42
|
class DropdownRoot extends _core.Component {
|
package/lib/es6/Dropdown.js
CHANGED
|
@@ -13,25 +13,25 @@ import { hasFocusableIn } from '@semcore/core/lib/utils/use/useFocusLock';
|
|
|
13
13
|
import React from 'react';
|
|
14
14
|
import { DropdownItem } from './DropdownItem';
|
|
15
15
|
/*!__reshadow-styles__:"./style/dropdown.shadow.css"*/
|
|
16
|
-
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".
|
|
16
|
+
const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SDropdownPopper_ku5xf_gg_{position:relative;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;border:1px solid var(--intergalactic-border-secondary, #e0e1e9);white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));color:var(--intergalactic-text-primary, #191b23)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_{position:relative;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal;outline:0}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button){color:var(--intergalactic-text-primary, #191b23)}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button):hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{content:\"\";position:absolute;border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);box-sizing:content-box}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{display:inline-block;background:var(--intergalactic-bg-primary-neutral, #ffffff);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out;border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after{background-repeat:no-repeat;background-position:center center;background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8);background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_){background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7));box-shadow:2px 0 0 0 var(--intergalactic-control-primary-info, #008ff8) inset}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-color:var(--intergalactic-keyboard-focus-outline, #008ff8);outline-style:solid;outline-width:2px;outline-offset:2px;transition-duration:calc(var(--intergalactic-duration-extra-fast, 100)*1ms);transition-timing-function:ease-in-out;transition-property:outline-color,outline-width,outline-offset;transition:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-offset:-2px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__disabled_ku5xf_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);padding:var(--intergalactic-spacing-2x, 8px) var(--intergalactic-spacing-3x, 12px);min-height:40px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-3x, 12px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:20px;height:20px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-3x, 12px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);padding:calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px)) var(--intergalactic-spacing-2x, 8px);min-height:32px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-2x, 8px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:16px;height:16px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-2x, 8px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_{cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__nesting-trigger_ku5xf_gg_{justify-content:space-between}.___SDropdownPopper_ku5xf_gg_ .___SGroupTitle_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700)}.___SDropdownPopper_ku5xf_gg_ .___SGroupHint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_{position:sticky;top:0;background-color:var(--intergalactic-dropdown-menu-item, #ffffff);z-index:2}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item, #ffffff)}}", /*__inner_css_end__*/"ku5xf_gg_"),
|
|
17
17
|
/*__reshadow_css_end__*/
|
|
18
18
|
{
|
|
19
|
-
"__SDropdownPopper": "
|
|
20
|
-
"__SDropdownItem": "
|
|
21
|
-
"_isMenuItemCheckbox": "
|
|
22
|
-
"_selected": "
|
|
23
|
-
"_highlighted": "
|
|
24
|
-
"_disabled": "
|
|
25
|
-
"_size_l": "
|
|
26
|
-
"_size_m": "
|
|
27
|
-
"_notInteractive": "
|
|
28
|
-
"_variant_hint": "
|
|
29
|
-
"_variant_title": "
|
|
30
|
-
"_nesting-trigger": "__nesting-
|
|
31
|
-
"__SGroupTitle": "
|
|
32
|
-
"__SGroupHint": "
|
|
33
|
-
"__SDropdownItemContainer": "
|
|
34
|
-
"_sticky": "
|
|
19
|
+
"__SDropdownPopper": "___SDropdownPopper_ku5xf_gg_",
|
|
20
|
+
"__SDropdownItem": "___SDropdownItem_ku5xf_gg_",
|
|
21
|
+
"_isMenuItemCheckbox": "__isMenuItemCheckbox_ku5xf_gg_",
|
|
22
|
+
"_selected": "__selected_ku5xf_gg_",
|
|
23
|
+
"_highlighted": "__highlighted_ku5xf_gg_",
|
|
24
|
+
"_disabled": "__disabled_ku5xf_gg_",
|
|
25
|
+
"_size_l": "_size_l_ku5xf_gg_",
|
|
26
|
+
"_size_m": "_size_m_ku5xf_gg_",
|
|
27
|
+
"_notInteractive": "__notInteractive_ku5xf_gg_",
|
|
28
|
+
"_variant_hint": "_variant_hint_ku5xf_gg_",
|
|
29
|
+
"_variant_title": "_variant_title_ku5xf_gg_",
|
|
30
|
+
"_nesting-trigger": "__nesting-trigger_ku5xf_gg_",
|
|
31
|
+
"__SGroupTitle": "___SGroupTitle_ku5xf_gg_",
|
|
32
|
+
"__SGroupHint": "___SGroupHint_ku5xf_gg_",
|
|
33
|
+
"__SDropdownItemContainer": "___SDropdownItemContainer_ku5xf_gg_",
|
|
34
|
+
"_sticky": "__sticky_ku5xf_gg_"
|
|
35
35
|
});
|
|
36
36
|
import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
|
|
37
37
|
const INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
|
package/lib/esm/Dropdown.mjs
CHANGED
|
@@ -9,31 +9,32 @@ import { hasFocusableIn } from "@semcore/core/lib/utils/use/useFocusLock";
|
|
|
9
9
|
import React from "react";
|
|
10
10
|
import { DropdownItem } from "./DropdownItem.mjs";
|
|
11
11
|
import { localizedMessages } from "./translations/__intergalactic-dynamic-locales.mjs";
|
|
12
|
+
/*!__reshadow-styles__:"./style/dropdown.shadow.css"*/
|
|
12
13
|
const style = (
|
|
13
14
|
/*__reshadow_css_start__*/
|
|
14
15
|
(sstyled.insert(
|
|
15
16
|
/*__inner_css_start__*/
|
|
16
|
-
'.
|
|
17
|
+
'.___SDropdownPopper_ku5xf_gg_{position:relative;background-color:var(--intergalactic-bg-primary-neutral, #ffffff);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;border:1px solid var(--intergalactic-border-secondary, #e0e1e9);white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15));color:var(--intergalactic-text-primary, #191b23)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_{position:relative;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal;outline:0}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button){color:var(--intergalactic-text-primary, #191b23)}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_:not(button):hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{content:"";position:absolute;border:1px solid;border-radius:var(--intergalactic-addon-rounded, 4px);box-sizing:content-box}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{display:inline-block;background:var(--intergalactic-bg-primary-neutral, #ffffff);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out;border-color:var(--intergalactic-border-primary, #c4c7cf)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_.__selected_ku5xf_gg_::after{background-repeat:no-repeat;background-position:center center;background-color:var(--intergalactic-control-primary-info, #008ff8);border-color:var(--intergalactic-control-primary-info, #008ff8);background-image:url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iNyIgdmlld0JveD0iMCAwIDEwIDciIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CjxwYXRoIGQ9Ik04LjI1IDFMNCA1LjI1TDEuNzUgMyIgc3Ryb2tlPSJ3aGl0ZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9zdmc+Cg==)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_){background-color:var(--intergalactic-dropdown-menu-item-selected, rgba(196, 229, 254, 0.7));box-shadow:2px 0 0 0 var(--intergalactic-control-primary-info, #008ff8) inset}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__selected_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-color:var(--intergalactic-keyboard-focus-outline, #008ff8);outline-style:solid;outline-width:2px;outline-offset:2px;transition-duration:calc(var(--intergalactic-duration-extra-fast, 100)*1ms);transition-timing-function:ease-in-out;transition-property:outline-color,outline-width,outline-offset;transition:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_:not(button),.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__highlighted_ku5xf_gg_:not(.___SDropdownItem_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_):not(button){outline-offset:-2px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__disabled_ku5xf_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%);padding:var(--intergalactic-spacing-2x, 8px) var(--intergalactic-spacing-3x, 12px);min-height:40px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-3x, 12px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_l_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:20px;height:20px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-3x, 12px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);padding:calc(var(--intergalactic-spacing-1x, 4px) + var(--intergalactic-spacing-05x, 2px)) var(--intergalactic-spacing-2x, 8px);min-height:32px}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_{padding-left:calc(var(--intergalactic-spacing-2x, 8px)*2 + 16px + 2px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::after,.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._size_m_ku5xf_gg_.__isMenuItemCheckbox_ku5xf_gg_::before{width:16px;height:16px;top:calc(var(--intergalactic-spacing-2x, 8px) - 1px);left:var(--intergalactic-spacing-2x, 8px)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_{cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__notInteractive_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_hint_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_._variant_title_ku5xf_gg_:hover{background:0 0}}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItem_ku5xf_gg_.__nesting-trigger_ku5xf_gg_{justify-content:space-between}.___SDropdownPopper_ku5xf_gg_ .___SGroupTitle_ku5xf_gg_{font-weight:var(--intergalactic-bold, 700)}.___SDropdownPopper_ku5xf_gg_ .___SGroupHint_ku5xf_gg_{color:var(--intergalactic-text-secondary, #6c6e79)}.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_{position:sticky;top:0;background-color:var(--intergalactic-dropdown-menu-item, #ffffff);z-index:2}@media (hover:hover){.___SDropdownPopper_ku5xf_gg_ .___SDropdownItemContainer_ku5xf_gg_.__sticky_ku5xf_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item, #ffffff)}}',
|
|
17
18
|
/*__inner_css_end__*/
|
|
18
|
-
"
|
|
19
|
+
"ku5xf_gg_"
|
|
19
20
|
), /*__reshadow_css_end__*/
|
|
20
21
|
{
|
|
21
|
-
"__SDropdownPopper": "
|
|
22
|
-
"__SDropdownItem": "
|
|
23
|
-
"_isMenuItemCheckbox": "
|
|
24
|
-
"_selected": "
|
|
25
|
-
"_highlighted": "
|
|
26
|
-
"_disabled": "
|
|
27
|
-
"_size_l": "
|
|
28
|
-
"_size_m": "
|
|
29
|
-
"_notInteractive": "
|
|
30
|
-
"_variant_hint": "
|
|
31
|
-
"_variant_title": "
|
|
32
|
-
"_nesting-trigger": "__nesting-
|
|
33
|
-
"__SGroupTitle": "
|
|
34
|
-
"__SGroupHint": "
|
|
35
|
-
"__SDropdownItemContainer": "
|
|
36
|
-
"_sticky": "
|
|
22
|
+
"__SDropdownPopper": "___SDropdownPopper_ku5xf_gg_",
|
|
23
|
+
"__SDropdownItem": "___SDropdownItem_ku5xf_gg_",
|
|
24
|
+
"_isMenuItemCheckbox": "__isMenuItemCheckbox_ku5xf_gg_",
|
|
25
|
+
"_selected": "__selected_ku5xf_gg_",
|
|
26
|
+
"_highlighted": "__highlighted_ku5xf_gg_",
|
|
27
|
+
"_disabled": "__disabled_ku5xf_gg_",
|
|
28
|
+
"_size_l": "_size_l_ku5xf_gg_",
|
|
29
|
+
"_size_m": "_size_m_ku5xf_gg_",
|
|
30
|
+
"_notInteractive": "__notInteractive_ku5xf_gg_",
|
|
31
|
+
"_variant_hint": "_variant_hint_ku5xf_gg_",
|
|
32
|
+
"_variant_title": "_variant_title_ku5xf_gg_",
|
|
33
|
+
"_nesting-trigger": "__nesting-trigger_ku5xf_gg_",
|
|
34
|
+
"__SGroupTitle": "___SGroupTitle_ku5xf_gg_",
|
|
35
|
+
"__SGroupHint": "___SGroupHint_ku5xf_gg_",
|
|
36
|
+
"__SDropdownItemContainer": "___SDropdownItemContainer_ku5xf_gg_",
|
|
37
|
+
"_sticky": "__sticky_ku5xf_gg_"
|
|
37
38
|
})
|
|
38
39
|
);
|
|
39
40
|
const INTERACTION_TAGS = ["INPUT", "TEXTAREA"];
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/dropdown",
|
|
3
3
|
"description": "Semrush Dropdown Component",
|
|
4
|
-
"version": "17.0.
|
|
4
|
+
"version": "17.0.1",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,7 +14,7 @@
|
|
|
14
14
|
"require": "./lib/cjs/index.js"
|
|
15
15
|
},
|
|
16
16
|
"peerDependencies": {
|
|
17
|
-
"@semcore/base-components": "^17.0.
|
|
17
|
+
"@semcore/base-components": "^17.0.1"
|
|
18
18
|
},
|
|
19
19
|
"repository": {
|
|
20
20
|
"type": "git",
|
|
@@ -22,8 +22,8 @@
|
|
|
22
22
|
"directory": "semcore/dropdown"
|
|
23
23
|
},
|
|
24
24
|
"devDependencies": {
|
|
25
|
-
"@semcore/
|
|
26
|
-
"@semcore/
|
|
25
|
+
"@semcore/base-components": "17.0.1",
|
|
26
|
+
"@semcore/core": "17.0.1",
|
|
27
27
|
"@semcore/testing-utils": "1.0.0"
|
|
28
28
|
},
|
|
29
29
|
"scripts": {
|