@synerise/ds-list-item 1.4.8 → 1.4.10
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 -0
- package/README.md +27 -9
- package/dist/ListItem.const.d.ts +1 -1
- package/dist/ListItem.const.js +6 -3
- package/dist/ListItem.d.ts +14 -14
- package/dist/ListItem.js +33 -50
- package/dist/ListItem.styles.js +1 -0
- package/dist/ListItem.types.d.ts +5 -5
- package/dist/ListItem.types.js +13 -14
- package/dist/components/Danger/Danger.d.ts +4 -4
- package/dist/components/Danger/Danger.js +11 -12
- package/dist/components/Danger/Danger.styles.d.ts +3 -3
- package/dist/components/Danger/Danger.styles.js +23 -18
- package/dist/components/Divider/Divider.d.ts +2 -2
- package/dist/components/Divider/Divider.js +8 -9
- package/dist/components/Divider/Divider.styles.d.ts +2 -2
- package/dist/components/Divider/Divider.styles.js +7 -8
- package/dist/components/Divider/Divider.types.d.ts +1 -1
- package/dist/components/Divider/Divider.types.js +1 -1
- package/dist/components/GroupItem/GroupItem.d.ts +2 -2
- package/dist/components/GroupItem/GroupItem.js +17 -9
- package/dist/components/GroupItem/GroupItem.styles.d.ts +1 -1
- package/dist/components/GroupItem/GroupItem.styles.js +6 -5
- package/dist/components/Header/Header.d.ts +2 -2
- package/dist/components/Header/Header.js +19 -22
- package/dist/components/Header/Header.styles.d.ts +2 -2
- package/dist/components/Header/Header.styles.js +9 -9
- package/dist/components/Header/Header.types.d.ts +2 -2
- package/dist/components/Header/Header.types.js +1 -1
- package/dist/components/HoverTooltip/HoverTooltip.const.d.ts +1 -1
- package/dist/components/HoverTooltip/HoverTooltip.const.js +13 -6
- package/dist/components/HoverTooltip/HoverTooltip.d.ts +2 -2
- package/dist/components/HoverTooltip/HoverTooltip.js +26 -44
- package/dist/components/HoverTooltip/HoverTooltip.styles.d.ts +1 -1
- package/dist/components/HoverTooltip/HoverTooltip.styles.js +6 -3
- package/dist/components/HoverTooltip/HoverTooltip.types.d.ts +2 -2
- package/dist/components/HoverTooltip/HoverTooltip.types.js +1 -1
- package/dist/components/ListContext/ListContext.d.ts +3 -3
- package/dist/components/ListContext/ListContext.js +8 -4
- package/dist/components/ListContext/ListContextProvider.d.ts +2 -2
- package/dist/components/ListContext/ListContextProvider.js +16 -19
- package/dist/components/ListWrapper/ListWrapper.d.ts +3 -3
- package/dist/components/ListWrapper/ListWrapper.js +13 -13
- package/dist/components/ListWrapper/ListWrapper.styles.d.ts +1 -1
- package/dist/components/ListWrapper/ListWrapper.styles.js +6 -5
- package/dist/components/Select/Select.d.ts +4 -5
- package/dist/components/Select/Select.js +12 -16
- package/dist/components/Select/Select.styles.d.ts +3 -3
- package/dist/components/Select/Select.styles.js +8 -7
- package/dist/components/SubMenu/SubMenu.d.ts +2 -2
- package/dist/components/SubMenu/SubMenu.js +16 -22
- package/dist/components/SubMenu/SubMenu.styles.d.ts +2 -2
- package/dist/components/SubMenu/SubMenu.styles.js +9 -7
- package/dist/components/Text/DynamicLabel.d.ts +1 -1
- package/dist/components/Text/DynamicLabel.js +15 -10
- package/dist/components/Text/ItemLabel.const.js +4 -1
- package/dist/components/Text/ItemLabel.d.ts +3 -3
- package/dist/components/Text/ItemLabel.js +81 -82
- package/dist/components/Text/Text.d.ts +4 -4
- package/dist/components/Text/Text.js +119 -159
- package/dist/components/Text/Text.styles.d.ts +14 -14
- package/dist/components/Text/Text.styles.js +49 -85
- package/dist/components/Text/utils.d.ts +2 -2
- package/dist/components/Text/utils.js +27 -27
- package/dist/components/index.js +12 -5
- package/dist/hooks/useTemporaryLabel.d.ts +1 -1
- package/dist/hooks/useTemporaryLabel.js +12 -13
- package/dist/index.js +22 -7
- package/dist/modules.d.js +1 -1
- package/dist/modules.d.ts +0 -0
- package/package.json +9 -9
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
const MenuHeader = /* @__PURE__ */ styled.div.withConfig({
|
|
3
3
|
displayName: "Headerstyles__MenuHeader",
|
|
4
4
|
componentId: "sc-1ntgmf9-0"
|
|
5
|
-
})(["display:flex;align-items:center;font-size:10px;font-weight:500;text-transform:uppercase;color:", ";height:40px;padding:12px;line-height:1.6;letter-spacing:0.1px;"],
|
|
6
|
-
|
|
7
|
-
});
|
|
8
|
-
export var HeaderIconWrapper = styled.div.withConfig({
|
|
5
|
+
})(["display:flex;align-items:center;font-size:10px;font-weight:500;text-transform:uppercase;color:", ";height:40px;padding:12px;line-height:1.6;letter-spacing:0.1px;"], (props) => props.theme.palette["grey-500"]);
|
|
6
|
+
const HeaderIconWrapper = /* @__PURE__ */ styled.div.withConfig({
|
|
9
7
|
displayName: "Headerstyles__HeaderIconWrapper",
|
|
10
8
|
componentId: "sc-1ntgmf9-1"
|
|
11
|
-
})(["color:", ";"],
|
|
12
|
-
|
|
13
|
-
|
|
9
|
+
})(["color:", ";"], (props) => props.theme.palette["grey-400"]);
|
|
10
|
+
export {
|
|
11
|
+
HeaderIconWrapper,
|
|
12
|
+
MenuHeader
|
|
13
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import {
|
|
1
|
+
import { ReactNode } from 'react';
|
|
2
|
+
import { WithHTMLAttributes } from '@synerise/ds-utils';
|
|
3
3
|
export type HeaderProps = WithHTMLAttributes<HTMLDivElement, {
|
|
4
4
|
text?: ReactNode;
|
|
5
5
|
children?: ReactNode;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { FlipConfig, HoverConfig, OffsetConfig, ShiftConfig } from '@synerise/ds-popover';
|
|
2
2
|
export declare const TRANSITION_DURATION = 150;
|
|
3
3
|
export declare const OFFSET_CONFIG: OffsetConfig;
|
|
4
4
|
export declare const FLIP_CONFIG: FlipConfig;
|
|
@@ -1,14 +1,21 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
const TRANSITION_DURATION = 150;
|
|
2
|
+
const OFFSET_CONFIG = {
|
|
3
3
|
mainAxis: 8
|
|
4
4
|
};
|
|
5
|
-
|
|
6
|
-
|
|
5
|
+
const FLIP_CONFIG = {};
|
|
6
|
+
const HOVER_CONFIG = {
|
|
7
7
|
delay: {
|
|
8
8
|
open: 100,
|
|
9
9
|
close: 400
|
|
10
10
|
}
|
|
11
11
|
};
|
|
12
|
-
|
|
12
|
+
const SHIFT_CONFIG = {
|
|
13
13
|
crossAxis: true
|
|
14
|
-
};
|
|
14
|
+
};
|
|
15
|
+
export {
|
|
16
|
+
FLIP_CONFIG,
|
|
17
|
+
HOVER_CONFIG,
|
|
18
|
+
OFFSET_CONFIG,
|
|
19
|
+
SHIFT_CONFIG,
|
|
20
|
+
TRANSITION_DURATION
|
|
21
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import {
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { HoverTooltipProps } from './HoverTooltip.types';
|
|
3
3
|
declare const HoverTooltip: ({ popoverProps, renderHoverTooltip, children, style, }: HoverTooltipProps) => React.JSX.Element;
|
|
4
4
|
export default HoverTooltip;
|
|
@@ -1,48 +1,30 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import { useTheme } from
|
|
4
|
-
import { Popover, PopoverContent, PopoverTrigger
|
|
5
|
-
import {
|
|
6
|
-
import { PropagationStopper } from
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
};
|
|
18
|
-
}, []);
|
|
19
|
-
var popoverPlacement = getPlacement((popoverProps == null ? void 0 : popoverProps.placement) || 'right');
|
|
1
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useCallback } from "react";
|
|
3
|
+
import { useTheme } from "@synerise/ds-core";
|
|
4
|
+
import { getPlacement, Popover, PopoverContent, PopoverTrigger } from "@synerise/ds-popover";
|
|
5
|
+
import { TRANSITION_DURATION, HOVER_CONFIG, FLIP_CONFIG, OFFSET_CONFIG, SHIFT_CONFIG } from "./HoverTooltip.const.js";
|
|
6
|
+
import { PropagationStopper } from "./HoverTooltip.styles.js";
|
|
7
|
+
const HoverTooltip = ({
|
|
8
|
+
popoverProps,
|
|
9
|
+
renderHoverTooltip,
|
|
10
|
+
children,
|
|
11
|
+
style
|
|
12
|
+
}) => {
|
|
13
|
+
const dsTheme = useTheme();
|
|
14
|
+
const zIndex = parseInt(dsTheme.variables["zindex-tooltip"], 10);
|
|
15
|
+
const cancelBubblingEvent = useCallback(() => (event) => event.stopPropagation(), []);
|
|
16
|
+
const popoverPlacement = getPlacement(popoverProps?.placement || "right");
|
|
20
17
|
return (
|
|
21
|
-
/*#__PURE__*/
|
|
22
18
|
// onKeyDown is used to disallow propagating key events to tooltip's container element
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
testId: "information-card",
|
|
31
|
-
shiftConfig: SHIFT_CONFIG,
|
|
32
|
-
offsetConfig: OFFSET_CONFIG,
|
|
33
|
-
flipConfig: FLIP_CONFIG,
|
|
34
|
-
hoverConfig: HOVER_CONFIG,
|
|
35
|
-
transitionDuration: TRANSITION_DURATION,
|
|
36
|
-
zIndex: zIndex
|
|
37
|
-
}, popoverProps, {
|
|
38
|
-
placement: popoverPlacement
|
|
39
|
-
}), /*#__PURE__*/React.createElement(PopoverContent, null, renderHoverTooltip && renderHoverTooltip()), /*#__PURE__*/React.createElement(PopoverTrigger, {
|
|
40
|
-
asChild: true
|
|
41
|
-
}, /*#__PURE__*/React.createElement("div", {
|
|
42
|
-
style: _extends({
|
|
43
|
-
position: 'relative'
|
|
44
|
-
}, style)
|
|
45
|
-
}, children))))
|
|
19
|
+
/* @__PURE__ */ jsx(PropagationStopper, { onKeyDown: cancelBubblingEvent, onClick: cancelBubblingEvent, children: /* @__PURE__ */ jsxs(Popover, { trigger: "hover", modal: false, componentId: "information-card", testId: "information-card", shiftConfig: SHIFT_CONFIG, offsetConfig: OFFSET_CONFIG, flipConfig: FLIP_CONFIG, hoverConfig: HOVER_CONFIG, transitionDuration: TRANSITION_DURATION, zIndex, ...popoverProps, placement: popoverPlacement, children: [
|
|
20
|
+
/* @__PURE__ */ jsx(PopoverContent, { children: renderHoverTooltip && renderHoverTooltip() }),
|
|
21
|
+
/* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsx("div", { style: {
|
|
22
|
+
position: "relative",
|
|
23
|
+
...style
|
|
24
|
+
}, children }) })
|
|
25
|
+
] }) })
|
|
46
26
|
);
|
|
47
27
|
};
|
|
48
|
-
export
|
|
28
|
+
export {
|
|
29
|
+
HoverTooltip as default
|
|
30
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const PropagationStopper: import(
|
|
1
|
+
export declare const PropagationStopper: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
const PropagationStopper = /* @__PURE__ */ styled.div.withConfig({
|
|
3
3
|
displayName: "HoverTooltipstyles__PropagationStopper",
|
|
4
4
|
componentId: "sc-5vleg6-0"
|
|
5
|
-
})(["display:contents;"]);
|
|
5
|
+
})(["display:contents;"]);
|
|
6
|
+
export {
|
|
7
|
+
PropagationStopper
|
|
8
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import { CSSProperties, ReactNode } from 'react';
|
|
2
|
+
import { BasicItemProps } from '../../ListItem.types';
|
|
3
3
|
export type HoverTooltipProps = {
|
|
4
4
|
children: ReactNode;
|
|
5
5
|
style?: CSSProperties;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
1
|
+
import { DelayConfig } from '@synerise/ds-popover';
|
|
2
|
+
import { ListItemProps } from '../../ListItem.types';
|
|
3
3
|
export type ListContextProps = {
|
|
4
4
|
onClick?: ListItemProps['onClick'];
|
|
5
5
|
popoverDelay?: DelayConfig;
|
|
6
6
|
selectedKeys?: [];
|
|
7
7
|
multiple?: boolean;
|
|
8
8
|
};
|
|
9
|
-
export declare const ListContext: import(
|
|
9
|
+
export declare const ListContext: import('react').Context<ListContextProps | undefined>;
|
|
10
10
|
export declare const useListContext: () => ListContextProps | undefined;
|
|
@@ -1,5 +1,9 @@
|
|
|
1
|
-
import { createContext, useContext } from
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
import { createContext, useContext } from "react";
|
|
2
|
+
const ListContext = createContext(void 0);
|
|
3
|
+
const useListContext = () => {
|
|
4
4
|
return useContext(ListContext);
|
|
5
|
-
};
|
|
5
|
+
};
|
|
6
|
+
export {
|
|
7
|
+
ListContext,
|
|
8
|
+
useListContext
|
|
9
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React,
|
|
2
|
-
import {
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { ListContextProps } from './ListContext';
|
|
3
3
|
export declare const ListContextProvider: ({ children, popoverDelay, ...rest }: ListContextProps & {
|
|
4
4
|
children?: ReactNode;
|
|
5
5
|
}) => React.JSX.Element;
|
|
@@ -1,19 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
value: rest
|
|
18
|
-
}, children));
|
|
19
|
-
};
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { FloatingDelayGroup } from "@synerise/ds-popover";
|
|
3
|
+
import { ListContext } from "./ListContext.js";
|
|
4
|
+
const ListContextProvider = ({
|
|
5
|
+
children,
|
|
6
|
+
popoverDelay = {
|
|
7
|
+
open: 100,
|
|
8
|
+
close: 400
|
|
9
|
+
},
|
|
10
|
+
...rest
|
|
11
|
+
}) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(FloatingDelayGroup, { delay: popoverDelay, children: /* @__PURE__ */ jsx(ListContext.Provider, { value: rest, children }) });
|
|
13
|
+
};
|
|
14
|
+
export {
|
|
15
|
+
ListContextProvider
|
|
16
|
+
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import React,
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
1
|
+
import { default as React, ReactNode } from 'react';
|
|
2
|
+
import { WithHTMLAttributes } from '@synerise/ds-utils';
|
|
3
|
+
import { ListContextProps } from '../ListContext/ListContext';
|
|
4
4
|
export type ListWrapperProps = WithHTMLAttributes<HTMLDivElement, ListContextProps & {
|
|
5
5
|
children?: ReactNode;
|
|
6
6
|
}>;
|
|
@@ -1,13 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
import
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
};
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { ListContextProvider } from "../ListContext/ListContextProvider.js";
|
|
3
|
+
import { ListWrapperContainer } from "./ListWrapper.styles.js";
|
|
4
|
+
const ListWrapper = ({
|
|
5
|
+
children,
|
|
6
|
+
onClick,
|
|
7
|
+
...htmlAttributes
|
|
8
|
+
}) => {
|
|
9
|
+
return /* @__PURE__ */ jsx(ListWrapperContainer, { ...htmlAttributes, children: /* @__PURE__ */ jsx(ListContextProvider, { onClick, children }) });
|
|
10
|
+
};
|
|
11
|
+
export {
|
|
12
|
+
ListWrapper
|
|
13
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const ListWrapperContainer: import(
|
|
1
|
+
export declare const ListWrapperContainer: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
const ListWrapperContainer = /* @__PURE__ */ styled.div.withConfig({
|
|
3
3
|
displayName: "ListWrapperstyles__ListWrapperContainer",
|
|
4
4
|
componentId: "sc-1f54kju-0"
|
|
5
|
-
})(["padding:8px;background:", ";border-radius:3px;"],
|
|
6
|
-
|
|
7
|
-
|
|
5
|
+
})(["padding:8px;background:", ";border-radius:3px;"], (props) => props.theme.palette.white);
|
|
6
|
+
export {
|
|
7
|
+
ListWrapperContainer
|
|
8
|
+
};
|
|
@@ -1,7 +1,6 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import '
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
ItemComponent: React.ComponentType<import("../../ListItem.types").ListItemProps>;
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
import { NestedItemProps } from '../../ListItem.types';
|
|
3
|
+
declare const Select: React.ForwardRefExoticComponent<Omit<import('../../ListItem.types').ListItemProps, "level" | "higher" | "text" | "type"> & {
|
|
4
|
+
ItemComponent: React.ComponentType<import('../../ListItem.types').ListItemProps>;
|
|
6
5
|
} & NestedItemProps & React.RefAttributes<HTMLDivElement>>;
|
|
7
6
|
export default Select;
|
|
@@ -1,17 +1,13 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
11
|
-
// TODO uuid
|
|
12
|
-
return /*#__PURE__*/React.createElement(S.SelectItem, _extends({
|
|
13
|
-
ref: ref,
|
|
14
|
-
key: uuid()
|
|
15
|
-
}, rest), children);
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
import { v4 } from "uuid";
|
|
4
|
+
import { SelectItem } from "./Select.styles.js";
|
|
5
|
+
const Select = forwardRef(({
|
|
6
|
+
children,
|
|
7
|
+
...rest
|
|
8
|
+
}, ref) => {
|
|
9
|
+
return /* @__PURE__ */ jsx(SelectItem, { ref, ...rest, children }, v4());
|
|
16
10
|
});
|
|
17
|
-
export
|
|
11
|
+
export {
|
|
12
|
+
Select as default
|
|
13
|
+
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export declare const SelectItem: import(
|
|
2
|
-
ItemComponent: import(
|
|
3
|
-
} & import(
|
|
1
|
+
export declare const SelectItem: import('styled-components').StyledComponent<import('react').ForwardRefExoticComponent<Omit<import('../..').ListItemProps, "level" | "higher" | "text" | "type"> & {
|
|
2
|
+
ItemComponent: import('react').ComponentType<import('../..').ListItemProps>;
|
|
3
|
+
} & import('../../ListItem.types').NestedItemProps & import('react').RefAttributes<HTMLDivElement>>, any, {}, never>;
|
|
@@ -1,9 +1,10 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
import Text from
|
|
3
|
-
import { SuffixWrapper } from
|
|
4
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
import Text from "../Text/Text.js";
|
|
3
|
+
import { SuffixWrapper } from "../Text/Text.styles.js";
|
|
4
|
+
const SelectItem = /* @__PURE__ */ styled(Text).withConfig({
|
|
5
5
|
displayName: "Selectstyles__SelectItem",
|
|
6
6
|
componentId: "sc-a89gla-0"
|
|
7
|
-
})(["&{", " > *{opacity:0;transition:opacity 0.3s ease-in-out,color 0.3s ease-in-out;}}&:hover,&:focus{", " > *{opacity:1;color:", ";}}"], SuffixWrapper, SuffixWrapper,
|
|
8
|
-
|
|
9
|
-
|
|
7
|
+
})(["&{", " > *{opacity:0;transition:opacity 0.3s ease-in-out,color 0.3s ease-in-out;}}&:hover,&:focus{", " > *{opacity:1;color:", ";}}"], SuffixWrapper, SuffixWrapper, (props) => props.theme.palette["blue-600"]);
|
|
8
|
+
export {
|
|
9
|
+
SelectItem
|
|
10
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React,
|
|
2
|
-
import {
|
|
1
|
+
import { default as React, ComponentType } from 'react';
|
|
2
|
+
import { ListItemProps } from '../../ListItem.types';
|
|
3
3
|
type SubMenuProps = {
|
|
4
4
|
dataSource?: ListItemProps[];
|
|
5
5
|
onClick?: ListItemProps['onClick'];
|
|
@@ -1,22 +1,16 @@
|
|
|
1
|
-
|
|
2
|
-
import
|
|
3
|
-
import { ListContextProvider } from
|
|
4
|
-
import
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
return /*#__PURE__*/React.createElement(ItemComponent, _extends({}, item, {
|
|
18
|
-
key: item.itemKey,
|
|
19
|
-
indentLevel: indentLevel
|
|
20
|
-
}));
|
|
21
|
-
})));
|
|
22
|
-
});
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef, createElement } from "react";
|
|
3
|
+
import { ListContextProvider } from "../ListContext/ListContextProvider.js";
|
|
4
|
+
import { SubMenuContainer } from "./SubMenu.styles.js";
|
|
5
|
+
const SubMenu = forwardRef(({
|
|
6
|
+
onClick,
|
|
7
|
+
isOpen,
|
|
8
|
+
dataSource,
|
|
9
|
+
indentLevel,
|
|
10
|
+
ItemComponent
|
|
11
|
+
}, forwardedRef) => {
|
|
12
|
+
return /* @__PURE__ */ jsx(ListContextProvider, { onClick, children: /* @__PURE__ */ jsx(SubMenuContainer, { ref: forwardedRef, isOpen, children: dataSource?.map((item) => /* @__PURE__ */ createElement(ItemComponent, { ...item, key: item.itemKey, indentLevel })) }) });
|
|
13
|
+
});
|
|
14
|
+
export {
|
|
15
|
+
SubMenu
|
|
16
|
+
};
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare const SubMenuContainer: import(
|
|
1
|
+
export declare const SubMenuContainer: import('styled-components').StyledComponent<"div", any, {
|
|
2
2
|
isOpen?: boolean;
|
|
3
3
|
}, never>;
|
|
4
|
-
export declare const SubMenuList: import(
|
|
4
|
+
export declare const SubMenuList: import('styled-components').StyledComponent<"div", any, {}, never>;
|
|
@@ -1,11 +1,13 @@
|
|
|
1
|
-
import styled from
|
|
2
|
-
|
|
1
|
+
import styled from "styled-components";
|
|
2
|
+
const SubMenuContainer = /* @__PURE__ */ styled.div.withConfig({
|
|
3
3
|
displayName: "SubMenustyles__SubMenuContainer",
|
|
4
4
|
componentId: "sc-12pkrfi-0"
|
|
5
|
-
})(["max-height:", "px;overflow:hidden;transition:max-height 0.3s ease;"],
|
|
6
|
-
|
|
7
|
-
});
|
|
8
|
-
export var SubMenuList = styled.div.withConfig({
|
|
5
|
+
})(["max-height:", "px;overflow:hidden;transition:max-height 0.3s ease;"], (props) => props.isOpen ? "999" : "0");
|
|
6
|
+
const SubMenuList = /* @__PURE__ */ styled.div.withConfig({
|
|
9
7
|
displayName: "SubMenustyles__SubMenuList",
|
|
10
8
|
componentId: "sc-12pkrfi-1"
|
|
11
|
-
})([""]);
|
|
9
|
+
})([""]);
|
|
10
|
+
export {
|
|
11
|
+
SubMenuContainer,
|
|
12
|
+
SubMenuList
|
|
13
|
+
};
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
}
|
|
1
|
+
import { jsxs, jsx } from "react/jsx-runtime";
|
|
2
|
+
import { DynamicLabelWrapper, DynamicLabelMain, DynamicLabelAlternate } from "./Text.styles.js";
|
|
3
|
+
const DynamicLabel = ({
|
|
4
|
+
content,
|
|
5
|
+
alternativeContent,
|
|
6
|
+
showAlternative
|
|
7
|
+
}) => {
|
|
8
|
+
return alternativeContent ? /* @__PURE__ */ jsxs(DynamicLabelWrapper, { showAlternative: !!showAlternative, children: [
|
|
9
|
+
/* @__PURE__ */ jsx(DynamicLabelMain, { children: content }),
|
|
10
|
+
/* @__PURE__ */ jsx(DynamicLabelAlternate, { children: alternativeContent })
|
|
11
|
+
] }) : content;
|
|
12
|
+
};
|
|
13
|
+
export {
|
|
14
|
+
DynamicLabel
|
|
15
|
+
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import React,
|
|
2
|
-
import {
|
|
1
|
+
import { default as React, FocusEvent, KeyboardEvent, MouseEvent, ReactNode } from 'react';
|
|
2
|
+
import { ItemSize } from '../../ListItem.types';
|
|
3
3
|
export declare const ItemLabel: React.ForwardRefExoticComponent<{
|
|
4
4
|
onClick?: (event: MouseEvent<HTMLDivElement>) => void;
|
|
5
5
|
onKeyDown?: (event: KeyboardEvent<HTMLDivElement>) => void;
|
|
@@ -26,4 +26,4 @@ export declare const ItemLabel: React.ForwardRefExoticComponent<{
|
|
|
26
26
|
content?: ReactNode;
|
|
27
27
|
indentLevel?: number;
|
|
28
28
|
featured?: boolean;
|
|
29
|
-
} & Omit<React.HTMLAttributes<HTMLDivElement>, "content" | "onFocus" | "onBlur" | "onKeyDown" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "checked" | "description" | "disabled" | "noHover" | "ordered" | "parent" | "size" | "indentLevel" | "featured" | "
|
|
29
|
+
} & Omit<React.HTMLAttributes<HTMLDivElement>, "content" | "onFocus" | "onBlur" | "onKeyDown" | "onClick" | "onMouseDown" | "onMouseLeave" | "onMouseOver" | "checked" | "description" | "disabled" | "noHover" | "ordered" | "parent" | "size" | "indentLevel" | "featured" | "inTooltip" | "hasSubMenu" | "subMenuOpen" | "hasHighlight" | "prefixVisible" | "suffixVisible" | "prefixElement" | "suffixElement"> & import('@synerise/ds-utils').DataAttributes & React.RefAttributes<HTMLDivElement>>;
|