@laerdal/life-react-components 2.2.1-dev.9.full → 2.3.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/dist/Accordion/AccordionItem.cjs +17 -8
- package/dist/Accordion/AccordionItem.cjs.map +1 -1
- package/dist/Accordion/AccordionItem.d.ts +0 -2
- package/dist/Accordion/AccordionItem.js +18 -9
- package/dist/Accordion/AccordionItem.js.map +1 -1
- package/dist/Accordion/AccordionMenu.cjs +2 -6
- package/dist/Accordion/AccordionMenu.cjs.map +1 -1
- package/dist/Accordion/AccordionMenu.d.ts +0 -3
- package/dist/Accordion/AccordionMenu.js +2 -6
- package/dist/Accordion/AccordionMenu.js.map +1 -1
- package/dist/Accordion/styles.cjs +11 -7
- package/dist/Accordion/styles.cjs.map +1 -1
- package/dist/Accordion/styles.d.ts +4 -1
- package/dist/Accordion/styles.js +9 -6
- package/dist/Accordion/styles.js.map +1 -1
- package/dist/AuthPage/AuthPage.js +1 -1
- package/dist/Banners/Banner.cjs.map +1 -1
- package/dist/Banners/Banner.js.map +1 -1
- package/dist/Button/Button.cjs +1 -1
- package/dist/Button/Button.cjs.map +1 -1
- package/dist/Button/Button.js +2 -2
- package/dist/Button/Button.js.map +1 -1
- package/dist/Button/Iconbutton.cjs.map +1 -1
- package/dist/Button/Iconbutton.d.ts +1 -1
- package/dist/Button/Iconbutton.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCard.cjs +9 -12
- package/dist/Card/HorizontalCard/HorizontalCard.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCard.d.ts +0 -2
- package/dist/Card/HorizontalCard/HorizontalCard.js +8 -9
- package/dist/Card/HorizontalCard/HorizontalCard.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs +9 -13
- package/dist/Card/HorizontalCard/HorizontalCardBody.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardBody.d.ts +0 -4
- package/dist/Card/HorizontalCard/HorizontalCardBody.js +8 -8
- package/dist/Card/HorizontalCard/HorizontalCardBody.js.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs +5 -7
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.cjs.map +1 -1
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.d.ts +0 -2
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js +5 -5
- package/dist/Card/HorizontalCard/HorizontalCardThumbnail.js.map +1 -1
- package/dist/Card/HorizontalCard/index.cjs +12 -33
- package/dist/Card/HorizontalCard/index.cjs.map +1 -1
- package/dist/Card/HorizontalCard/index.d.ts +1 -3
- package/dist/Card/HorizontalCard/index.js +1 -3
- package/dist/Card/HorizontalCard/index.js.map +1 -1
- package/dist/Card/HorizontalCard/types.cjs.map +1 -1
- package/dist/Card/HorizontalCard/types.d.ts +1 -1
- package/dist/Card/HorizontalCard/types.js.map +1 -1
- package/dist/ChipsInput/ChipInputField.cjs +1 -1
- package/dist/ChipsInput/ChipInputField.cjs.map +1 -1
- package/dist/ChipsInput/ChipInputField.js +1 -1
- package/dist/ChipsInput/ChipInputField.js.map +1 -1
- package/dist/Dropdown/BasicDropdown.cjs +21 -6
- package/dist/Dropdown/BasicDropdown.cjs.map +1 -1
- package/dist/Dropdown/BasicDropdown.d.ts +2 -0
- package/dist/Dropdown/BasicDropdown.js +22 -7
- package/dist/Dropdown/BasicDropdown.js.map +1 -1
- package/dist/Dropdown/CommonStyling.cjs +7 -4
- package/dist/Dropdown/CommonStyling.cjs.map +1 -1
- package/dist/Dropdown/CommonStyling.d.ts +3 -1
- package/dist/Dropdown/CommonStyling.js +7 -4
- package/dist/Dropdown/CommonStyling.js.map +1 -1
- package/dist/Dropdown/DropdownContent.cjs +1 -1
- package/dist/Dropdown/DropdownContent.js +1 -1
- package/dist/Dropdown/DropdownFilter.cjs +16 -3
- package/dist/Dropdown/DropdownFilter.cjs.map +1 -1
- package/dist/Dropdown/DropdownFilter.d.ts +1 -0
- package/dist/Dropdown/DropdownFilter.js +16 -3
- package/dist/Dropdown/DropdownFilter.js.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.cjs.map +1 -1
- package/dist/Footer/Components/FooterNewsletterAndSocialSection.js.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs +3 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.cjs.map +1 -1
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js +4 -2
- package/dist/GlobalNavigationBar/GlobalNavigationBar.js.map +1 -1
- package/dist/GlobalNavigationBar/Logo.cjs.map +1 -1
- package/dist/GlobalNavigationBar/Logo.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs +7 -2
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.d.ts +4 -0
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js +6 -5
- package/dist/GlobalNavigationBar/desktop/ExtendedMainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs +178 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/desktop/MainMenu.d.ts +2 -2
- package/dist/GlobalNavigationBar/desktop/MainMenu.js +178 -56
- package/dist/GlobalNavigationBar/desktop/MainMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs +243 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.cjs.map +1 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.d.ts +18 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js +233 -0
- package/dist/GlobalNavigationBar/desktop/SubMenu.js.map +1 -0
- package/dist/GlobalNavigationBar/mobile/MobileMenu.cjs.map +1 -1
- package/dist/GlobalNavigationBar/mobile/MobileMenu.js.map +1 -1
- package/dist/GlobalNavigationBar/types.cjs.map +1 -1
- package/dist/GlobalNavigationBar/types.d.ts +12 -2
- package/dist/GlobalNavigationBar/types.js.map +1 -1
- package/dist/GlobalNavigationBar/utils.cjs +17 -0
- package/dist/GlobalNavigationBar/utils.cjs.map +1 -0
- package/dist/GlobalNavigationBar/utils.d.ts +2 -0
- package/dist/GlobalNavigationBar/utils.js +10 -0
- package/dist/GlobalNavigationBar/utils.js.map +1 -0
- package/dist/Image/ImageWithFallbacks.js +1 -1
- package/dist/InputFields/DatepickerField.cjs +54 -33
- package/dist/InputFields/DatepickerField.cjs.map +1 -1
- package/dist/InputFields/DatepickerField.d.ts +1 -0
- package/dist/InputFields/DatepickerField.js +55 -34
- package/dist/InputFields/DatepickerField.js.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.cjs.map +1 -1
- package/dist/InputFields/DatepickerFieldHeader.js +1 -1
- package/dist/InputFields/DatepickerFieldHeader.js.map +1 -1
- package/dist/InputFields/Label.cjs +12 -8
- package/dist/InputFields/Label.cjs.map +1 -1
- package/dist/InputFields/Label.js +12 -8
- package/dist/InputFields/Label.js.map +1 -1
- package/dist/InputFields/NumberField.cjs +33 -14
- package/dist/InputFields/NumberField.cjs.map +1 -1
- package/dist/InputFields/NumberField.d.ts +1 -0
- package/dist/InputFields/NumberField.js +36 -17
- package/dist/InputFields/NumberField.js.map +1 -1
- package/dist/InputFields/PasswordField.cjs +50 -44
- package/dist/InputFields/PasswordField.cjs.map +1 -1
- package/dist/InputFields/PasswordField.js +51 -45
- package/dist/InputFields/PasswordField.js.map +1 -1
- package/dist/InputFields/SearchBar.cjs +2 -1
- package/dist/InputFields/SearchBar.cjs.map +1 -1
- package/dist/InputFields/SearchBar.js +3 -2
- package/dist/InputFields/SearchBar.js.map +1 -1
- package/dist/InputFields/TextField.cjs +14 -2
- package/dist/InputFields/TextField.cjs.map +1 -1
- package/dist/InputFields/TextField.d.ts +1 -0
- package/dist/InputFields/TextField.js +15 -3
- package/dist/InputFields/TextField.js.map +1 -1
- package/dist/InputFields/Textarea.cjs +3 -8
- package/dist/InputFields/Textarea.cjs.map +1 -1
- package/dist/InputFields/Textarea.d.ts +7 -3
- package/dist/InputFields/Textarea.js +6 -12
- package/dist/InputFields/Textarea.js.map +1 -1
- package/dist/InputFields/components/SearchField.cjs +1 -1
- package/dist/InputFields/components/SearchField.cjs.map +1 -1
- package/dist/InputFields/components/SearchField.js +1 -1
- package/dist/InputFields/components/SearchField.js.map +1 -1
- package/dist/InputFields/styling.cjs +11 -11
- package/dist/InputFields/styling.cjs.map +1 -1
- package/dist/InputFields/styling.d.ts +2 -3
- package/dist/InputFields/styling.js +11 -10
- package/dist/InputFields/styling.js.map +1 -1
- package/dist/InputFields/types.cjs.map +1 -1
- package/dist/InputFields/types.d.ts +8 -4
- package/dist/InputFields/types.js.map +1 -1
- package/dist/LinearProgress/LinearProgress.js +1 -1
- package/dist/NavItem/NavItem.cjs +2 -1
- package/dist/NavItem/NavItem.cjs.map +1 -1
- package/dist/NavItem/NavItem.d.ts +1 -0
- package/dist/NavItem/NavItem.js +1 -1
- package/dist/NavItem/NavItem.js.map +1 -1
- package/dist/NavItem/NestedNavItem.cjs +38 -0
- package/dist/NavItem/NestedNavItem.cjs.map +1 -0
- package/dist/NavItem/NestedNavItem.d.ts +13 -0
- package/dist/NavItem/NestedNavItem.js +28 -0
- package/dist/NavItem/NestedNavItem.js.map +1 -0
- package/dist/Paginator/Paginator.cjs.map +1 -1
- package/dist/Paginator/Paginator.js.map +1 -1
- package/dist/Table/Table.cjs +1 -2
- package/dist/Table/Table.cjs.map +1 -1
- package/dist/Table/Table.js +1 -2
- package/dist/Table/Table.js.map +1 -1
- package/dist/Table/TableFooter.cjs.map +1 -1
- package/dist/Table/TableFooter.js +1 -1
- package/dist/Table/TableFooter.js.map +1 -1
- package/dist/Table/TableStyles.cjs +4 -4
- package/dist/Table/TableStyles.cjs.map +1 -1
- package/dist/Table/TableStyles.js +4 -4
- package/dist/Table/TableStyles.js.map +1 -1
- package/dist/Table/TableTypes.cjs.map +1 -1
- package/dist/Table/TableTypes.d.ts +0 -1
- package/dist/Table/TableTypes.js.map +1 -1
- package/dist/Tabs/HorizontalTabs.cjs +12 -10
- package/dist/Tabs/HorizontalTabs.cjs.map +1 -1
- package/dist/Tabs/HorizontalTabs.d.ts +1 -2
- package/dist/Tabs/HorizontalTabs.js +14 -13
- package/dist/Tabs/HorizontalTabs.js.map +1 -1
- package/dist/Tabs/TabLink.cjs +41 -17
- package/dist/Tabs/TabLink.cjs.map +1 -1
- package/dist/Tabs/TabLink.d.ts +14 -10
- package/dist/Tabs/TabLink.js +41 -17
- package/dist/Tabs/TabLink.js.map +1 -1
- package/dist/Tabs/VerticalTabs.cjs +2 -0
- package/dist/Tabs/VerticalTabs.cjs.map +1 -1
- package/dist/Tabs/VerticalTabs.d.ts +1 -0
- package/dist/Tabs/VerticalTabs.js +2 -0
- package/dist/Tabs/VerticalTabs.js.map +1 -1
- package/dist/Toggles/ToggleSwitch.cjs +1 -11
- package/dist/Toggles/ToggleSwitch.cjs.map +1 -1
- package/dist/Toggles/ToggleSwitch.js +2 -12
- package/dist/Toggles/ToggleSwitch.js.map +1 -1
- package/dist/Toggles/TogglerStyles.cjs +1 -1
- package/dist/Toggles/TogglerStyles.cjs.map +1 -1
- package/dist/Toggles/TogglerStyles.js +1 -1
- package/dist/Toggles/TogglerStyles.js.map +1 -1
- package/dist/Tooltips/TooltipOverflow.cjs +112 -0
- package/dist/Tooltips/TooltipOverflow.cjs.map +1 -0
- package/dist/Tooltips/TooltipOverflow.d.ts +10 -0
- package/dist/Tooltips/TooltipOverflow.js +102 -0
- package/dist/Tooltips/TooltipOverflow.js.map +1 -0
- package/dist/Tooltips/TooltipStyles.cjs +8 -5
- package/dist/Tooltips/TooltipStyles.cjs.map +1 -1
- package/dist/Tooltips/TooltipStyles.d.ts +3 -1
- package/dist/Tooltips/TooltipStyles.js +8 -5
- package/dist/Tooltips/TooltipStyles.js.map +1 -1
- package/dist/Tooltips/TooltipWrapper.cjs +2 -1
- package/dist/Tooltips/TooltipWrapper.cjs.map +1 -1
- package/dist/Tooltips/TooltipWrapper.js +2 -1
- package/dist/Tooltips/TooltipWrapper.js.map +1 -1
- package/dist/assets/index.cjs.map +1 -1
- package/dist/assets/index.js.map +1 -1
- package/dist/common/ActionWithin.cjs +1 -1
- package/dist/common/ActionWithin.js +1 -1
- package/dist/common/FocusVisible.cjs +1 -1
- package/dist/common/FocusVisible.js +1 -1
- package/dist/icons/index.cjs +1 -1
- package/dist/icons/index.cjs.map +1 -1
- package/dist/icons/index.js +1 -1
- package/dist/icons/index.js.map +1 -1
- package/dist/icons/systemicons/SystemIcons.cjs.map +1 -1
- package/dist/icons/systemicons/SystemIcons.js.map +1 -1
- package/package.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import {Size,
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../src/InputFields/types.ts"],"sourcesContent":["import { Size, Testable } from '../types';\nimport React from 'react';\n\nexport type TextFieldProps = {\n id: string;\n disabled?: boolean;\n readOnly?: boolean;\n onChange?: (text: string) => void;\n value?: string;\n validationMessage?: string;\n type?: string;\n state?: 'invalid' | 'valid';\n autoComplete?: string;\n placeholder?: string;\n required?: boolean;\n pattern?: string;\n maxLength?: number;\n withoutBorder?: boolean;\n size?: Size.Small | Size.Medium;\n margin?: string;\n note?: TextFieldNote;\n};\n\nexport type TextareaProps =\n Testable & Omit<React.TextareaHTMLAttributes<HTMLTextAreaElement>, 'value' | 'placeholder' | 'disabled' | 'required' | 'onChange'>\n & {\n id: string;\n placeholder: string;\n value?: string;\n disabled?: boolean;\n state?: 'invalid' | 'valid';\n onChange?: (text: string) => void;\n validationMessage?: string;\n size: Size.Small | Size.Medium;\n autoHeight?: boolean;\n margin?: string;\n note?: TextFieldNote;\n required: boolean;\n};\n\nexport type TextFieldNote = {\n message: string;\n icon: React.ReactNode;\n};\n\nexport interface CheckboxProps extends Testable, Omit<React.HTMLAttributes<HTMLDivElement>, 'onClick' | 'onKeyDown' | 'onMouseDown' | 'tabIndex'>{\n id?: string;\n selected: boolean;\n select?: (selected: boolean) => void;\n label?: string;\n invalid?: boolean;\n disabled?: boolean;\n margin?: string;\n size?: Size;\n iconPointerEventsTransparent?: boolean;\n semiSelected?: boolean;\n readOnly?: boolean;\n tabIndexVal?: number;\n className?: string;\n};"],"mappings":"AA2DC;AAAC"}
|
|
@@ -10,8 +10,8 @@ import React from 'react';
|
|
|
10
10
|
import { Size } from '../types';
|
|
11
11
|
import styled from 'styled-components';
|
|
12
12
|
import { COLORS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentTextStyle } from '../styles';
|
|
13
|
-
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
14
13
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
15
15
|
import { jsxs as _jsxs } from "react/jsx-runtime";
|
|
16
16
|
export var Bar = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n flex: 1;\n height: 6px;\n\n &.small {\n height: 6px;\n }\n\n &.medium {\n height: 8px;\n }\n\n &.large {\n height: 12px;\n }\n\n background-color: ", ";\n\n &.active {\n background-color: ", ";\n }\n\n &.current {\n background-color: ", ";\n }\n\n &.inverted {\n background-color: ", ";\n }\n\n &.inverted.active {\n background-color: ", ";\n }\n\n &.inverted.current {\n background-color: ", ";\n }\n\n"])), COLORS.neutral_100, COLORS.accent1_400, COLORS.accent1_800, COLORS.neutral_600, COLORS.accent1_400, COLORS.white);
|
|
17
17
|
export var Dot = styled.div(_templateObject2 || (_templateObject2 = _taggedTemplateLiteral(["\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n\n\n &:after {\n content: '';\n display: block;\n width: 6px;\n height: 6px;\n border-radius: 50%;\n background-color: ", ";\n }\n\n &.small {\n &:after {\n width: 6px;\n height: 6px;\n }\n\n &.current:after {\n width: 10px;\n height: 10px;\n }\n }\n\n &.medium {\n &:after {\n width: 8px;\n height: 8px;\n }\n\n &.current:after {\n width: 12px;\n height: 12px;\n }\n }\n\n &.large {\n &:after {\n width: 12px;\n height: 12px;\n }\n\n &.current:after {\n width: 16px;\n height: 16px;\n }\n }\n\n\n &.active:after {\n background-color: ", ";\n }\n\n &.current:after {\n background-color: ", ";\n }\n\n &.inverted:after {\n background-color: ", ";\n }\n\n &.inverted.active:after {\n background-color: ", ";\n }\n\n &.inverted.current:after {\n background-color: ", ";\n }\n"])), COLORS.neutral_400, COLORS.accent1_600, COLORS.accent1_800, COLORS.neutral_400, COLORS.accent1_400, COLORS.white);
|
package/dist/NavItem/NavItem.cjs
CHANGED
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports.default = void 0;
|
|
7
|
+
exports.default = exports.NavItemDiv = void 0;
|
|
8
8
|
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
|
|
9
9
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
|
|
10
10
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
@@ -19,6 +19,7 @@ var _templateObject;
|
|
|
19
19
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
20
20
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
21
21
|
var NavItemDiv = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n ", "\n\n margin: 0;\n padding: 0 21px 0 21px;\n height: 64px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 3px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.focus-visible {\n ", "\n }\n"])), (0, _typography.ComponentMStyling)(_typography.ComponentTextStyle.Regular, _styles.COLORS.neutral_600), _zIndexes.Z_INDEXES.active, _styles.COLORS.neutral_20, _styles.COLORS.neutral_800, _styles.COLORS.primary_600, _styles.COLORS.neutral_300, _styles.COLORS.neutral_100, _styles.COLORS.neutral_100, _zIndexes.Z_INDEXES.hover, _styles.COLORS.primary_20, _styles.COLORS.primary_700, _styles.COLORS.primary_600, _styles.focusStyles);
|
|
22
|
+
exports.NavItemDiv = NavItemDiv;
|
|
22
23
|
var NavItem = function NavItem(props) {
|
|
23
24
|
var focusVisibleRef = (0, _common.useFocusVisibleRef)();
|
|
24
25
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(NavItemDiv, _objectSpread(_objectSpread({}, props), {}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavItem.cjs","names":["NavItemDiv","styled","div","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","focusStyles","NavItem","props","focusVisibleRef","useFocusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n C extends string | React.ComponentType<any>,\n T extends object,\n O extends object,\n A extends keyof any,\n AsC extends string | React.ComponentType<any> = C,\n FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\
|
|
1
|
+
{"version":3,"file":"NavItem.cjs","names":["NavItemDiv","styled","div","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","Z_INDEXES","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","focusStyles","NavItem","props","focusVisibleRef","useFocusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n C extends string | React.ComponentType<any>,\n T extends object,\n O extends object,\n A extends keyof any,\n AsC extends string | React.ComponentType<any> = C,\n FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nexport const NavItemDiv = styled.div`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n margin: 0;\n padding: 0 21px 0 21px;\n height: 64px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 3px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n background-color: ${COLORS.neutral_20};\n color: ${COLORS.neutral_800};\n &:after {\n background-color: ${COLORS.primary_600};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n &:after {\n background-color: ${COLORS.neutral_100};\n }\n }\n\n &:hover:not(.disabled) {\n z-index: ${Z_INDEXES.hover};\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n &:after {\n background-color: ${COLORS.primary_600};\n }\n }\n\n &.focus-visible {\n ${focusStyles}\n }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n const focusVisibleRef = useFocusVisibleRef();\n return (\n <NavItemDiv {...props} ref={focusVisibleRef} />\n );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AAA+C;AAAA;AAAA;AAAA;AAYxC,IAAMA,UAAU,GAAGC,yBAAM,CAACC,GAAG,m4BAChC,IAAAC,6BAAiB,EAACC,8BAAkB,CAACC,OAAO,EAAEC,cAAM,CAACC,WAAW,CAAC,EAuBtDC,mBAAS,CAACC,MAAM,EACPH,cAAM,CAACI,UAAU,EAC5BJ,cAAM,CAACK,WAAW,EAELL,cAAM,CAACM,WAAW,EAK/BN,cAAM,CAACO,WAAW,EACPP,cAAM,CAACQ,WAAW,EAEhBR,cAAM,CAACQ,WAAW,EAK7BN,mBAAS,CAACO,KAAK,EACNT,cAAM,CAACU,UAAU,EAC5BV,cAAM,CAACW,WAAW,EAELX,cAAM,CAACM,WAAW,EAKtCM,mBAAW,CAEhB;AAAC;AAGF,IAAMC,OAAO,GAAG,SAAVA,OAAO,CAAIC,KAA8H,EAAK;EAClJ,IAAMC,eAAe,GAAG,IAAAC,0BAAkB,GAAE;EAC5C,oBACE,qBAAC,UAAU,kCAAKF,KAAK;IAAE,GAAG,EAAEC;EAAgB,GAAG;AAEnD,CAAC;AAAC,eAEaF,OAAO;AAAA"}
|
|
@@ -4,5 +4,6 @@ export type StyledComponentPropsWithAs<C extends string | React.ComponentType<an
|
|
|
4
4
|
as?: AsC | undefined;
|
|
5
5
|
forwardedAs?: FAsC | undefined;
|
|
6
6
|
};
|
|
7
|
+
export declare const NavItemDiv: import("styled-components").StyledComponent<"div", any, {}, never>;
|
|
7
8
|
declare const NavItem: (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, "div">) => JSX.Element;
|
|
8
9
|
export default NavItem;
|
package/dist/NavItem/NavItem.js
CHANGED
|
@@ -11,7 +11,7 @@ import { ComponentMStyling, ComponentTextStyle } from '../styles/typography';
|
|
|
11
11
|
import { Z_INDEXES } from '../styles/z-indexes';
|
|
12
12
|
import { useFocusVisibleRef } from '../common';
|
|
13
13
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
14
|
-
var NavItemDiv = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n\n margin: 0;\n padding: 0 21px 0 21px;\n height: 64px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 3px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.focus-visible {\n ", "\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), Z_INDEXES.active, COLORS.neutral_20, COLORS.neutral_800, COLORS.primary_600, COLORS.neutral_300, COLORS.neutral_100, COLORS.neutral_100, Z_INDEXES.hover, COLORS.primary_20, COLORS.primary_700, COLORS.primary_600, focusStyles);
|
|
14
|
+
export var NavItemDiv = styled.div(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n ", "\n\n margin: 0;\n padding: 0 21px 0 21px;\n height: 64px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 3px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.disabled {\n color: ", ";\n background-color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &:hover:not(.disabled) {\n z-index: ", ";\n background-color: ", ";\n color: ", ";\n &:after {\n background-color: ", ";\n }\n }\n\n &.focus-visible {\n ", "\n }\n"])), ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600), Z_INDEXES.active, COLORS.neutral_20, COLORS.neutral_800, COLORS.primary_600, COLORS.neutral_300, COLORS.neutral_100, COLORS.neutral_100, Z_INDEXES.hover, COLORS.primary_20, COLORS.primary_700, COLORS.primary_600, focusStyles);
|
|
15
15
|
var NavItem = function NavItem(props) {
|
|
16
16
|
var focusVisibleRef = useFocusVisibleRef();
|
|
17
17
|
return /*#__PURE__*/_jsx(NavItemDiv, _objectSpread(_objectSpread({}, props), {}, {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NavItem.js","names":["styled","React","COLORS","focusStyles","ComponentMStyling","ComponentTextStyle","Z_INDEXES","useFocusVisibleRef","NavItemDiv","div","Regular","neutral_600","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","NavItem","props","focusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n C extends string | React.ComponentType<any>,\n T extends object,\n O extends object,\n A extends keyof any,\n AsC extends string | React.ComponentType<any> = C,\n FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\
|
|
1
|
+
{"version":3,"file":"NavItem.js","names":["styled","React","COLORS","focusStyles","ComponentMStyling","ComponentTextStyle","Z_INDEXES","useFocusVisibleRef","NavItemDiv","div","Regular","neutral_600","active","neutral_20","neutral_800","primary_600","neutral_300","neutral_100","hover","primary_20","primary_700","NavItem","props","focusVisibleRef"],"sources":["../../src/NavItem/NavItem.tsx"],"sourcesContent":["import styled, { StyledComponentProps } from 'styled-components';\nimport React from 'react';\nimport {COLORS, focusStyles} from '../styles';\nimport { ComponentMStyling, ComponentTextStyle } from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useFocusVisibleRef } from '../common';\n\nexport type StyledComponentPropsWithAs<\n C extends string | React.ComponentType<any>,\n T extends object,\n O extends object,\n A extends keyof any,\n AsC extends string | React.ComponentType<any> = C,\n FAsC extends string | React.ComponentType<any> = C\n> = StyledComponentProps<C, T, O, A, FAsC> & { as?: AsC | undefined; forwardedAs?: FAsC | undefined };\n\n\nexport const NavItemDiv = styled.div`\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n margin: 0;\n padding: 0 21px 0 21px;\n height: 64px;\n\n display: flex;\n align-items: center;\n text-align: center;\n position: relative;\n\n &:after {\n content: '';\n display: block;\n position: absolute;\n bottom: 0;\n left: 0;\n right: 0;\n height: 3px;\n background-color: transparent;\n }\n\n &.active:not(.disabled) {\n z-index: ${Z_INDEXES.active};\n background-color: ${COLORS.neutral_20};\n color: ${COLORS.neutral_800};\n &:after {\n background-color: ${COLORS.primary_600};\n }\n }\n\n &.disabled {\n color: ${COLORS.neutral_300};\n background-color: ${COLORS.neutral_100};\n &:after {\n background-color: ${COLORS.neutral_100};\n }\n }\n\n &:hover:not(.disabled) {\n z-index: ${Z_INDEXES.hover};\n background-color: ${COLORS.primary_20};\n color: ${COLORS.primary_700};\n &:after {\n background-color: ${COLORS.primary_600};\n }\n }\n\n &.focus-visible {\n ${focusStyles}\n }\n`;\n\n\nconst NavItem = (props: StyledComponentPropsWithAs<string | React.ComponentType<any>, any, {}, never, string | React.ComponentType<any>, \"div\">) => {\n const focusVisibleRef = useFocusVisibleRef();\n return (\n <NavItemDiv {...props} ref={focusVisibleRef} />\n );\n};\n\nexport default NavItem;\n"],"mappings":";;;;;;AAAA,OAAOA,MAAM,MAAgC,mBAAmB;AAChE,OAAOC,KAAK,MAAM,OAAO;AACzB,SAAQC,MAAM,EAAEC,WAAW,QAAO,WAAW;AAC7C,SAASC,iBAAiB,EAAEC,kBAAkB,QAAQ,sBAAsB;AAC5E,SAAQC,SAAS,QAAO,qBAAqB;AAC7C,SAASC,kBAAkB,QAAQ,WAAW;AAAC;AAY/C,OAAO,IAAMC,UAAU,GAAGR,MAAM,CAACS,GAAG,q3BAChCL,iBAAiB,CAACC,kBAAkB,CAACK,OAAO,EAAER,MAAM,CAACS,WAAW,CAAC,EAuBtDL,SAAS,CAACM,MAAM,EACPV,MAAM,CAACW,UAAU,EAC5BX,MAAM,CAACY,WAAW,EAELZ,MAAM,CAACa,WAAW,EAK/Bb,MAAM,CAACc,WAAW,EACPd,MAAM,CAACe,WAAW,EAEhBf,MAAM,CAACe,WAAW,EAK7BX,SAAS,CAACY,KAAK,EACNhB,MAAM,CAACiB,UAAU,EAC5BjB,MAAM,CAACkB,WAAW,EAELlB,MAAM,CAACa,WAAW,EAKtCZ,WAAW,CAEhB;AAGD,IAAMkB,OAAO,GAAG,SAAVA,OAAO,CAAIC,KAA8H,EAAK;EAClJ,IAAMC,eAAe,GAAGhB,kBAAkB,EAAE;EAC5C,oBACE,KAAC,UAAU,kCAAKe,KAAK;IAAE,GAAG,EAAEC;EAAgB,GAAG;AAEnD,CAAC;AAED,eAAeF,OAAO"}
|
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
var _typeof = require("@babel/runtime/helpers/typeof");
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
+
var React = _interopRequireWildcard(require("react"));
|
|
12
|
+
var _types = require("../types");
|
|
13
|
+
var _jsxRuntime = require("react/jsx-runtime");
|
|
14
|
+
var _excluded = ["active", "item", "onClickHandler", "size", "className", "tabIndex", "iconRight", "id"];
|
|
15
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
16
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
17
|
+
var NestedNavItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
18
|
+
var active = _ref.active,
|
|
19
|
+
item = _ref.item,
|
|
20
|
+
onClickHandler = _ref.onClickHandler,
|
|
21
|
+
_ref$size = _ref.size,
|
|
22
|
+
size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
|
|
23
|
+
className = _ref.className,
|
|
24
|
+
tabIndex = _ref.tabIndex,
|
|
25
|
+
iconRight = _ref.iconRight,
|
|
26
|
+
id = _ref.id,
|
|
27
|
+
rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
|
|
28
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {});
|
|
29
|
+
});
|
|
30
|
+
NestedNavItem.propTypes = {
|
|
31
|
+
onClickHandler: _propTypes.default.func.isRequired,
|
|
32
|
+
active: _propTypes.default.bool.isRequired,
|
|
33
|
+
id: _propTypes.default.string.isRequired,
|
|
34
|
+
iconRight: _propTypes.default.element
|
|
35
|
+
};
|
|
36
|
+
var _default = NestedNavItem;
|
|
37
|
+
exports.default = _default;
|
|
38
|
+
//# sourceMappingURL=NestedNavItem.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedNavItem.cjs","names":["NestedNavItem","React","forwardRef","ref","active","item","onClickHandler","size","Size","Medium","className","tabIndex","iconRight","id","rest"],"sources":["../../src/NavItem/NestedNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport {Link} from 'react-router-dom';\nimport styled, { css } from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronRight, LockedOn} from '../icons/systemicons/SystemIcons';\nimport {Product, Size} from '../types';\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling} from '../styles/typography';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport {CommonInteractionStyling, defaultOnMouseDownHandler} from '../common';\n\nexport interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {\n item: DropdownItem;\n onClickHandler: (e: React.MouseEvent) => void;\n active: boolean;\n id: string;\n size?: Size;\n iconRight?: React.ReactElement;\n}\n\n\nconst NestedNavItem = React.forwardRef<HTMLButtonElement, MenuItemProps>(({\n active,\n item,\n onClickHandler,\n size = Size.Medium,\n className,\n tabIndex,\n iconRight,\n id,\n ...rest\n }: MenuItemProps, ref) => {\n return (\n <></>\n );\n});\n\nexport default NestedNavItem;\n"],"mappings":";;;;;;;;;;AAAA;AAKA;AAAuC;AAAA;AAAA;AAAA;AAevC,IAAMA,aAAa,gBAAGC,KAAK,CAACC,UAAU,CAAmC,gBAUcC,GAAG,EAAK;EAAA,IATxBC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACJC,cAAc,QAAdA,cAAc;IAAA,iBACdC,IAAI;IAAJA,IAAI,0BAAGC,WAAI,CAACC,MAAM;IAClBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACTC,EAAE,QAAFA,EAAE;IACCC,IAAI;EAE5E,oBACC,8CAAK;AAER,CAAC,CAAC;AAAC;EAtBAR,cAAc;EACdF,MAAM;EACNS,EAAE;EAEFD,SAAS;AAAA;AAAA,eAoBGZ,aAAa;AAAA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { Size } from '../types';
|
|
3
|
+
import { DropdownItem } from '../Dropdown/DropdownContent';
|
|
4
|
+
export interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {
|
|
5
|
+
item: DropdownItem;
|
|
6
|
+
onClickHandler: (e: React.MouseEvent) => void;
|
|
7
|
+
active: boolean;
|
|
8
|
+
id: string;
|
|
9
|
+
size?: Size;
|
|
10
|
+
iconRight?: React.ReactElement;
|
|
11
|
+
}
|
|
12
|
+
declare const NestedNavItem: React.ForwardRefExoticComponent<MenuItemProps & React.RefAttributes<HTMLButtonElement>>;
|
|
13
|
+
export default NestedNavItem;
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
|
|
2
|
+
import _pt from "prop-types";
|
|
3
|
+
var _excluded = ["active", "item", "onClickHandler", "size", "className", "tabIndex", "iconRight", "id"];
|
|
4
|
+
import * as React from 'react';
|
|
5
|
+
import { Size } from '../types';
|
|
6
|
+
import { Fragment as _Fragment } from "react/jsx-runtime";
|
|
7
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
8
|
+
var NestedNavItem = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
9
|
+
var active = _ref.active,
|
|
10
|
+
item = _ref.item,
|
|
11
|
+
onClickHandler = _ref.onClickHandler,
|
|
12
|
+
_ref$size = _ref.size,
|
|
13
|
+
size = _ref$size === void 0 ? Size.Medium : _ref$size,
|
|
14
|
+
className = _ref.className,
|
|
15
|
+
tabIndex = _ref.tabIndex,
|
|
16
|
+
iconRight = _ref.iconRight,
|
|
17
|
+
id = _ref.id,
|
|
18
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
19
|
+
return /*#__PURE__*/_jsx(_Fragment, {});
|
|
20
|
+
});
|
|
21
|
+
NestedNavItem.propTypes = {
|
|
22
|
+
onClickHandler: _pt.func.isRequired,
|
|
23
|
+
active: _pt.bool.isRequired,
|
|
24
|
+
id: _pt.string.isRequired,
|
|
25
|
+
iconRight: _pt.element
|
|
26
|
+
};
|
|
27
|
+
export default NestedNavItem;
|
|
28
|
+
//# sourceMappingURL=NestedNavItem.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NestedNavItem.js","names":["React","Size","NestedNavItem","forwardRef","ref","active","item","onClickHandler","size","Medium","className","tabIndex","iconRight","id","rest"],"sources":["../../src/NavItem/NestedNavItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport {Link} from 'react-router-dom';\nimport styled, { css } from 'styled-components';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronRight, LockedOn} from '../icons/systemicons/SystemIcons';\nimport {Product, Size} from '../types';\nimport {ComponentLStyling, ComponentMStyling, ComponentSStyling} from '../styles/typography';\nimport { DropdownItem } from '../Dropdown/DropdownContent';\nimport {CommonInteractionStyling, defaultOnMouseDownHandler} from '../common';\n\nexport interface MenuItemProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'id' | 'disabled' | 'onMouseDown' | 'onClick'> {\n item: DropdownItem;\n onClickHandler: (e: React.MouseEvent) => void;\n active: boolean;\n id: string;\n size?: Size;\n iconRight?: React.ReactElement;\n}\n\n\nconst NestedNavItem = React.forwardRef<HTMLButtonElement, MenuItemProps>(({\n active,\n item,\n onClickHandler,\n size = Size.Medium,\n className,\n tabIndex,\n iconRight,\n id,\n ...rest\n }: MenuItemProps, ref) => {\n return (\n <></>\n );\n});\n\nexport default NestedNavItem;\n"],"mappings":";;;AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAK9B,SAAiBC,IAAI,QAAO,UAAU;AAAC;AAAA;AAevC,IAAMC,aAAa,gBAAGF,KAAK,CAACG,UAAU,CAAmC,gBAUcC,GAAG,EAAK;EAAA,IATxBC,MAAM,QAANA,MAAM;IACNC,IAAI,QAAJA,IAAI;IACJC,cAAc,QAAdA,cAAc;IAAA,iBACdC,IAAI;IAAJA,IAAI,0BAAGP,IAAI,CAACQ,MAAM;IAClBC,SAAS,QAATA,SAAS;IACTC,QAAQ,QAARA,QAAQ;IACRC,SAAS,QAATA,SAAS;IACTC,EAAE,QAAFA,EAAE;IACCC,IAAI;EAE5E,oBACC,mBAAK;AAER,CAAC,CAAC;AAAC;EAtBAP,cAAc;EACdF,MAAM;EACNQ,EAAE;EAEFD,SAAS;AAAA;AAoBZ,eAAeV,aAAa"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Paginator.cjs","names":["Container","styled","nav","BREAKPOINTS","MEDIUM","Items","ul","Item","li","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","focusStyles","Z_INDEXES","hover","primary_800","primary_20","active","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","primary_500","Step","up","target","disabled","page","onPageChange","id","navigateHook","useNavigate","handleButtonClick","event","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"sources":["../../src/Paginator/Paginator.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useNavigate } from 'react-router';\nimport {IconButton} from '../Button';\n\nconst Container = styled.nav`\n margin: 20px 0;\n display: flex;\n justify-content: center;\n\n ${BREAKPOINTS.MEDIUM} {\n width: 75%;\n }\n`;\n\nconst Items = styled.ul`\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n`;\n\nconst Item = styled.li`\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > * {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n text-decoration: none;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n &:focus,\n &:focus-within {\n ${focusStyles}\n }\n }\n & > a:hover {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n & > a:active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n & > a.active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.neutral_800};\n background-color: ${COLORS.neutral_20};\n cursor: default;\n &:hover {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n &:active {\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n }\n`;\n\nconst Dots = styled(Item)`\n cursor: not-allowed;\n &:after{\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n content: '...';\n }\n`;\n\nconst ItemContent = styled('div')`\n text-align:center;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n width: 100%;\n height: 100%;\n \n &.active:after{\n content: '';\n position: absolute;\n bottom: 4px;\n width: 32px;\n border-radius: 4px;\n height: 4px;\n background-color: ${COLORS.primary_500}\n }\n &.active:hover:after{\n background-color: ${COLORS.primary_700}\n }\n &.active:active:after{\n background-color: ${COLORS.primary_800}\n }\n`\n\ntype PaginatorProps = {\n pageCount: number;\n currentPage: number;\n baseUrl: string;\n onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n up = true,\n target = '',\n disabled = false,\n page,\n onPageChange,\n id,\n}: {\n up: boolean;\n target: string;\n disabled: boolean;\n page: number;\n onPageChange?: (page: number) => void;\n id?: string;\n}) => {\n const navigateHook = useNavigate();\n\n const handleButtonClick = () => {\n navigateHook(target);\n onPageChange && onPageChange(page);\n }\n\n return (\n <IconButton id={id}\n action={event => handleButtonClick()}\n variant={'secondary'}\n shape={'circular'}\n disabled={disabled}>\n {up ? <ChevronRight/> : <ChevronLeft/>}\n </IconButton>\n )\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n const pages = [];\n let from = 2;\n let to = 4;\n if (pageCount === 0) return null;\n\n if (pageCount > 1) {\n if (currentPage >= 4 && currentPage <= pageCount - 2) {\n from = currentPage - 1;\n to = currentPage + 1;\n } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n from = pageCount - 3;\n to = pageCount - 1;\n }\n if (to > pageCount) {\n to = pageCount;\n }\n for (let i = from; i <= to; i += 1) {\n pages.push(i);\n }\n }\n\n return (\n <Container>\n <Items>\n <Step up={false}\n target={`${baseUrl}/${currentPage - 1}`}\n page={currentPage - 1}\n disabled={currentPage === 1}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage - 1);\n }}\n id=\"paginator-left\"/>\n {pages.findIndex(item => item === 1) === -1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/1`}\n onClick={() => {\n if (onPageChange) onPageChange(1);\n }}>\n <ItemContent className={currentPage === 1 ? 'active' : ''}>\n <span>1</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n <Dots/>\n )}\n {pages.map(page => (\n <Item key={page}>\n <NavLink\n to={`${baseUrl}/${page}`}\n onClick={() => {\n if (onPageChange) onPageChange(page);\n }}>\n <ItemContent className={currentPage === page ? 'active' : ''}>\n <span>{page}</span>\n </ItemContent>\n </NavLink>\n </Item>\n ))}\n {pageCount > 5 && currentPage <= pageCount - 3 && (\n <Dots/>\n )}\n {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/${pageCount}`}\n onClick={() => {\n if (onPageChange) onPageChange(pageCount);\n }}>\n <ItemContent className={currentPage === pageCount ? 'active' : ''}>\n <span>{pageCount}</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n <Step up\n target={`${baseUrl}/${currentPage + 1}`}\n page={currentPage + 1}\n disabled={currentPage === pageCount}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage + 1);\n }}\n id=\"paginator-right\"/>\n </Items>\n </Container>\n );\n};\n\nexport default Paginator;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Paginator.cjs","names":["Container","styled","nav","BREAKPOINTS","MEDIUM","Items","ul","Item","li","ComponentMStyling","ComponentTextStyle","Regular","COLORS","neutral_600","focusStyles","Z_INDEXES","hover","primary_800","primary_20","active","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","primary_500","Step","up","target","disabled","page","onPageChange","id","navigateHook","useNavigate","handleButtonClick","event","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"sources":["../../src/Paginator/Paginator.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useNavigate } from 'react-router';\nimport {IconButton} from '../Button';\n\nconst Container = styled.nav`\n margin: 20px 0;\n display: flex;\n justify-content: center;\n\n ${BREAKPOINTS.MEDIUM} {\n width: 75%;\n }\n`;\n\nconst Items = styled.ul`\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n`;\n\nconst Item = styled.li`\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > * {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n text-decoration: none;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n &:focus,\n &:focus-within {\n ${focusStyles}\n }\n }\n & > a:hover {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n & > a:active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n & > a.active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.neutral_800};\n background-color: ${COLORS.neutral_20};\n cursor: default;\n &:hover {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n &:active {\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n }\n`;\n\nconst Dots = styled(Item)`\n cursor: not-allowed;\n &:after{\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n content: '...';\n }\n`;\n\nconst ItemContent = styled('div')`\n text-align:center;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n width: 100%;\n height: 100%;\n \n &.active:after{\n content: '';\n position: absolute;\n bottom: 4px;\n width: 32px;\n border-radius: 4px;\n height: 4px;\n background-color: ${COLORS.primary_500}\n }\n &.active:hover:after{\n background-color: ${COLORS.primary_700}\n }\n &.active:active:after{\n background-color: ${COLORS.primary_800}\n }\n`\n\ntype PaginatorProps = {\n pageCount: number;\n currentPage: number;\n baseUrl: string;\n onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n up = true,\n target = '',\n disabled = false,\n page,\n onPageChange,\n id,\n}: {\n up: boolean;\n target: string;\n disabled: boolean;\n page: number;\n onPageChange?: (page: number) => void;\n id?: string;\n}) => {\n const navigateHook = useNavigate();\n\n const handleButtonClick = () => {\n navigateHook(target);\n onPageChange && onPageChange(page);\n }\n\n return (\n <IconButton id={id}\n action={event => handleButtonClick()}\n variant={'secondary'}\n shape={'circular'}\n disabled={disabled}>\n {up ? <ChevronRight/> : <ChevronLeft/>}\n </IconButton>\n )\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n const pages = [];\n let from = 2;\n let to = 4;\n if (pageCount === 0) return null;\n\n if (pageCount > 1) {\n if (currentPage >= 4 && currentPage <= pageCount - 2) {\n from = currentPage - 1;\n to = currentPage + 1;\n } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n from = pageCount - 3;\n to = pageCount - 1;\n }\n if (to > pageCount) {\n to = pageCount;\n }\n for (let i = from; i <= to; i += 1) {\n pages.push(i);\n }\n }\n\n return (\n <Container>\n <Items>\n <Step up={false}\n target={`${baseUrl}/${currentPage - 1}`}\n page={currentPage - 1}\n disabled={currentPage === 1}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage - 1);\n }}\n id=\"paginator-left\"/>\n {pages.findIndex(item => item === 1) === -1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/1`}\n onClick={() => {\n if (onPageChange) onPageChange(1);\n }}>\n <ItemContent className={currentPage === 1 ? 'active' : ''}>\n <span>1</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n <Dots/>\n )}\n {pages.map(page => (\n <Item key={page}>\n <NavLink\n to={`${baseUrl}/${page}`}\n onClick={() => {\n if (onPageChange) onPageChange(page);\n }}>\n <ItemContent className={currentPage === page ? 'active' : ''}>\n <span>{page}</span>\n </ItemContent>\n </NavLink>\n </Item>\n ))}\n {pageCount > 5 && currentPage <= pageCount - 3 && (\n <Dots/>\n )}\n {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/${pageCount}`}\n onClick={() => {\n if (onPageChange) onPageChange(pageCount);\n }}>\n <ItemContent className={currentPage === pageCount ? 'active' : ''}>\n <span>{pageCount}</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n <Step up\n target={`${baseUrl}/${currentPage + 1}`}\n page={currentPage + 1}\n disabled={currentPage === pageCount}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage + 1);\n }}\n id=\"paginator-right\"/>\n </Items>\n </Container>\n );\n};\n\nexport default Paginator;\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Paginator.js","names":["React","styled","NavLink","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ChevronLeft","ChevronRight","ComponentMStyling","Z_INDEXES","useNavigate","IconButton","Container","nav","MEDIUM","Items","ul","Item","li","Regular","neutral_600","hover","primary_800","primary_20","active","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","primary_500","Step","up","target","disabled","page","onPageChange","id","navigateHook","handleButtonClick","event","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"sources":["../../src/Paginator/Paginator.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useNavigate } from 'react-router';\nimport {IconButton} from '../Button';\n\nconst Container = styled.nav`\n margin: 20px 0;\n display: flex;\n justify-content: center;\n\n ${BREAKPOINTS.MEDIUM} {\n width: 75%;\n }\n`;\n\nconst Items = styled.ul`\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n`;\n\nconst Item = styled.li`\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > * {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n text-decoration: none;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n &:focus,\n &:focus-within {\n ${focusStyles}\n }\n }\n & > a:hover {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n & > a:active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n & > a.active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.neutral_800};\n background-color: ${COLORS.neutral_20};\n cursor: default;\n &:hover {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n &:active {\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n }\n`;\n\nconst Dots = styled(Item)`\n cursor: not-allowed;\n &:after{\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n content: '...';\n }\n`;\n\nconst ItemContent = styled('div')`\n text-align:center;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n width: 100%;\n height: 100%;\n \n &.active:after{\n content: '';\n position: absolute;\n bottom: 4px;\n width: 32px;\n border-radius: 4px;\n height: 4px;\n background-color: ${COLORS.primary_500}\n }\n &.active:hover:after{\n background-color: ${COLORS.primary_700}\n }\n &.active:active:after{\n background-color: ${COLORS.primary_800}\n }\n`\n\ntype PaginatorProps = {\n pageCount: number;\n currentPage: number;\n baseUrl: string;\n onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n up = true,\n target = '',\n disabled = false,\n page,\n onPageChange,\n id,\n}: {\n up: boolean;\n target: string;\n disabled: boolean;\n page: number;\n onPageChange?: (page: number) => void;\n id?: string;\n}) => {\n const navigateHook = useNavigate();\n\n const handleButtonClick = () => {\n navigateHook(target);\n onPageChange && onPageChange(page);\n }\n\n return (\n <IconButton id={id}\n action={event => handleButtonClick()}\n variant={'secondary'}\n shape={'circular'}\n disabled={disabled}>\n {up ? <ChevronRight/> : <ChevronLeft/>}\n </IconButton>\n )\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n const pages = [];\n let from = 2;\n let to = 4;\n if (pageCount === 0) return null;\n\n if (pageCount > 1) {\n if (currentPage >= 4 && currentPage <= pageCount - 2) {\n from = currentPage - 1;\n to = currentPage + 1;\n } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n from = pageCount - 3;\n to = pageCount - 1;\n }\n if (to > pageCount) {\n to = pageCount;\n }\n for (let i = from; i <= to; i += 1) {\n pages.push(i);\n }\n }\n\n return (\n <Container>\n <Items>\n <Step up={false}\n target={`${baseUrl}/${currentPage - 1}`}\n page={currentPage - 1}\n disabled={currentPage === 1}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage - 1);\n }}\n id=\"paginator-left\"/>\n {pages.findIndex(item => item === 1) === -1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/1`}\n onClick={() => {\n if (onPageChange) onPageChange(1);\n }}>\n <ItemContent className={currentPage === 1 ? 'active' : ''}>\n <span>1</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n <Dots/>\n )}\n {pages.map(page => (\n <Item key={page}>\n <NavLink\n to={`${baseUrl}/${page}`}\n onClick={() => {\n if (onPageChange) onPageChange(page);\n }}>\n <ItemContent className={currentPage === page ? 'active' : ''}>\n <span>{page}</span>\n </ItemContent>\n </NavLink>\n </Item>\n ))}\n {pageCount > 5 && currentPage <= pageCount - 3 && (\n <Dots/>\n )}\n {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/${pageCount}`}\n onClick={() => {\n if (onPageChange) onPageChange(pageCount);\n }}>\n <ItemContent className={currentPage === pageCount ? 'active' : ''}>\n <span>{pageCount}</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n <Step up\n target={`${baseUrl}/${currentPage + 1}`}\n page={currentPage + 1}\n disabled={currentPage === pageCount}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage + 1);\n }}\n id=\"paginator-right\"/>\n </Items>\n </Container>\n );\n};\n\nexport default Paginator;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Paginator.js","names":["React","styled","NavLink","BREAKPOINTS","COLORS","ComponentTextStyle","focusStyles","ChevronLeft","ChevronRight","ComponentMStyling","Z_INDEXES","useNavigate","IconButton","Container","nav","MEDIUM","Items","ul","Item","li","Regular","neutral_600","hover","primary_800","primary_20","active","primary_700","primary_100","neutral_800","neutral_20","Dots","ItemContent","primary_500","Step","up","target","disabled","page","onPageChange","id","navigateHook","handleButtonClick","event","Paginator","pageCount","currentPage","baseUrl","pages","from","to","i","push","findIndex","item","map"],"sources":["../../src/Paginator/Paginator.tsx"],"sourcesContent":["import * as React from 'react';\nimport styled from 'styled-components';\nimport {NavLink} from 'react-router-dom';\nimport {BREAKPOINTS, COLORS, ComponentTextStyle, focusStyles} from '../styles';\nimport {ChevronLeft, ChevronRight} from '../icons/systemicons/SystemIcons';\nimport {ComponentMStyling} from '../styles/typography';\nimport {Z_INDEXES} from '../styles/z-indexes';\nimport { useNavigate } from 'react-router';\nimport {IconButton} from '../Button';\n\nconst Container = styled.nav`\n margin: 20px 0;\n display: flex;\n justify-content: center;\n\n ${BREAKPOINTS.MEDIUM} {\n width: 75%;\n }\n`;\n\nconst Items = styled.ul`\n margin: 0;\n padding: 0;\n list-style: none;\n display: flex;\n`;\n\nconst Item = styled.li`\n width: 48px;\n height: 48px;\n display: flex;\n align-items: center;\n justify-content: center;\n\n & > * {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 100%;\n height: 100%;\n text-decoration: none;\n\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n\n &:focus,\n &:focus-within {\n ${focusStyles}\n }\n }\n & > a:hover {\n z-index: ${Z_INDEXES.hover};\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n & > a:active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n & > a.active {\n z-index: ${Z_INDEXES.active};\n color: ${COLORS.neutral_800};\n background-color: ${COLORS.neutral_20};\n cursor: default;\n &:hover {\n color: ${COLORS.primary_800};\n background-color: ${COLORS.primary_20};\n }\n &:active {\n color: ${COLORS.primary_700};\n background-color: ${COLORS.primary_100};\n }\n }\n`;\n\nconst Dots = styled(Item)`\n cursor: not-allowed;\n &:after{\n ${ComponentMStyling(ComponentTextStyle.Regular, COLORS.neutral_600)}\n content: '...';\n }\n`;\n\nconst ItemContent = styled('div')`\n text-align:center;\n display: flex;\n justify-content: center;\n align-items: center;\n position: relative;\n width: 100%;\n height: 100%;\n \n &.active:after{\n content: '';\n position: absolute;\n bottom: 4px;\n width: 32px;\n border-radius: 4px;\n height: 4px;\n background-color: ${COLORS.primary_500}\n }\n &.active:hover:after{\n background-color: ${COLORS.primary_700}\n }\n &.active:active:after{\n background-color: ${COLORS.primary_800}\n }\n`\n\ntype PaginatorProps = {\n pageCount: number;\n currentPage: number;\n baseUrl: string;\n onPageChange?: (page: number) => void;\n};\n\nconst Step = ({\n up = true,\n target = '',\n disabled = false,\n page,\n onPageChange,\n id,\n}: {\n up: boolean;\n target: string;\n disabled: boolean;\n page: number;\n onPageChange?: (page: number) => void;\n id?: string;\n}) => {\n const navigateHook = useNavigate();\n\n const handleButtonClick = () => {\n navigateHook(target);\n onPageChange && onPageChange(page);\n }\n\n return (\n <IconButton id={id}\n action={event => handleButtonClick()}\n variant={'secondary'}\n shape={'circular'}\n disabled={disabled}>\n {up ? <ChevronRight/> : <ChevronLeft/>}\n </IconButton>\n )\n};\n\nconst Paginator = ({ pageCount = 1, currentPage = 1, baseUrl = '', onPageChange }: PaginatorProps) => {\n const pages = [];\n let from = 2;\n let to = 4;\n if (pageCount === 0) return null;\n\n if (pageCount > 1) {\n if (currentPage >= 4 && currentPage <= pageCount - 2) {\n from = currentPage - 1;\n to = currentPage + 1;\n } else if (pageCount - 2 > 1 && currentPage > pageCount - 2) {\n from = pageCount - 3;\n to = pageCount - 1;\n }\n if (to > pageCount) {\n to = pageCount;\n }\n for (let i = from; i <= to; i += 1) {\n pages.push(i);\n }\n }\n\n return (\n <Container>\n <Items>\n <Step up={false}\n target={`${baseUrl}/${currentPage - 1}`}\n page={currentPage - 1}\n disabled={currentPage === 1}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage - 1);\n }}\n id=\"paginator-left\"/>\n {pages.findIndex(item => item === 1) === -1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/1`}\n onClick={() => {\n if (onPageChange) onPageChange(1);\n }}>\n <ItemContent className={currentPage === 1 ? 'active' : ''}>\n <span>1</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n {currentPage >= 4 && pageCount > 5 && pageCount && pages.findIndex(item => item === 1) === -1 && (\n <Dots/>\n )}\n {pages.map(page => (\n <Item key={page}>\n <NavLink\n to={`${baseUrl}/${page}`}\n onClick={() => {\n if (onPageChange) onPageChange(page);\n }}>\n <ItemContent className={currentPage === page ? 'active' : ''}>\n <span>{page}</span>\n </ItemContent>\n </NavLink>\n </Item>\n ))}\n {pageCount > 5 && currentPage <= pageCount - 3 && (\n <Dots/>\n )}\n {pages.findIndex(item => item === pageCount) === -1 && pageCount !== 1 && (\n <Item>\n <NavLink\n to={`${baseUrl}/${pageCount}`}\n onClick={() => {\n if (onPageChange) onPageChange(pageCount);\n }}>\n <ItemContent className={currentPage === pageCount ? 'active' : ''}>\n <span>{pageCount}</span>\n </ItemContent>\n </NavLink>\n </Item>\n )}\n <Step up\n target={`${baseUrl}/${currentPage + 1}`}\n page={currentPage + 1}\n disabled={currentPage === pageCount}\n onPageChange={() => {\n if (onPageChange) onPageChange(currentPage + 1);\n }}\n id=\"paginator-right\"/>\n </Items>\n </Container>\n );\n};\n\nexport default Paginator;\n"],"mappings":"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"}
|
package/dist/Table/Table.cjs
CHANGED
|
@@ -23,7 +23,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
23
23
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
24
24
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
25
25
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
26
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
26
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
27
27
|
var Table = function Table(props) {
|
|
28
28
|
var onPreviousPageClick = props.onPreviousPageClick,
|
|
29
29
|
onNextPageClick = props.onNextPageClick,
|
|
@@ -348,7 +348,6 @@ var Table = function Table(props) {
|
|
|
348
348
|
* Return Table component.
|
|
349
349
|
*/
|
|
350
350
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_TableStyles.TableWrapper, {
|
|
351
|
-
className: props.border ? 'border' : undefined,
|
|
352
351
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_TableHeaders.default, _objectSpread({}, props)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_TableBody.default, _objectSpread(_objectSpread({}, props), {}, {
|
|
353
352
|
currentPageRows: currentPageRows,
|
|
354
353
|
selected: selected,
|
package/dist/Table/Table.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Table.cjs","names":["Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","border","Size","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper className={props.border ? 'border' : undefined}>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Table.cjs","names":["Table","props","onPreviousPageClick","onNextPageClick","onRowsPerPageChange","onTriggerSortingChange","columns","rows","remoteOperations","pagination","showLoadingIndicator","selectable","multiSelect","keyExpr","sortProps","accordion","collapsed","collapsedRows","rowsPerPageLabel","React","useState","rowsPerPage","setRowsPerPage","filteredRows","setFilteredRows","currentPageRows","setCurrentPageRows","currentPage","setCurrentPage","sort","setSort","from","setFrom","to","setTo","total","setTotal","isCollapsed","setIsCollapsed","selectAllState","setSelectAllState","undefined","selected","setSelected","useEffect","selectedRows","currentList","map","row","count","filter","item","includes","length","filterAndSortRows","tmpFilteredRows","matchFilterCriteria","column","filterValue","key","toLowerCase","indexOf","direction","a","b","rowsFrom","rowsTo","slice","sortTableColumn","columnKey","sortDirection","previousPage","nextPage","changeRowsPerPage","value","onRowClick","selectedText","window","getSelection","toString","currentSelection","existing","splice","onSelectionChange","onSelectAllClick","Size","Medium"],"sources":["../../src/Table/Table.tsx"],"sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {Size} from '../types'\n\n/**\n * Import custom styles.\n */\nimport {StyledTable, StyledTableSpinner, TableWrapper} from './TableStyles';\n\n/**\n * Import custom types.\n */\nimport {TableProps, TableColumn, TableSortingDirection, TableSortProps} from './TableTypes';\nimport {LoadingIndicator} from '../LoadingIndicator';\nimport TableHeader from './TableHeaders';\nimport TableFooter from './TableFooter';\nimport TableBody from './TableBody';\n\nconst Table: React.FunctionComponent<TableProps> = (props: TableProps) => {\n let {\n onPreviousPageClick,\n onNextPageClick,\n onRowsPerPageChange,\n onTriggerSortingChange,\n columns,\n rows,\n remoteOperations,\n pagination,\n showLoadingIndicator,\n selectable,\n multiSelect,\n keyExpr,\n sortProps,\n accordion,\n collapsed = true,\n collapsedRows,\n rowsPerPageLabel\n } = props;\n\n // States used within the component\n const [rowsPerPage, setRowsPerPage] = React.useState<number>(10);\n const [filteredRows, setFilteredRows] = React.useState<any[]>([]);\n const [currentPageRows, setCurrentPageRows] = React.useState<any[]>([]);\n const [currentPage, setCurrentPage] = React.useState<number>(1);\n const [sort, setSort] = React.useState<TableSortProps | undefined>(sortProps);\n const [from, setFrom] = React.useState<number>();\n const [to, setTo] = React.useState<number>();\n const [total, setTotal] = React.useState<number>();\n\n const [isCollapsed, setIsCollapsed] = React.useState(true);\n\n const [selectAllState, setSelectAllState] = React.useState<'all' | 'some' | 'none'>('none');\n\n const [selected, setSelected] = React.useState<any | any[]>(multiSelect ? [] : undefined);\n\n React.useEffect(() => {\n setSort(sortProps);\n }, [sortProps])\n\n React.useEffect(() => {\n setSelected(props.selectedRows || (multiSelect ? [] : undefined))\n }, [props.selectedRows, multiSelect])\n\n /**\n * update select all checkbox state\n */\n React.useEffect(() => {\n if (multiSelect) {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n const count = selected.filter((item: any) => currentList.includes(item)).length;\n\n setSelectAllState(count === currentList.length ? 'all' : count > 0 ? 'some' : 'none');\n }\n }, [currentPageRows, multiSelect, selected, keyExpr])\n\n /**\n * Takes care of remote pagination.\n * Works only in case remote pagination is set to true.\n */\n React.useEffect(() => {\n if (remoteOperations) {\n setCurrentPageRows(rows);\n\n // Let's assign pagination values\n setFrom(pagination?.from);\n setTo(pagination?.to);\n setTotal(pagination?.total);\n setCurrentPage(pagination?.currentPage!);\n setRowsPerPage(pagination?.rowsPerPage!);\n }\n }, [remoteOperations, pagination, rows]);\n\n /**\n * Sets number of rows to display when accordion.\n */\n React.useEffect(() => {\n if (!accordion) return;\n\n setRowsPerPage(isCollapsed ? collapsedRows || 10 : rows.length);\n }, [rows, accordion, collapsedRows, isCollapsed])\n\n React.useEffect(() => {\n if (!accordion) return;\n\n setIsCollapsed(!!collapsed);\n }, [accordion, collapsed])\n\n /**\n * Filters out a rows by specific column filters and sorts them if any sorting is set.\n * @returns Filtered and sorted rows.\n */\n const filterAndSortRows = (): any[] => {\n let tmpFilteredRows = rows.filter((row) => {\n // Let's start with matched filter criteria\n let matchFilterCriteria = true;\n\n // Let's go through columns\n for (const column of columns) {\n // Let's check if filter value is specified for the column\n // And if it doesn't match the current row column value\n // Then let's update match filter criteria to failed\n if (column.filterValue && row[column.key].toLowerCase().indexOf(column.filterValue.toLowerCase()) === -1) {\n matchFilterCriteria = false;\n }\n }\n\n // Let's return row only in case match filter criteria succeeds\n if (matchFilterCriteria) {\n return row;\n }\n });\n\n // Let's apply sorting if needed\n if (!!sort?.column && !!sort?.direction) {\n // Let's sort the rows\n tmpFilteredRows.sort((a, b) => {\n if (a[sort.column!] > b[sort.column!]) {\n return sort.direction! === 'asc' ? 1 : -1;\n } else if (a[sort.column!] < b[sort.column!]) {\n return sort.direction! === 'asc' ? -1 : 1;\n } else {\n return 0;\n }\n });\n }\n\n // Let's return filtered rows\n return tmpFilteredRows;\n };\n\n /**\n * Takes care of local pagination.\n * Works only in case remote pagination is not defined or is set to false.\n */\n React.useEffect(() => {\n if (!remoteOperations) {\n // Let's retrieve temporary filtered rows and update globally filtered rows\n const tmpFilteredRows = filterAndSortRows();\n setFilteredRows(tmpFilteredRows);\n setTotal(tmpFilteredRows.length);\n\n // Assign rows from and rows to\n const rowsFrom = (currentPage - 1) * rowsPerPage;\n const rowsTo = rowsFrom + rowsPerPage >= tmpFilteredRows.length ? tmpFilteredRows.length : rowsFrom + rowsPerPage;\n\n // Set from and to values\n setFrom(rowsFrom + 1);\n setTo(rowsTo);\n\n // Filter out the rows\n setCurrentPageRows(tmpFilteredRows.slice(rowsFrom, rowsTo));\n }\n }, [rowsPerPage, rows, currentPage, columns, sort, remoteOperations]);\n\n\n /**\n * Applies a specific sorting to a column.\n * If no sorting exists, then applies ascending initially\n * @param column - Column to which sorting should be applied.\n */\n const sortTableColumn = (column: TableColumn): void => {\n let columnKey = '';\n let sortDirection: TableSortingDirection | undefined = undefined;\n\n if (sort?.column !== column.key) {\n columnKey = column.key;\n sortDirection = 'asc';\n } else {\n if (sort?.direction === 'desc') {\n columnKey = '';\n sortDirection = undefined;\n } else {\n columnKey = sort.column;\n sortDirection = sort.direction === 'asc' ? 'desc' : 'asc';\n }\n }\n\n if(columnKey == '')\n setSort(undefined);\n else\n setSort({column: columnKey, direction: sortDirection!});\n\n remoteOperations && onTriggerSortingChange && onTriggerSortingChange(columnKey, sortDirection);\n };\n\n /**\n * Navigates user back to the previous page and updates the current table page.\n */\n const previousPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onPreviousPageClick) {\n onPreviousPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage > 1 ? currentPage - 1 : 1);\n }\n };\n\n /**\n * Navigates user to the next page and updates the current table page.\n */\n const nextPage = () => {\n if (remoteOperations) {\n // Let's inform parent component about page change\n if (onNextPageClick) {\n onNextPageClick();\n }\n } else {\n // Let's change the page within the component\n setCurrentPage(currentPage * rowsPerPage >= filteredRows.length ? currentPage : currentPage + 1);\n }\n };\n\n /**\n * Updates the rows per page value and refreshes the table content accordingly.\n * @param value - Newly selected rows per page value.\n */\n const changeRowsPerPage = (value: number) => {\n // Let's check if we are using remote pagination\n if (remoteOperations) {\n // Inform parent component about rows per page change\n if (onRowsPerPageChange) {\n onRowsPerPageChange(value);\n }\n } else {\n // Let's reset current page to 1\n setCurrentPage(1);\n }\n\n // Let's set rows per page\n setRowsPerPage(value);\n };\n\n\n /**\n * Function which is called when a mouse click happens on a row to pass data to the parent component.\n * @param row - Row in which the link is located.\n */\n const onRowClick = (row: any): void => {\n const selectedText = window?.getSelection()?.toString();\n\n if (selectedText?.length === 0 && selectable) {\n const value = keyExpr ? row[keyExpr] : row;\n let currentSelection = value;\n if (!!multiSelect) {\n const existing = selected?.indexOf(value);\n if (existing > -1) {\n currentSelection = [...selected];\n currentSelection.splice(existing, 1);\n } else {\n currentSelection = [...selected, currentSelection];\n }\n }\n\n setSelected(currentSelection)\n props.onSelectionChange && props.onSelectionChange(currentSelection);\n }\n };\n\n /**\n * Function which is called when user clicks checkbox to select or deselect all rows.\n */\n const onSelectAllClick = () => {\n const currentList = currentPageRows.map(row => keyExpr ? row[keyExpr] : row);\n\n switch (selectAllState) {\n case 'all':\n setSelected([...selected].filter(item => !currentList.includes(item)));\n setSelectAllState('none');\n break;\n case 'none':\n setSelected([...selected, ...currentList]);\n setSelectAllState('all');\n break;\n case 'some':\n setSelected([...selected, ...currentList.filter(item => !selected.includes(item))]);\n setSelectAllState('all');\n break;\n }\n };\n\n /**\n * Return Table component.\n */\n return (\n <TableWrapper>\n <TableHeader {...props}/>\n <TableBody {...props}\n currentPageRows={currentPageRows}\n selected={selected}\n onRowClick={onRowClick}\n sortByColumn={sortTableColumn}\n onSelectAllClick={onSelectAllClick}\n sortProps={sort}\n selectAllState={selectAllState}/>\n <TableFooter {...props}\n onRowsPerPageChange={changeRowsPerPage}\n rowsPerPage={rowsPerPage}\n setIsCollapsed={setIsCollapsed}\n isCollapsed={isCollapsed}\n from={from}\n to={to}\n total={total}\n nextPage={nextPage}\n prevPage={previousPage}/>\n {showLoadingIndicator && (\n <StyledTableSpinner>\n <LoadingIndicator size={Size.Medium}/>\n </StyledTableSpinner>\n )}\n </TableWrapper>\n );\n};\n\nexport default Table;\n"],"mappings":"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"}
|
package/dist/Table/Table.js
CHANGED
|
@@ -5,7 +5,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
|
|
|
5
5
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
6
6
|
function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e) { throw _e; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e2) { didErr = true; err = _e2; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
|
|
7
7
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
8
|
-
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
8
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
9
9
|
/**
|
|
10
10
|
* Import React libraries.
|
|
11
11
|
*/
|
|
@@ -355,7 +355,6 @@ var Table = function Table(props) {
|
|
|
355
355
|
* Return Table component.
|
|
356
356
|
*/
|
|
357
357
|
return /*#__PURE__*/_jsxs(TableWrapper, {
|
|
358
|
-
className: props.border ? 'border' : undefined,
|
|
359
358
|
children: [/*#__PURE__*/_jsx(TableHeader, _objectSpread({}, props)), /*#__PURE__*/_jsx(TableBody, _objectSpread(_objectSpread({}, props), {}, {
|
|
360
359
|
currentPageRows: currentPageRows,
|
|
361
360
|
selected: selected,
|