@semcore/tab-line 16.0.0 → 16.0.1-prerelease.2
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 +7 -1
- package/lib/cjs/TabLine.js +12 -12
- package/lib/cjs/index.d.js.map +1 -1
- package/lib/es6/TabLine.js +12 -12
- package/lib/es6/index.d.js.map +1 -1
- package/lib/esm/TabLine.mjs +13 -13
- package/lib/types/index.d.ts +0 -2
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -2,11 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
|
|
4
4
|
|
|
5
|
+
## [16.0.1] - 2025-05-30
|
|
6
|
+
|
|
7
|
+
### Changed
|
|
8
|
+
|
|
9
|
+
- Version patch update due to children dependencies update (`@semcore/flex-box` [16.0.0 ~> 16.0.1], `@semcore/neighbor-location` [16.0.0 ~> 16.0.1], `@semcore/base-components` [16.0.0 ~> 16.0.1]).
|
|
10
|
+
|
|
5
11
|
## [16.0.0] - 2025-05-19
|
|
6
12
|
|
|
7
13
|
### Break
|
|
8
14
|
|
|
9
|
-
- `keyboardFocusEnhance`
|
|
15
|
+
- replaced `keyboardFocusEnhance` with `:focus-visible` CSS pseudo-class.
|
|
10
16
|
|
|
11
17
|
## [4.40.4] - 2025-05-13
|
|
12
18
|
|
package/lib/cjs/TabLine.js
CHANGED
|
@@ -19,20 +19,20 @@ var _addonTextChildren = _interopRequireDefault(require("@semcore/core/lib/utils
|
|
|
19
19
|
var _a11yEnhance = _interopRequireDefault(require("@semcore/core/lib/utils/enhances/a11yEnhance"));
|
|
20
20
|
var _neighborLocation = _interopRequireDefault(require("@semcore/neighbor-location"));
|
|
21
21
|
/*!__reshadow-styles__:"./style/tab-line.shadow.css"*/
|
|
22
|
-
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".
|
|
22
|
+
var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___STabLine_pmfda_gg_{position:relative;display:flex;width:100%;max-width:100%}.___STabLine_pmfda_gg_.__underlined_pmfda_gg_{border-bottom:1px solid var(--intergalactic-border-primary, #c4c7cf)}.___STabLineItem_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;border:0;background:0 0;color:var(--intergalactic-text-primary, #191b23);margin-right:var(--intergalactic-spacing-4x, 16px);font-weight:var(--intergalactic-medium, 500)}.___STabLineItem_pmfda_gg_::-moz-focus-inner{border:0;padding:0}.___STabLineItem_pmfda_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{content:\"\";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background-color:transparent}.___STabLineItem_pmfda_gg_::before{transition:background-color calc(var(--intergalactic-duration-control, 200)*1ms) ease-in-out}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover::before{background-color:var(--intergalactic-border-primary, #c4c7cf)}}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after{transition-delay:calc(var(--intergalactic-duration-control, 200)*1ms);background-color:var(--intergalactic-border-info-active, #006dca)}.___STabLineItem_pmfda_gg_ .___SAddon_pmfda_gg_:not(:last-child),.___STabLineItem_pmfda_gg_ .___SText_pmfda_gg_:not(:last-child){margin-right:var(--intergalactic-spacing-2x, 8px)}.___SCaret_pmfda_gg_{position:absolute;bottom:-1px;height:3px;background-color:var(--intergalactic-border-info-active, #006dca);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_{flex-shrink:0}.___STabLineItem_pmfda_gg_.__disabled_pmfda_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SText_pmfda_gg_{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___SAddon_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_{height:28px;min-width:18px}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_{height:40px;min-width:26px}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___STabLineItem_pmfda_gg_._neighborLocation_left_pmfda_gg_{margin-right:0}@media (prefers-reduced-motion){.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{transition:none}.___SCaret_pmfda_gg_{display:none}}", /*__inner_css_end__*/"pmfda_gg_"),
|
|
23
23
|
/*__reshadow_css_end__*/
|
|
24
24
|
{
|
|
25
|
-
"__STabLine": "
|
|
26
|
-
"_underlined": "
|
|
27
|
-
"__SCaret": "
|
|
28
|
-
"__STabLineItem": "
|
|
29
|
-
"_selected": "
|
|
30
|
-
"_disabled": "
|
|
31
|
-
"__SText": "
|
|
32
|
-
"__SAddon": "
|
|
33
|
-
"_neighborLocation_left": "
|
|
34
|
-
"_size_m": "
|
|
35
|
-
"_size_l": "
|
|
25
|
+
"__STabLine": "___STabLine_pmfda_gg_",
|
|
26
|
+
"_underlined": "__underlined_pmfda_gg_",
|
|
27
|
+
"__SCaret": "___SCaret_pmfda_gg_",
|
|
28
|
+
"__STabLineItem": "___STabLineItem_pmfda_gg_",
|
|
29
|
+
"_selected": "__selected_pmfda_gg_",
|
|
30
|
+
"_disabled": "__disabled_pmfda_gg_",
|
|
31
|
+
"__SText": "___SText_pmfda_gg_",
|
|
32
|
+
"__SAddon": "___SAddon_pmfda_gg_",
|
|
33
|
+
"_neighborLocation_left": "_neighborLocation_left_pmfda_gg_",
|
|
34
|
+
"_size_m": "_size_m_pmfda_gg_",
|
|
35
|
+
"_size_l": "_size_l_pmfda_gg_"
|
|
36
36
|
});
|
|
37
37
|
var optionsA11yEnhance = {
|
|
38
38
|
onNeighborChange: function onNeighborChange(neighborElement, props) {
|
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 React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\n\nexport type TabLineValue = string | number | boolean;\n\n/** @deprecated */\nexport interface ITabLineProps<T extends TabLineValue = TabLineValue>\n extends TabLineProps<T>,\n UnknownProperties {}\nexport type TabLineProps<T extends TabLineValue = TabLineValue> = BoxProps &\n NeighborLocationProps & {\n /** TabLine size\n * @default m\n * */\n size?: 'm' | 'l' | false;\n /** Adds a bottom border for the entire component\n * @default true\n * */\n underlined?: boolean;\n /** Is invoked when changing the selection */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLButtonElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Value of the selected tab */\n value?: T;\n /** Default value of the selected tab\n * @default null\n * */\n defaultValue?: T;\n\n /**\n * Behavior of tabs.\n * In `auto`, changes the tab immediately when press arrow.\n * In `manual`, needs to press `space` or `enter` for select a choice.\n * @default 'auto'\n */\n behavior?: 'auto' | 'manual';\n };\n\n/** @deprecated */\nexport interface ITabLineItemProps extends TabLineItemProps, UnknownProperties {}\nexport type TabLineItemProps = BoxProps &\n NeighborItemProps & {\n /** Makes a tab selected. This property is determined automatically depending on the value. */\n selected?: boolean;\n /** Disabled state */\n disabled?: boolean;\n /** Tab value */\n value?: TabLineValue;\n /** Left addon tag */\n addonLeft?: React.ElementType;\n /** Right addon tag */\n addonRight?: React.ElementType;\n };\n\n/** @deprecated */\nexport interface ITabLineContext extends TabLineContext, UnknownProperties {}\nexport type TabLineContext = {\n getItemProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ITabLineHandlers extends TabLineHandlers, UnknownProperties {}\nexport type TabLineHandlers = {\n value: (value: TabLineValue) => void;\n};\n\ntype IntergalacticTabLineComponent<PropsExtending = {}> = (<\n Value extends TabLineValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n TabLineProps<Value>,\n TabLineContext,\n [handlers: TabLineHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', TabLineProps>;\n\ndeclare const TabLine: IntergalacticTabLineComponent & {\n Item: Intergalactic.Component<'div', TabLineItemProps, {}, [handlers: TabLineHandlers]> & {\n Text: typeof Box;\n Addon: typeof Box;\n };\n};\n\ndeclare const wrapTabLine: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticTabLineComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticTabLineComponent<PropsExtending>;\nexport { wrapTabLine };\n\nexport default TabLine;\n"],"mappings":""}
|
package/lib/es6/TabLine.js
CHANGED
|
@@ -17,20 +17,20 @@ import addonTextChildren from '@semcore/core/lib/utils/addonTextChildren';
|
|
|
17
17
|
import a11yEnhance from '@semcore/core/lib/utils/enhances/a11yEnhance';
|
|
18
18
|
import NeighborLocation from '@semcore/neighbor-location';
|
|
19
19
|
/*!__reshadow-styles__:"./style/tab-line.shadow.css"*/
|
|
20
|
-
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".
|
|
20
|
+
var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___STabLine_pmfda_gg_{position:relative;display:flex;width:100%;max-width:100%}.___STabLine_pmfda_gg_.__underlined_pmfda_gg_{border-bottom:1px solid var(--intergalactic-border-primary, #c4c7cf)}.___STabLineItem_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;border:0;background:0 0;color:var(--intergalactic-text-primary, #191b23);margin-right:var(--intergalactic-spacing-4x, 16px);font-weight:var(--intergalactic-medium, 500)}.___STabLineItem_pmfda_gg_::-moz-focus-inner{border:0;padding:0}.___STabLineItem_pmfda_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{content:\"\";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background-color:transparent}.___STabLineItem_pmfda_gg_::before{transition:background-color calc(var(--intergalactic-duration-control, 200)*1ms) ease-in-out}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover::before{background-color:var(--intergalactic-border-primary, #c4c7cf)}}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after{transition-delay:calc(var(--intergalactic-duration-control, 200)*1ms);background-color:var(--intergalactic-border-info-active, #006dca)}.___STabLineItem_pmfda_gg_ .___SAddon_pmfda_gg_:not(:last-child),.___STabLineItem_pmfda_gg_ .___SText_pmfda_gg_:not(:last-child){margin-right:var(--intergalactic-spacing-2x, 8px)}.___SCaret_pmfda_gg_{position:absolute;bottom:-1px;height:3px;background-color:var(--intergalactic-border-info-active, #006dca);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_{flex-shrink:0}.___STabLineItem_pmfda_gg_.__disabled_pmfda_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SText_pmfda_gg_{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___SAddon_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_{height:28px;min-width:18px}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_{height:40px;min-width:26px}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___STabLineItem_pmfda_gg_._neighborLocation_left_pmfda_gg_{margin-right:0}@media (prefers-reduced-motion){.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{transition:none}.___SCaret_pmfda_gg_{display:none}}", /*__inner_css_end__*/"pmfda_gg_"),
|
|
21
21
|
/*__reshadow_css_end__*/
|
|
22
22
|
{
|
|
23
|
-
"__STabLine": "
|
|
24
|
-
"_underlined": "
|
|
25
|
-
"__SCaret": "
|
|
26
|
-
"__STabLineItem": "
|
|
27
|
-
"_selected": "
|
|
28
|
-
"_disabled": "
|
|
29
|
-
"__SText": "
|
|
30
|
-
"__SAddon": "
|
|
31
|
-
"_neighborLocation_left": "
|
|
32
|
-
"_size_m": "
|
|
33
|
-
"_size_l": "
|
|
23
|
+
"__STabLine": "___STabLine_pmfda_gg_",
|
|
24
|
+
"_underlined": "__underlined_pmfda_gg_",
|
|
25
|
+
"__SCaret": "___SCaret_pmfda_gg_",
|
|
26
|
+
"__STabLineItem": "___STabLineItem_pmfda_gg_",
|
|
27
|
+
"_selected": "__selected_pmfda_gg_",
|
|
28
|
+
"_disabled": "__disabled_pmfda_gg_",
|
|
29
|
+
"__SText": "___SText_pmfda_gg_",
|
|
30
|
+
"__SAddon": "___SAddon_pmfda_gg_",
|
|
31
|
+
"_neighborLocation_left": "_neighborLocation_left_pmfda_gg_",
|
|
32
|
+
"_size_m": "_size_m_pmfda_gg_",
|
|
33
|
+
"_size_l": "_size_l_pmfda_gg_"
|
|
34
34
|
});
|
|
35
35
|
var optionsA11yEnhance = {
|
|
36
36
|
onNeighborChange: function onNeighborChange(neighborElement, props) {
|
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 React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\
|
|
1
|
+
{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { Box, BoxProps } from '@semcore/flex-box';\nimport { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';\n\nexport type TabLineValue = string | number | boolean;\n\n/** @deprecated */\nexport interface ITabLineProps<T extends TabLineValue = TabLineValue>\n extends TabLineProps<T>,\n UnknownProperties {}\nexport type TabLineProps<T extends TabLineValue = TabLineValue> = BoxProps &\n NeighborLocationProps & {\n /** TabLine size\n * @default m\n * */\n size?: 'm' | 'l' | false;\n /** Adds a bottom border for the entire component\n * @default true\n * */\n underlined?: boolean;\n /** Is invoked when changing the selection */\n onChange?:\n | ((value: T, e?: React.SyntheticEvent<HTMLButtonElement>) => void)\n | React.Dispatch<React.SetStateAction<T>>;\n /** Value of the selected tab */\n value?: T;\n /** Default value of the selected tab\n * @default null\n * */\n defaultValue?: T;\n\n /**\n * Behavior of tabs.\n * In `auto`, changes the tab immediately when press arrow.\n * In `manual`, needs to press `space` or `enter` for select a choice.\n * @default 'auto'\n */\n behavior?: 'auto' | 'manual';\n };\n\n/** @deprecated */\nexport interface ITabLineItemProps extends TabLineItemProps, UnknownProperties {}\nexport type TabLineItemProps = BoxProps &\n NeighborItemProps & {\n /** Makes a tab selected. This property is determined automatically depending on the value. */\n selected?: boolean;\n /** Disabled state */\n disabled?: boolean;\n /** Tab value */\n value?: TabLineValue;\n /** Left addon tag */\n addonLeft?: React.ElementType;\n /** Right addon tag */\n addonRight?: React.ElementType;\n };\n\n/** @deprecated */\nexport interface ITabLineContext extends TabLineContext, UnknownProperties {}\nexport type TabLineContext = {\n getItemProps: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ITabLineHandlers extends TabLineHandlers, UnknownProperties {}\nexport type TabLineHandlers = {\n value: (value: TabLineValue) => void;\n};\n\ntype IntergalacticTabLineComponent<PropsExtending = {}> = (<\n Value extends TabLineValue,\n Tag extends Intergalactic.Tag = 'div',\n>(\n props: Intergalactic.InternalTypings.ComponentProps<\n Tag,\n 'div',\n TabLineProps<Value>,\n TabLineContext,\n [handlers: TabLineHandlers]\n > &\n PropsExtending,\n) => Intergalactic.InternalTypings.ComponentRenderingResults) &\n Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', TabLineProps>;\n\ndeclare const TabLine: IntergalacticTabLineComponent & {\n Item: Intergalactic.Component<'div', TabLineItemProps, {}, [handlers: TabLineHandlers]> & {\n Text: typeof Box;\n Addon: typeof Box;\n };\n};\n\ndeclare const wrapTabLine: <PropsExtending extends {}>(\n wrapper: (\n props: Intergalactic.InternalTypings.UntypeRefAndTag<\n Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticTabLineComponent>\n > &\n PropsExtending,\n ) => React.ReactNode,\n) => IntergalacticTabLineComponent<PropsExtending>;\nexport { wrapTabLine };\n\nexport default TabLine;\n"],"mappings":""}
|
package/lib/esm/TabLine.mjs
CHANGED
|
@@ -16,22 +16,22 @@ var style = (
|
|
|
16
16
|
/*__reshadow_css_start__*/
|
|
17
17
|
(sstyled.insert(
|
|
18
18
|
/*__inner_css_start__*/
|
|
19
|
-
'.
|
|
19
|
+
'.___STabLine_pmfda_gg_{position:relative;display:flex;width:100%;max-width:100%}.___STabLine_pmfda_gg_.__underlined_pmfda_gg_{border-bottom:1px solid var(--intergalactic-border-primary, #c4c7cf)}.___STabLineItem_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center;position:relative;touch-action:manipulation;white-space:nowrap;-webkit-user-select:none;-moz-user-select:none;user-select:none;box-sizing:border-box;padding:0;margin:0;box-shadow:none;-webkit-text-decoration:none;text-decoration:none;-webkit-tap-highlight-color:transparent;overflow:visible;text-align:center;vertical-align:middle;font-family:inherit;cursor:pointer;border:0;background:0 0;color:var(--intergalactic-text-primary, #191b23);margin-right:var(--intergalactic-spacing-4x, 16px);font-weight:var(--intergalactic-medium, 500)}.___STabLineItem_pmfda_gg_::-moz-focus-inner{border:0;padding:0}.___STabLineItem_pmfda_gg_:active{-webkit-text-decoration:none;text-decoration:none}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover{-webkit-text-decoration:none;text-decoration:none}}.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{content:"";position:absolute;left:0;bottom:-1px;height:3px;width:100%;background-color:transparent}.___STabLineItem_pmfda_gg_::before{transition:background-color calc(var(--intergalactic-duration-control, 200)*1ms) ease-in-out}@media (hover:hover){.___STabLineItem_pmfda_gg_:hover::before{background-color:var(--intergalactic-border-primary, #c4c7cf)}}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after{transition-delay:calc(var(--intergalactic-duration-control, 200)*1ms);background-color:var(--intergalactic-border-info-active, #006dca)}.___STabLineItem_pmfda_gg_ .___SAddon_pmfda_gg_:not(:last-child),.___STabLineItem_pmfda_gg_ .___SText_pmfda_gg_:not(:last-child){margin-right:var(--intergalactic-spacing-2x, 8px)}.___SCaret_pmfda_gg_{position:absolute;bottom:-1px;height:3px;background-color:var(--intergalactic-border-info-active, #006dca);transition:calc(var(--intergalactic-duration-control, 200)*1ms) all ease-in-out}.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_{flex-shrink:0}.___STabLineItem_pmfda_gg_.__disabled_pmfda_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none}.___SText_pmfda_gg_{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.___SAddon_pmfda_gg_{display:inline-flex;align-items:center;justify-content:center}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_{height:28px;min-width:18px}.___STabLineItem_pmfda_gg_._size_m_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%)}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_{height:40px;min-width:26px}.___STabLineItem_pmfda_gg_._size_l_pmfda_gg_ .___SText_pmfda_gg_{font-size:var(--intergalactic-fs-300, 16px);line-height:var(--intergalactic-lh-300, 150%)}.___STabLineItem_pmfda_gg_._neighborLocation_left_pmfda_gg_{margin-right:0}@media (prefers-reduced-motion){.___STabLineItem_pmfda_gg_.__selected_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::after,.___STabLineItem_pmfda_gg_::before{transition:none}.___SCaret_pmfda_gg_{display:none}}',
|
|
20
20
|
/*__inner_css_end__*/
|
|
21
|
-
"
|
|
21
|
+
"pmfda_gg_"
|
|
22
22
|
), /*__reshadow_css_end__*/
|
|
23
23
|
{
|
|
24
|
-
"__STabLine": "
|
|
25
|
-
"_underlined": "
|
|
26
|
-
"__SCaret": "
|
|
27
|
-
"__STabLineItem": "
|
|
28
|
-
"_selected": "
|
|
29
|
-
"_disabled": "
|
|
30
|
-
"__SText": "
|
|
31
|
-
"__SAddon": "
|
|
32
|
-
"_neighborLocation_left": "
|
|
33
|
-
"_size_m": "
|
|
34
|
-
"_size_l": "
|
|
24
|
+
"__STabLine": "___STabLine_pmfda_gg_",
|
|
25
|
+
"_underlined": "__underlined_pmfda_gg_",
|
|
26
|
+
"__SCaret": "___SCaret_pmfda_gg_",
|
|
27
|
+
"__STabLineItem": "___STabLineItem_pmfda_gg_",
|
|
28
|
+
"_selected": "__selected_pmfda_gg_",
|
|
29
|
+
"_disabled": "__disabled_pmfda_gg_",
|
|
30
|
+
"__SText": "___SText_pmfda_gg_",
|
|
31
|
+
"__SAddon": "___SAddon_pmfda_gg_",
|
|
32
|
+
"_neighborLocation_left": "_neighborLocation_left_pmfda_gg_",
|
|
33
|
+
"_size_m": "_size_m_pmfda_gg_",
|
|
34
|
+
"_size_l": "_size_l_pmfda_gg_"
|
|
35
35
|
})
|
|
36
36
|
);
|
|
37
37
|
var optionsA11yEnhance = {
|
package/lib/types/index.d.ts
CHANGED
|
@@ -2,7 +2,6 @@ import React from 'react';
|
|
|
2
2
|
import { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
|
|
3
3
|
import { Box, BoxProps } from '@semcore/flex-box';
|
|
4
4
|
import { NeighborItemProps, NeighborLocationProps } from '@semcore/neighbor-location';
|
|
5
|
-
import { KeyboardFocusProps } from '@semcore/core/lib/utils/enhances/keyboardFocusEnhance';
|
|
6
5
|
|
|
7
6
|
export type TabLineValue = string | number | boolean;
|
|
8
7
|
|
|
@@ -43,7 +42,6 @@ export type TabLineProps<T extends TabLineValue = TabLineValue> = BoxProps &
|
|
|
43
42
|
/** @deprecated */
|
|
44
43
|
export interface ITabLineItemProps extends TabLineItemProps, UnknownProperties {}
|
|
45
44
|
export type TabLineItemProps = BoxProps &
|
|
46
|
-
KeyboardFocusProps &
|
|
47
45
|
NeighborItemProps & {
|
|
48
46
|
/** Makes a tab selected. This property is determined automatically depending on the value. */
|
|
49
47
|
selected?: boolean;
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@semcore/tab-line",
|
|
3
3
|
"description": "Semrush TabLine Component",
|
|
4
|
-
"version": "16.0.
|
|
4
|
+
"version": "16.0.1-prerelease.2",
|
|
5
5
|
"main": "lib/cjs/index.js",
|
|
6
6
|
"module": "lib/es6/index.js",
|
|
7
7
|
"typings": "lib/types/index.d.ts",
|
|
@@ -14,11 +14,11 @@
|
|
|
14
14
|
"types": "./lib/types/index.d.ts"
|
|
15
15
|
},
|
|
16
16
|
"dependencies": {
|
|
17
|
-
"@semcore/flex-box": "16.0.
|
|
18
|
-
"@semcore/neighbor-location": "16.0.
|
|
17
|
+
"@semcore/flex-box": "16.0.1-prerelease.2",
|
|
18
|
+
"@semcore/neighbor-location": "16.0.1-prerelease.2"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
|
-
"@semcore/base-components": "^16.0.
|
|
21
|
+
"@semcore/base-components": "^16.0.1-prerelease.2"
|
|
22
22
|
},
|
|
23
23
|
"repository": {
|
|
24
24
|
"type": "git",
|