@semcore/dropdown-menu 4.12.0-prerelease.1 → 4.12.1-prerelease.0
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 +8 -2
- package/lib/cjs/DropdownMenu.js +13 -13
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/cjs/styleScrollArea.js +6 -6
- package/lib/es6/DropdownMenu.js +13 -13
- package/lib/es6/index.d.js.map +1 -1
- package/lib/es6/styleScrollArea.js +6 -6
- package/lib/types/index.d.ts +3 -2
- package/package.json +5 -5
package/CHANGELOG.md
CHANGED
|
@@ -2,7 +2,13 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
-
## [4.12.
|
|
5
|
+
## [4.12.1-prerelease.0] - 2023-11-07
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Deprecated `notInteractive` prop.
|
|
10
|
+
|
|
11
|
+
## [4.12.0] - 2023-11-06
|
|
6
12
|
|
|
7
13
|
### Changed
|
|
8
14
|
|
|
@@ -255,7 +261,7 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
|
|
|
255
261
|
|
|
256
262
|
### Changed
|
|
257
263
|
|
|
258
|
-
- Added visual cue to the `selected` DropdownMenu.Item.
|
|
264
|
+
- Added visual cue to the `selected` DropdownMenu. Item.
|
|
259
265
|
|
|
260
266
|
## [3.6.36] - 2023-05-22
|
|
261
267
|
|
package/lib/cjs/DropdownMenu.js
CHANGED
|
@@ -29,19 +29,19 @@ var _styleScrollArea = _interopRequireDefault(require("./styleScrollArea"));
|
|
|
29
29
|
var _excluded = ["className"],
|
|
30
30
|
_excluded2 = ["className"];
|
|
31
31
|
/*__reshadow-styles__:"./style/dropdown-menu.shadow.css"*/
|
|
32
|
-
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".
|
|
33
|
-
"__SDropdownMenuList": "
|
|
34
|
-
"__SDropdownMenuItem": "
|
|
35
|
-
"_highlighted": "
|
|
36
|
-
"_disabled": "
|
|
37
|
-
"_size_l": "
|
|
38
|
-
"_size_m": "
|
|
39
|
-
"_selected": "
|
|
40
|
-
"_notInteractive": "
|
|
41
|
-
"_variant_hint": "
|
|
42
|
-
"_variant_title": "
|
|
43
|
-
"__SDropdownMenuItemAddon": "
|
|
44
|
-
"__SPopper": "
|
|
32
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SDropdownMenuItem_1jfj5_gg_,.___SDropdownMenuList_1jfj5_gg_{position:relative;color:var(--intergalactic-text-primary, #191b23)}.___SDropdownMenuList_1jfj5_gg_{max-height:240px;padding:var(--intergalactic-spacing-1x, 4px)0;min-height:26px;min-width:32px;box-sizing:content-box;z-index:0}.___SDropdownMenuItem_1jfj5_gg_{display:flex;align-items:center;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownMenuItem_1jfj5_gg_:focus{outline:0}.___SDropdownMenuItem_1jfj5_gg_.__selected_1jfj5_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){.___SDropdownMenuItem_1jfj5_gg_.__selected_1jfj5_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownMenuItem_1jfj5_gg_.__highlighted_1jfj5_gg_{z-index:1;box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5)) inset}.___SDropdownMenuItem_1jfj5_gg_.__disabled_1jfj5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownMenuItem_1jfj5_gg_._size_l_1jfj5_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}.___SDropdownMenuItem_1jfj5_gg_._size_m_1jfj5_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}.___SDropdownMenuItem_1jfj5_gg_.__notInteractive_1jfj5_gg_{cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_.__notInteractive_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItem_1jfj5_gg_._variant_hint_1jfj5_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_._variant_hint_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItem_1jfj5_gg_._variant_title_1jfj5_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_._variant_title_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItemAddon_1jfj5_gg_{display:inline-flex;margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-2x, 8px)}.___SDropdownMenuItemAddon_1jfj5_gg_:first-child{margin-left:0}.___SDropdownMenuItemAddon_1jfj5_gg_:last-child{margin-right:0}.___SPopper_1jfj5_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}" /*__inner_css_end__*/, "1jfj5_gg_") /*__reshadow_css_end__*/, {
|
|
33
|
+
"__SDropdownMenuList": "___SDropdownMenuList_1jfj5_gg_",
|
|
34
|
+
"__SDropdownMenuItem": "___SDropdownMenuItem_1jfj5_gg_",
|
|
35
|
+
"_highlighted": "__highlighted_1jfj5_gg_",
|
|
36
|
+
"_disabled": "__disabled_1jfj5_gg_",
|
|
37
|
+
"_size_l": "_size_l_1jfj5_gg_",
|
|
38
|
+
"_size_m": "_size_m_1jfj5_gg_",
|
|
39
|
+
"_selected": "__selected_1jfj5_gg_",
|
|
40
|
+
"_notInteractive": "__notInteractive_1jfj5_gg_",
|
|
41
|
+
"_variant_hint": "_variant_hint_1jfj5_gg_",
|
|
42
|
+
"_variant_title": "_variant_title_1jfj5_gg_",
|
|
43
|
+
"__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_1jfj5_gg_",
|
|
44
|
+
"__SPopper": "___SPopper_1jfj5_gg_"
|
|
45
45
|
});
|
|
46
46
|
var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
|
|
47
47
|
var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
|
package/lib/cjs/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport Dropdown, {\n DropdownContext,\n DropdownProps,\n DropdownHandlers,\n DropdownTriggerProps,\n} from '@semcore/dropdown';\nimport { Box, BoxProps, FlexProps } from '@semcore/flex-box';\nimport { ScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IDropdownMenuProps extends DropdownMenuProps, UnknownProperties {}\nexport type DropdownMenuProps = DropdownProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n /**\n * Index of the element selected by default\n */\n defaultHighlightedIndex?: number;\n /**\n * Index of the selected item\n */\n highlightedIndex?: number;\n /**\n * Callback for highlightedIndex change\n * highlightedIndex - Index of the selected item\n */\n onHighlightedIndexChange?: (highlightedIndex: number) => void;\n locale?: string;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuListProps extends DropdownMenuListProps, UnknownProperties {}\nexport type DropdownMenuListProps = BoxProps &\n ScrollAreaProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n };\n\n/** @deprecated */\nexport interface IDropdownMenuMenuProps extends DropdownMenuMenuProps, UnknownProperties {}\nexport type DropdownMenuMenuProps = DropdownMenuListProps & {};\n\n/** @deprecated */\nexport interface IDropdownMenuItemProps extends DropdownMenuItemProps, UnknownProperties {}\nexport type DropdownMenuItemProps = FlexProps & {\n /**\n * Enables selected state\n */\n selected?: boolean;\n /**\n * Disables
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport Dropdown, {\n DropdownContext,\n DropdownProps,\n DropdownHandlers,\n DropdownTriggerProps,\n} from '@semcore/dropdown';\nimport { Box, BoxProps, FlexProps } from '@semcore/flex-box';\nimport { ScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IDropdownMenuProps extends DropdownMenuProps, UnknownProperties {}\nexport type DropdownMenuProps = DropdownProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n /**\n * Index of the element selected by default\n */\n defaultHighlightedIndex?: number;\n /**\n * Index of the selected item\n */\n highlightedIndex?: number;\n /**\n * Callback for highlightedIndex change\n * highlightedIndex - Index of the selected item\n */\n onHighlightedIndexChange?: (highlightedIndex: number) => void;\n locale?: string;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuListProps extends DropdownMenuListProps, UnknownProperties {}\nexport type DropdownMenuListProps = BoxProps &\n ScrollAreaProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n };\n\n/** @deprecated */\nexport interface IDropdownMenuMenuProps extends DropdownMenuMenuProps, UnknownProperties {}\nexport type DropdownMenuMenuProps = DropdownMenuListProps & {};\n\n/** @deprecated */\nexport interface IDropdownMenuItemProps extends DropdownMenuItemProps, UnknownProperties {}\nexport type DropdownMenuItemProps = FlexProps & {\n /**\n * Enables selected state\n */\n selected?: boolean;\n /**\n * Disables item\n */\n disabled?: boolean;\n /**\n * Adds focus styles around\n */\n highlighted?: boolean;\n /**\n * Disables hover state\n * @deprecated use `disabled` instead\n */\n notInteractive?: boolean;\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuItemHintProps extends DropdownMenuItemHintProps, UnknownProperties {}\nexport type DropdownMenuItemHintProps = FlexProps & {\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuItemTitleProps\n extends DropdownMenuItemTitleProps,\n UnknownProperties {}\nexport type DropdownMenuItemTitleProps = FlexProps & {\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuContext extends DropdownMenuContext, UnknownProperties {}\nexport type DropdownMenuContext = DropdownContext & {\n highlightedIndex?: number;\n getListProps: PropGetterFn;\n getItemProps: PropGetterFn;\n getItemHintProps: PropGetterFn;\n getItemTitleProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuHandlers extends DropdownMenuHandlers, UnknownProperties {}\nexport type DropdownMenuHandlers = DropdownHandlers & {\n highlightedIndex: (index: number) => void;\n};\n\nexport type DropdownMenuTriggerProps = DropdownTriggerProps;\n\ndeclare const DropdownMenu: Intergalactic.Component<\n 'div',\n DropdownMenuProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n> & {\n Trigger: typeof Dropdown.Trigger;\n Popper: Intergalactic.Component<'div', DropdownMenuProps>;\n List: Intergalactic.Component<\n 'div',\n DropdownMenuListProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n >;\n Menu: Intergalactic.Component<\n 'div',\n DropdownMenuMenuProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n >;\n Item: Intergalactic.Component<\n 'div',\n DropdownMenuItemProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n > & {\n Addon: typeof Box;\n };\n ItemTitle: Intergalactic.Component<'div', DropdownMenuItemTitleProps>;\n ItemHint: Intergalactic.Component<'div', DropdownMenuItemHintProps>;\n};\n\nexport default DropdownMenu;\n"],"mappings":""}
|
|
@@ -11,12 +11,12 @@ var _core = require("@semcore/core");
|
|
|
11
11
|
*
|
|
12
12
|
* We will figure out what to do with it and remove it.
|
|
13
13
|
* */
|
|
14
|
-
var scrollStyles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".
|
|
15
|
-
"__SShadowHorizontal": "
|
|
16
|
-
"_position_median": "
|
|
17
|
-
"_position_start": "
|
|
18
|
-
"_position_end": "
|
|
19
|
-
"__SShadowVertical": "
|
|
14
|
+
var scrollStyles = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SShadowHorizontal_ukxe3_gg_:after,.___SShadowHorizontal_ukxe3_gg_:before{width:16px;height:100%;border-radius:var(--intergalactic-control-rounded, 6px)}.___SShadowHorizontal_ukxe3_gg_._position_median_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_median_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_start_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_end_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_:after,.___SShadowVertical_ukxe3_gg_:before{width:100%;height:16px;border-radius:var(--intergalactic-control-rounded, 6px)}.___SShadowVertical_ukxe3_gg_._position_median_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_median_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_start_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_end_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}" /*__inner_css_end__*/, "ukxe3_gg_") /*__reshadow_css_end__*/, {
|
|
15
|
+
"__SShadowHorizontal": "___SShadowHorizontal_ukxe3_gg_",
|
|
16
|
+
"_position_median": "_position_median_ukxe3_gg_",
|
|
17
|
+
"_position_start": "_position_start_ukxe3_gg_",
|
|
18
|
+
"_position_end": "_position_end_ukxe3_gg_",
|
|
19
|
+
"__SShadowVertical": "___SShadowVertical_ukxe3_gg_"
|
|
20
20
|
});
|
|
21
21
|
var _default = scrollStyles;
|
|
22
22
|
exports["default"] = _default;
|
package/lib/es6/DropdownMenu.js
CHANGED
|
@@ -28,19 +28,19 @@ import i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';
|
|
|
28
28
|
import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
|
|
29
29
|
import scrollStyles from './styleScrollArea';
|
|
30
30
|
/*__reshadow-styles__:"./style/dropdown-menu.shadow.css"*/
|
|
31
|
-
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".
|
|
32
|
-
"__SDropdownMenuList": "
|
|
33
|
-
"__SDropdownMenuItem": "
|
|
34
|
-
"_highlighted": "
|
|
35
|
-
"_disabled": "
|
|
36
|
-
"_size_l": "
|
|
37
|
-
"_size_m": "
|
|
38
|
-
"_selected": "
|
|
39
|
-
"_notInteractive": "
|
|
40
|
-
"_variant_hint": "
|
|
41
|
-
"_variant_title": "
|
|
42
|
-
"__SDropdownMenuItemAddon": "
|
|
43
|
-
"__SPopper": "
|
|
31
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SDropdownMenuItem_1jfj5_gg_,.___SDropdownMenuList_1jfj5_gg_{position:relative;color:var(--intergalactic-text-primary, #191b23)}.___SDropdownMenuList_1jfj5_gg_{max-height:240px;padding:var(--intergalactic-spacing-1x, 4px)0;min-height:26px;min-width:32px;box-sizing:content-box;z-index:0}.___SDropdownMenuItem_1jfj5_gg_{display:flex;align-items:center;-webkit-text-decoration:none;text-decoration:none;box-sizing:border-box;cursor:pointer;width:100%;text-align:left;line-height:normal}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-hover, #f4f5f9)}}.___SDropdownMenuItem_1jfj5_gg_:focus{outline:0}.___SDropdownMenuItem_1jfj5_gg_.__selected_1jfj5_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){.___SDropdownMenuItem_1jfj5_gg_.__selected_1jfj5_gg_:hover{background-color:var(--intergalactic-dropdown-menu-item-selected-hover, #c4e5fe)}}.___SDropdownMenuItem_1jfj5_gg_.__highlighted_1jfj5_gg_{z-index:1;box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5)) inset}.___SDropdownMenuItem_1jfj5_gg_.__disabled_1jfj5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SDropdownMenuItem_1jfj5_gg_._size_l_1jfj5_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}.___SDropdownMenuItem_1jfj5_gg_._size_m_1jfj5_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}.___SDropdownMenuItem_1jfj5_gg_.__notInteractive_1jfj5_gg_{cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_.__notInteractive_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItem_1jfj5_gg_._variant_hint_1jfj5_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_._variant_hint_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItem_1jfj5_gg_._variant_title_1jfj5_gg_{font-weight:var(--intergalactic-bold, 700);cursor:default}@media (hover:hover){.___SDropdownMenuItem_1jfj5_gg_._variant_title_1jfj5_gg_:hover{background:0 0}}.___SDropdownMenuItemAddon_1jfj5_gg_{display:inline-flex;margin-left:var(--intergalactic-spacing-2x, 8px);margin-right:var(--intergalactic-spacing-2x, 8px)}.___SDropdownMenuItemAddon_1jfj5_gg_:first-child{margin-left:0}.___SDropdownMenuItemAddon_1jfj5_gg_:last-child{margin-right:0}.___SPopper_1jfj5_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}" /*__inner_css_end__*/, "1jfj5_gg_") /*__reshadow_css_end__*/, {
|
|
32
|
+
"__SDropdownMenuList": "___SDropdownMenuList_1jfj5_gg_",
|
|
33
|
+
"__SDropdownMenuItem": "___SDropdownMenuItem_1jfj5_gg_",
|
|
34
|
+
"_highlighted": "__highlighted_1jfj5_gg_",
|
|
35
|
+
"_disabled": "__disabled_1jfj5_gg_",
|
|
36
|
+
"_size_l": "_size_l_1jfj5_gg_",
|
|
37
|
+
"_size_m": "_size_m_1jfj5_gg_",
|
|
38
|
+
"_selected": "__selected_1jfj5_gg_",
|
|
39
|
+
"_notInteractive": "__notInteractive_1jfj5_gg_",
|
|
40
|
+
"_variant_hint": "_variant_hint_1jfj5_gg_",
|
|
41
|
+
"_variant_title": "_variant_title_1jfj5_gg_",
|
|
42
|
+
"__SDropdownMenuItemAddon": "___SDropdownMenuItemAddon_1jfj5_gg_",
|
|
43
|
+
"__SPopper": "___SPopper_1jfj5_gg_"
|
|
44
44
|
});
|
|
45
45
|
var KEYS = ['ArrowDown', 'ArrowUp', 'Enter', ' '];
|
|
46
46
|
var INTERACTION_TAGS = ['INPUT', 'TEXTAREA'];
|
package/lib/es6/index.d.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport Dropdown, {\n DropdownContext,\n DropdownProps,\n DropdownHandlers,\n DropdownTriggerProps,\n} from '@semcore/dropdown';\nimport { Box, BoxProps, FlexProps } from '@semcore/flex-box';\nimport { ScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IDropdownMenuProps extends DropdownMenuProps, UnknownProperties {}\nexport type DropdownMenuProps = DropdownProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n /**\n * Index of the element selected by default\n */\n defaultHighlightedIndex?: number;\n /**\n * Index of the selected item\n */\n highlightedIndex?: number;\n /**\n * Callback for highlightedIndex change\n * highlightedIndex - Index of the selected item\n */\n onHighlightedIndexChange?: (highlightedIndex: number) => void;\n locale?: string;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuListProps extends DropdownMenuListProps, UnknownProperties {}\nexport type DropdownMenuListProps = BoxProps &\n ScrollAreaProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n };\n\n/** @deprecated */\nexport interface IDropdownMenuMenuProps extends DropdownMenuMenuProps, UnknownProperties {}\nexport type DropdownMenuMenuProps = DropdownMenuListProps & {};\n\n/** @deprecated */\nexport interface IDropdownMenuItemProps extends DropdownMenuItemProps, UnknownProperties {}\nexport type DropdownMenuItemProps = FlexProps & {\n /**\n * Enables selected state\n */\n selected?: boolean;\n /**\n * Disables
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport Dropdown, {\n DropdownContext,\n DropdownProps,\n DropdownHandlers,\n DropdownTriggerProps,\n} from '@semcore/dropdown';\nimport { Box, BoxProps, FlexProps } from '@semcore/flex-box';\nimport { ScrollAreaProps } from '@semcore/scroll-area';\n\nexport type DropdownMenuSize = 'm' | 'l';\n\n/** @deprecated */\nexport interface IDropdownMenuProps extends DropdownMenuProps, UnknownProperties {}\nexport type DropdownMenuProps = DropdownProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n /**\n * Index of the element selected by default\n */\n defaultHighlightedIndex?: number;\n /**\n * Index of the selected item\n */\n highlightedIndex?: number;\n /**\n * Callback for highlightedIndex change\n * highlightedIndex - Index of the selected item\n */\n onHighlightedIndexChange?: (highlightedIndex: number) => void;\n locale?: string;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuListProps extends DropdownMenuListProps, UnknownProperties {}\nexport type DropdownMenuListProps = BoxProps &\n ScrollAreaProps & {\n /**\n * Size of the menu\n * @default m\n */\n size?: DropdownMenuSize;\n };\n\n/** @deprecated */\nexport interface IDropdownMenuMenuProps extends DropdownMenuMenuProps, UnknownProperties {}\nexport type DropdownMenuMenuProps = DropdownMenuListProps & {};\n\n/** @deprecated */\nexport interface IDropdownMenuItemProps extends DropdownMenuItemProps, UnknownProperties {}\nexport type DropdownMenuItemProps = FlexProps & {\n /**\n * Enables selected state\n */\n selected?: boolean;\n /**\n * Disables item\n */\n disabled?: boolean;\n /**\n * Adds focus styles around\n */\n highlighted?: boolean;\n /**\n * Disables hover state\n * @deprecated use `disabled` instead\n */\n notInteractive?: boolean;\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuItemHintProps extends DropdownMenuItemHintProps, UnknownProperties {}\nexport type DropdownMenuItemHintProps = FlexProps & {\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuItemTitleProps\n extends DropdownMenuItemTitleProps,\n UnknownProperties {}\nexport type DropdownMenuItemTitleProps = FlexProps & {\n /**\n * Size of the component\n * @default m\n */\n size?: DropdownMenuSize;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuContext extends DropdownMenuContext, UnknownProperties {}\nexport type DropdownMenuContext = DropdownContext & {\n highlightedIndex?: number;\n getListProps: PropGetterFn;\n getItemProps: PropGetterFn;\n getItemHintProps: PropGetterFn;\n getItemTitleProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface IDropdownMenuHandlers extends DropdownMenuHandlers, UnknownProperties {}\nexport type DropdownMenuHandlers = DropdownHandlers & {\n highlightedIndex: (index: number) => void;\n};\n\nexport type DropdownMenuTriggerProps = DropdownTriggerProps;\n\ndeclare const DropdownMenu: Intergalactic.Component<\n 'div',\n DropdownMenuProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n> & {\n Trigger: typeof Dropdown.Trigger;\n Popper: Intergalactic.Component<'div', DropdownMenuProps>;\n List: Intergalactic.Component<\n 'div',\n DropdownMenuListProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n >;\n Menu: Intergalactic.Component<\n 'div',\n DropdownMenuMenuProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n >;\n Item: Intergalactic.Component<\n 'div',\n DropdownMenuItemProps,\n DropdownMenuContext,\n [handlers: DropdownMenuHandlers]\n > & {\n Addon: typeof Box;\n };\n ItemTitle: Intergalactic.Component<'div', DropdownMenuItemTitleProps>;\n ItemHint: Intergalactic.Component<'div', DropdownMenuItemHintProps>;\n};\n\nexport default DropdownMenu;\n"],"mappings":""}
|
|
@@ -5,12 +5,12 @@ import { sstyled as _sstyled } from "@semcore/core";
|
|
|
5
5
|
*
|
|
6
6
|
* We will figure out what to do with it and remove it.
|
|
7
7
|
* */
|
|
8
|
-
var scrollStyles = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".
|
|
9
|
-
"__SShadowHorizontal": "
|
|
10
|
-
"_position_median": "
|
|
11
|
-
"_position_start": "
|
|
12
|
-
"_position_end": "
|
|
13
|
-
"__SShadowVertical": "
|
|
8
|
+
var scrollStyles = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SShadowHorizontal_ukxe3_gg_:after,.___SShadowHorizontal_ukxe3_gg_:before{width:16px;height:100%;border-radius:var(--intergalactic-control-rounded, 6px)}.___SShadowHorizontal_ukxe3_gg_._position_median_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_median_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_start_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-left,\n linear-gradient(to right, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowHorizontal_ukxe3_gg_._position_end_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-right,\n linear-gradient(to left, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_:after,.___SShadowVertical_ukxe3_gg_:before{width:100%;height:16px;border-radius:var(--intergalactic-control-rounded, 6px)}.___SShadowVertical_ukxe3_gg_._position_median_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_median_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_start_ukxe3_gg_:before{background:var(--intergalactic-scroll-area-dropdown-menu-top,\n linear-gradient(to bottom, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}.___SShadowVertical_ukxe3_gg_._position_end_ukxe3_gg_:after{background:var(--intergalactic-scroll-area-dropdown-menu-bottom,\n linear-gradient(to top, rgba(255, 255, 255, 1) 34.38%, rgba(255, 255, 255, 0) 100%)\n )}" /*__inner_css_end__*/, "ukxe3_gg_") /*__reshadow_css_end__*/, {
|
|
9
|
+
"__SShadowHorizontal": "___SShadowHorizontal_ukxe3_gg_",
|
|
10
|
+
"_position_median": "_position_median_ukxe3_gg_",
|
|
11
|
+
"_position_start": "_position_start_ukxe3_gg_",
|
|
12
|
+
"_position_end": "_position_end_ukxe3_gg_",
|
|
13
|
+
"__SShadowVertical": "___SShadowVertical_ukxe3_gg_"
|
|
14
14
|
});
|
|
15
15
|
export default scrollStyles;
|
|
16
16
|
//# sourceMappingURL=styleScrollArea.js.map
|
package/lib/types/index.d.ts
CHANGED
|
@@ -57,7 +57,7 @@ export type DropdownMenuItemProps = FlexProps & {
|
|
|
57
57
|
*/
|
|
58
58
|
selected?: boolean;
|
|
59
59
|
/**
|
|
60
|
-
* Disables
|
|
60
|
+
* Disables item
|
|
61
61
|
*/
|
|
62
62
|
disabled?: boolean;
|
|
63
63
|
/**
|
|
@@ -65,7 +65,8 @@ export type DropdownMenuItemProps = FlexProps & {
|
|
|
65
65
|
*/
|
|
66
66
|
highlighted?: boolean;
|
|
67
67
|
/**
|
|
68
|
-
*
|
|
68
|
+
* Disables hover state
|
|
69
|
+
* @deprecated use `disabled` instead
|
|
69
70
|
*/
|
|
70
71
|
notInteractive?: boolean;
|
|
71
72
|
/**
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/dropdown-menu",
|
|
3
3
|
"description": "Semrush DropdownMenu Component",
|
|
4
|
-
"version": "4.12.
|
|
4
|
+
"version": "4.12.1-prerelease.0",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -9,10 +9,10 @@
|
|
|
9
9
|
"author": "UI-kit team <ui-kit-team@semrush.com>",
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"dependencies": {
|
|
12
|
-
"@semcore/dropdown": "4.10.0
|
|
13
|
-
"@semcore/flex-box": "5.10.0
|
|
14
|
-
"@semcore/scroll-area": "5.12.0
|
|
15
|
-
"@semcore/utils": "4.10.1
|
|
12
|
+
"@semcore/dropdown": "4.10.0",
|
|
13
|
+
"@semcore/flex-box": "5.10.0",
|
|
14
|
+
"@semcore/scroll-area": "5.12.0",
|
|
15
|
+
"@semcore/utils": "4.10.1",
|
|
16
16
|
"classnames": "2.2.6"
|
|
17
17
|
},
|
|
18
18
|
"peerDependencies": {
|