@lumx/react 2.1.0-alpha.14 → 2.1.0-alpha.15
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/esm/_internal/AlertDialog.js +2 -1
- package/esm/_internal/AlertDialog.js.map +1 -1
- package/esm/_internal/AutocompleteMultiple.js +2 -1
- package/esm/_internal/AutocompleteMultiple.js.map +1 -1
- package/esm/_internal/Avatar2.js +2 -1
- package/esm/_internal/Avatar2.js.map +1 -1
- package/esm/_internal/Badge2.js +2 -1
- package/esm/_internal/Badge2.js.map +1 -1
- package/esm/_internal/Button2.js +2 -1
- package/esm/_internal/Button2.js.map +1 -1
- package/esm/_internal/ButtonGroup.js +2 -1
- package/esm/_internal/ButtonGroup.js.map +1 -1
- package/esm/_internal/ButtonRoot.js +2 -1
- package/esm/_internal/ButtonRoot.js.map +1 -1
- package/esm/_internal/Checkbox2.js +2 -1
- package/esm/_internal/Checkbox2.js.map +1 -1
- package/esm/_internal/Chip2.js +2 -1
- package/esm/_internal/Chip2.js.map +1 -1
- package/esm/_internal/ChipGroup.js +2 -1
- package/esm/_internal/ChipGroup.js.map +1 -1
- package/esm/_internal/ClickAwayProvider.js +2 -1
- package/esm/_internal/ClickAwayProvider.js.map +1 -1
- package/esm/_internal/CommentBlock.js +2 -1
- package/esm/_internal/CommentBlock.js.map +1 -1
- package/esm/_internal/DatePickerField.js +2 -1
- package/esm/_internal/DatePickerField.js.map +1 -1
- package/esm/_internal/Dialog2.js +2 -1
- package/esm/_internal/Dialog2.js.map +1 -1
- package/esm/_internal/Divider2.js +2 -1
- package/esm/_internal/Divider2.js.map +1 -1
- package/esm/_internal/DragHandle.js +2 -1
- package/esm/_internal/DragHandle.js.map +1 -1
- package/esm/_internal/Dropdown2.js +2 -1
- package/esm/_internal/Dropdown2.js.map +1 -1
- package/esm/_internal/ExpansionPanel.js +2 -1
- package/esm/_internal/ExpansionPanel.js.map +1 -1
- package/esm/_internal/Flag2.js +2 -1
- package/esm/_internal/Flag2.js.map +1 -1
- package/esm/_internal/FlexBox.js +2 -1
- package/esm/_internal/FlexBox.js.map +1 -1
- package/esm/_internal/GridItem.js +2 -1
- package/esm/_internal/GridItem.js.map +1 -1
- package/esm/_internal/Icon2.js +2 -1
- package/esm/_internal/Icon2.js.map +1 -1
- package/esm/_internal/IconButton.js +2 -1
- package/esm/_internal/IconButton.js.map +1 -1
- package/esm/_internal/ImageBlock.js +2 -1
- package/esm/_internal/ImageBlock.js.map +1 -1
- package/esm/_internal/InputHelper.js +2 -1
- package/esm/_internal/InputHelper.js.map +1 -1
- package/esm/_internal/InputLabel.js +2 -1
- package/esm/_internal/InputLabel.js.map +1 -1
- package/esm/_internal/Lightbox2.js +2 -1
- package/esm/_internal/Lightbox2.js.map +1 -1
- package/esm/_internal/Link2.js +8 -1
- package/esm/_internal/Link2.js.map +1 -1
- package/esm/_internal/LinkPreview.js +2 -1
- package/esm/_internal/LinkPreview.js.map +1 -1
- package/esm/_internal/List2.js +2 -1
- package/esm/_internal/List2.js.map +1 -1
- package/esm/_internal/ListSubheader.js +2 -1
- package/esm/_internal/ListSubheader.js.map +1 -1
- package/esm/_internal/Message2.js +2 -1
- package/esm/_internal/Message2.js.map +1 -1
- package/esm/_internal/Mosaic2.js +2 -1
- package/esm/_internal/Mosaic2.js.map +1 -1
- package/esm/_internal/Notification2.js +2 -1
- package/esm/_internal/Notification2.js.map +1 -1
- package/esm/_internal/Popover2.js +2 -1
- package/esm/_internal/Popover2.js.map +1 -1
- package/esm/_internal/PostBlock.js +2 -1
- package/esm/_internal/PostBlock.js.map +1 -1
- package/esm/_internal/Progress2.js +2 -1
- package/esm/_internal/Progress2.js.map +1 -1
- package/esm/_internal/ProgressTrackerStepPanel.js +2 -1
- package/esm/_internal/ProgressTrackerStepPanel.js.map +1 -1
- package/esm/_internal/RadioGroup.js +2 -1
- package/esm/_internal/RadioGroup.js.map +1 -1
- package/esm/_internal/SelectMultiple.js +2 -1
- package/esm/_internal/SelectMultiple.js.map +1 -1
- package/esm/_internal/SideNavigationItem.js +2 -1
- package/esm/_internal/SideNavigationItem.js.map +1 -1
- package/esm/_internal/SkeletonTypography.js +2 -1
- package/esm/_internal/SkeletonTypography.js.map +1 -1
- package/esm/_internal/Slider2.js +2 -1
- package/esm/_internal/Slider2.js.map +1 -1
- package/esm/_internal/SlideshowControls.js +2 -1
- package/esm/_internal/SlideshowControls.js.map +1 -1
- package/esm/_internal/Switch2.js +2 -1
- package/esm/_internal/Switch2.js.map +1 -1
- package/esm/_internal/TabPanel.js +2 -1
- package/esm/_internal/TabPanel.js.map +1 -1
- package/esm/_internal/TableRow.js +2 -1
- package/esm/_internal/TableRow.js.map +1 -1
- package/esm/_internal/TextField.js +2 -1
- package/esm/_internal/TextField.js.map +1 -1
- package/esm/_internal/Thumbnail2.js +2 -1
- package/esm/_internal/Thumbnail2.js.map +1 -1
- package/esm/_internal/Toolbar2.js +2 -1
- package/esm/_internal/Toolbar2.js.map +1 -1
- package/esm/_internal/Tooltip2.js +2 -1
- package/esm/_internal/Tooltip2.js.map +1 -1
- package/esm/_internal/Uploader2.js +2 -1
- package/esm/_internal/Uploader2.js.map +1 -1
- package/esm/_internal/UserBlock.js +2 -1
- package/esm/_internal/UserBlock.js.map +1 -1
- package/esm/_internal/_rollupPluginBabelHelpers.js +167 -0
- package/esm/_internal/_rollupPluginBabelHelpers.js.map +1 -0
- package/esm/_internal/alert-dialog.js +2 -1
- package/esm/_internal/alert-dialog.js.map +1 -1
- package/esm/_internal/autocomplete.js +2 -1
- package/esm/_internal/autocomplete.js.map +1 -1
- package/esm/_internal/avatar.js +2 -1
- package/esm/_internal/avatar.js.map +1 -1
- package/esm/_internal/badge.js +2 -1
- package/esm/_internal/badge.js.map +1 -1
- package/esm/_internal/button.js +2 -1
- package/esm/_internal/button.js.map +1 -1
- package/esm/_internal/checkbox.js +2 -1
- package/esm/_internal/checkbox.js.map +1 -1
- package/esm/_internal/chip.js +2 -1
- package/esm/_internal/chip.js.map +1 -1
- package/esm/_internal/comment-block.js +2 -1
- package/esm/_internal/comment-block.js.map +1 -1
- package/esm/_internal/components.js +36 -3
- package/esm/_internal/components.js.map +1 -1
- package/esm/_internal/date-picker.js +2 -1
- package/esm/_internal/date-picker.js.map +1 -1
- package/esm/_internal/dialog.js +2 -1
- package/esm/_internal/dialog.js.map +1 -1
- package/esm/_internal/divider.js +2 -1
- package/esm/_internal/divider.js.map +1 -1
- package/esm/_internal/drag-handle.js +2 -1
- package/esm/_internal/drag-handle.js.map +1 -1
- package/esm/_internal/dropdown.js +2 -1
- package/esm/_internal/dropdown.js.map +1 -1
- package/esm/_internal/expansion-panel.js +2 -1
- package/esm/_internal/expansion-panel.js.map +1 -1
- package/esm/_internal/flag.js +2 -1
- package/esm/_internal/flag.js.map +1 -1
- package/esm/_internal/flex-box.js +2 -1
- package/esm/_internal/flex-box.js.map +1 -1
- package/esm/_internal/getRootClassName.js +2 -166
- package/esm/_internal/getRootClassName.js.map +1 -1
- package/esm/_internal/grid.js +2 -1
- package/esm/_internal/grid.js.map +1 -1
- package/esm/_internal/icon.js +2 -1
- package/esm/_internal/icon.js.map +1 -1
- package/esm/_internal/image-block.js +2 -1
- package/esm/_internal/image-block.js.map +1 -1
- package/esm/_internal/input-helper.js +2 -1
- package/esm/_internal/input-helper.js.map +1 -1
- package/esm/_internal/input-label.js +2 -1
- package/esm/_internal/input-label.js.map +1 -1
- package/esm/_internal/lightbox.js +2 -1
- package/esm/_internal/lightbox.js.map +1 -1
- package/esm/_internal/link-preview.js +2 -1
- package/esm/_internal/link-preview.js.map +1 -1
- package/esm/_internal/link.js +2 -1
- package/esm/_internal/link.js.map +1 -1
- package/esm/_internal/list.js +2 -1
- package/esm/_internal/list.js.map +1 -1
- package/esm/_internal/message.js +2 -1
- package/esm/_internal/message.js.map +1 -1
- package/esm/_internal/mosaic.js +2 -1
- package/esm/_internal/mosaic.js.map +1 -1
- package/esm/_internal/notification.js +2 -1
- package/esm/_internal/notification.js.map +1 -1
- package/esm/_internal/popover.js +2 -1
- package/esm/_internal/popover.js.map +1 -1
- package/esm/_internal/post-block.js +2 -1
- package/esm/_internal/post-block.js.map +1 -1
- package/esm/_internal/progress-tracker.js +2 -1
- package/esm/_internal/progress-tracker.js.map +1 -1
- package/esm/_internal/progress.js +2 -1
- package/esm/_internal/progress.js.map +1 -1
- package/esm/_internal/radio-button.js +2 -1
- package/esm/_internal/radio-button.js.map +1 -1
- package/esm/_internal/renderLink.js +1 -1
- package/esm/_internal/select.js +2 -1
- package/esm/_internal/select.js.map +1 -1
- package/esm/_internal/side-navigation.js +2 -1
- package/esm/_internal/side-navigation.js.map +1 -1
- package/esm/_internal/skeleton.js +2 -1
- package/esm/_internal/skeleton.js.map +1 -1
- package/esm/_internal/slider.js +2 -1
- package/esm/_internal/slider.js.map +1 -1
- package/esm/_internal/slideshow.js +2 -1
- package/esm/_internal/slideshow.js.map +1 -1
- package/esm/_internal/switch.js +2 -1
- package/esm/_internal/switch.js.map +1 -1
- package/esm/_internal/table.js +2 -1
- package/esm/_internal/table.js.map +1 -1
- package/esm/_internal/tabs.js +2 -1
- package/esm/_internal/tabs.js.map +1 -1
- package/esm/_internal/text-field.js +2 -1
- package/esm/_internal/text-field.js.map +1 -1
- package/esm/_internal/thumbnail.js +2 -1
- package/esm/_internal/thumbnail.js.map +1 -1
- package/esm/_internal/toolbar.js +2 -1
- package/esm/_internal/toolbar.js.map +1 -1
- package/esm/_internal/tooltip.js +2 -1
- package/esm/_internal/tooltip.js.map +1 -1
- package/esm/_internal/types.js +1 -1
- package/esm/_internal/uploader.js +2 -1
- package/esm/_internal/uploader.js.map +1 -1
- package/esm/_internal/useDelayedVisibility.js +1 -1
- package/esm/_internal/useRovingTabIndex.js +1 -1
- package/esm/_internal/user-block.js +2 -1
- package/esm/_internal/user-block.js.map +1 -1
- package/esm/index.js +3 -2
- package/esm/index.js.map +1 -1
- package/package.json +4 -4
- package/src/components/index.ts +39 -3
- package/src/components/link/Link.stories.tsx +24 -8
- package/src/components/link/Link.tsx +8 -2
- package/src/components/skeleton/SkeletonTypography.tsx +2 -2
- package/types.d.ts +60 -4
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { a as _defineProperty, b as _objectWithoutProperties, c as _extends, _ as _objectSpread2 } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Size, Emphasis, ColorPalette, Kind } from './components.js';
|
|
2
|
-
import { _ as _defineProperty, g as getRootClassName, a as _objectWithoutProperties, b as _extends, c as _objectSpread2, d as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
5
|
import { m as mdiAlert, a as mdiInformation, b as mdiCheckCircle, c as mdiAlertCircle } from './mdi.js';
|
|
5
6
|
import { u as uid } from '../index2.js';
|
|
6
7
|
import { a as Button } from './Button2.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AlertDialog.js","sources":["../../../src/components/alert-dialog/AlertDialog.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport {\n DialogProps,\n Dialog,\n Button,\n Emphasis,\n ColorPalette,\n Icon,\n Size,\n Kind,\n Toolbar,\n ButtonProps,\n} from '@lumx/react';\n\nimport { mdiAlert, mdiAlertCircle, mdiCheckCircle, mdiInformation } from '@lumx/icons/';\nimport { uid } from 'uid';\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nexport interface AlertDialogProps extends Omit<DialogProps, 'header' | 'footer'> {\n /** Message variant. */\n kind?: Kind;\n /** Dialog title. */\n title?: string;\n /** Props forwarded to the confirm button */\n confirmProps: ButtonProps & {\n onClick(): void;\n label: string;\n };\n /**\n * Props forwarded to the cancel button.\n * Will not render a cancel button if undefined.\n */\n cancelProps?: ButtonProps & {\n onClick(): void;\n label: string;\n };\n}\n\n/**\n * Associative map from message kind to color and icon.\n */\nconst CONFIG = {\n [Kind.error]: { color: ColorPalette.red, icon: mdiAlert },\n [Kind.info]: { color: ColorPalette.blue, icon: mdiInformation },\n [Kind.success]: { color: ColorPalette.green, icon: mdiCheckCircle },\n [Kind.warning]: { color: ColorPalette.yellow, icon: mdiAlertCircle },\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AlertDialog';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<DialogProps> = {\n size: Size.tiny,\n kind: Kind.info,\n};\n\n/**\n * AlertDialog component.\n *\n * An alert dialog is a modal dialog that interrupts the user's workflow to\n * communicate an important message and acquire a response.\n *\n * It should not have a complex content.\n * Children of this component should only be strings, paragraphs or links.\n */\nexport const AlertDialog: Comp<AlertDialogProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n id,\n title,\n className,\n cancelProps,\n confirmProps,\n kind,\n size,\n dialogProps,\n children,\n ...forwardedProps\n } = props;\n\n const cancelButtonRef = React.useRef(null);\n const confirmationButtonRef = React.useRef(null);\n const { color, icon } = CONFIG[kind as Kind] || {};\n\n // Define a unique ID to target title and description for aria attributes.\n const uniqueId = React.useMemo(() => id || uid(), [id]);\n const titleId = `${uniqueId}-title`;\n const descriptionId = `${uniqueId}-description`;\n\n // If content is a string, set in a paragraph.\n const DescriptionElement = typeof children === 'string' ? 'p' : 'div';\n\n const { label: confirmLabel, onClick: confirmOnClick, ...forwardedConfirmProps } = confirmProps;\n const { label: cancelLabel, onClick: cancelOnClick, ...forwardedCancelProps } = cancelProps || {};\n\n return (\n <Dialog\n ref={ref}\n focusElement={cancelProps ? cancelButtonRef : confirmationButtonRef}\n size={size}\n dialogProps={{\n id: uniqueId,\n role: 'alertdialog',\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n ...dialogProps,\n }}\n className={classNames(\n className,\n handleBasicClasses({\n kind,\n prefix: CLASSNAME,\n }),\n )}\n {...forwardedProps}\n >\n <header>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n before={<Icon icon={icon} size={Size.s} color={color} />}\n label={\n <h2 id={titleId} className=\"lumx-typography-title\">\n {title}\n </h2>\n }\n />\n </header>\n\n {children && (\n <DescriptionElement\n id={descriptionId}\n className=\"lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge\"\n >\n {children}\n </DescriptionElement>\n )}\n\n <footer>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n after={\n <>\n {cancelProps && (\n <Button\n {...forwardedCancelProps}\n ref={cancelButtonRef}\n emphasis={Emphasis.medium}\n onClick={cancelOnClick}\n >\n {cancelLabel}\n </Button>\n )}\n <Button\n {...forwardedConfirmProps}\n ref={confirmationButtonRef}\n color={color}\n className=\"lumx-spacing-margin-left-regular\"\n onClick={confirmOnClick}\n >\n {confirmLabel}\n </Button>\n </>\n }\n />\n </footer>\n </Dialog>\n );\n});\n\nAlertDialog.displayName = COMPONENT_NAME;\nAlertDialog.className = CLASSNAME;\nAlertDialog.defaultProps = DEFAULT_PROPS;\n"],"names":["CONFIG","Kind","error","color","ColorPalette","red","icon","mdiAlert","info","blue","mdiInformation","success","green","mdiCheckCircle","warning","yellow","mdiAlertCircle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","tiny","kind","AlertDialog","forwardRef","props","ref","id","title","className","cancelProps","confirmProps","dialogProps","children","forwardedProps","cancelButtonRef","React","useRef","confirmationButtonRef","uniqueId","useMemo","uid","titleId","descriptionId","DescriptionElement","confirmLabel","label","confirmOnClick","onClick","forwardedConfirmProps","cancelLabel","cancelOnClick","forwardedCancelProps","role","classNames","handleBasicClasses","prefix","s","Emphasis","medium","displayName","defaultProps"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AlertDialog.js","sources":["../../../src/components/alert-dialog/AlertDialog.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport {\n DialogProps,\n Dialog,\n Button,\n Emphasis,\n ColorPalette,\n Icon,\n Size,\n Kind,\n Toolbar,\n ButtonProps,\n} from '@lumx/react';\n\nimport { mdiAlert, mdiAlertCircle, mdiCheckCircle, mdiInformation } from '@lumx/icons/';\nimport { uid } from 'uid';\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nexport interface AlertDialogProps extends Omit<DialogProps, 'header' | 'footer'> {\n /** Message variant. */\n kind?: Kind;\n /** Dialog title. */\n title?: string;\n /** Props forwarded to the confirm button */\n confirmProps: ButtonProps & {\n onClick(): void;\n label: string;\n };\n /**\n * Props forwarded to the cancel button.\n * Will not render a cancel button if undefined.\n */\n cancelProps?: ButtonProps & {\n onClick(): void;\n label: string;\n };\n}\n\n/**\n * Associative map from message kind to color and icon.\n */\nconst CONFIG = {\n [Kind.error]: { color: ColorPalette.red, icon: mdiAlert },\n [Kind.info]: { color: ColorPalette.blue, icon: mdiInformation },\n [Kind.success]: { color: ColorPalette.green, icon: mdiCheckCircle },\n [Kind.warning]: { color: ColorPalette.yellow, icon: mdiAlertCircle },\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AlertDialog';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<DialogProps> = {\n size: Size.tiny,\n kind: Kind.info,\n};\n\n/**\n * AlertDialog component.\n *\n * An alert dialog is a modal dialog that interrupts the user's workflow to\n * communicate an important message and acquire a response.\n *\n * It should not have a complex content.\n * Children of this component should only be strings, paragraphs or links.\n */\nexport const AlertDialog: Comp<AlertDialogProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n id,\n title,\n className,\n cancelProps,\n confirmProps,\n kind,\n size,\n dialogProps,\n children,\n ...forwardedProps\n } = props;\n\n const cancelButtonRef = React.useRef(null);\n const confirmationButtonRef = React.useRef(null);\n const { color, icon } = CONFIG[kind as Kind] || {};\n\n // Define a unique ID to target title and description for aria attributes.\n const uniqueId = React.useMemo(() => id || uid(), [id]);\n const titleId = `${uniqueId}-title`;\n const descriptionId = `${uniqueId}-description`;\n\n // If content is a string, set in a paragraph.\n const DescriptionElement = typeof children === 'string' ? 'p' : 'div';\n\n const { label: confirmLabel, onClick: confirmOnClick, ...forwardedConfirmProps } = confirmProps;\n const { label: cancelLabel, onClick: cancelOnClick, ...forwardedCancelProps } = cancelProps || {};\n\n return (\n <Dialog\n ref={ref}\n focusElement={cancelProps ? cancelButtonRef : confirmationButtonRef}\n size={size}\n dialogProps={{\n id: uniqueId,\n role: 'alertdialog',\n 'aria-labelledby': titleId,\n 'aria-describedby': descriptionId,\n ...dialogProps,\n }}\n className={classNames(\n className,\n handleBasicClasses({\n kind,\n prefix: CLASSNAME,\n }),\n )}\n {...forwardedProps}\n >\n <header>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n before={<Icon icon={icon} size={Size.s} color={color} />}\n label={\n <h2 id={titleId} className=\"lumx-typography-title\">\n {title}\n </h2>\n }\n />\n </header>\n\n {children && (\n <DescriptionElement\n id={descriptionId}\n className=\"lumx-typography-body2 lumx-spacing-padding-vertical-big lumx-spacing-padding-horizontal-huge\"\n >\n {children}\n </DescriptionElement>\n )}\n\n <footer>\n <Toolbar\n className=\"lumx-spacing-margin-horizontal\"\n after={\n <>\n {cancelProps && (\n <Button\n {...forwardedCancelProps}\n ref={cancelButtonRef}\n emphasis={Emphasis.medium}\n onClick={cancelOnClick}\n >\n {cancelLabel}\n </Button>\n )}\n <Button\n {...forwardedConfirmProps}\n ref={confirmationButtonRef}\n color={color}\n className=\"lumx-spacing-margin-left-regular\"\n onClick={confirmOnClick}\n >\n {confirmLabel}\n </Button>\n </>\n }\n />\n </footer>\n </Dialog>\n );\n});\n\nAlertDialog.displayName = COMPONENT_NAME;\nAlertDialog.className = CLASSNAME;\nAlertDialog.defaultProps = DEFAULT_PROPS;\n"],"names":["CONFIG","Kind","error","color","ColorPalette","red","icon","mdiAlert","info","blue","mdiInformation","success","green","mdiCheckCircle","warning","yellow","mdiAlertCircle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","tiny","kind","AlertDialog","forwardRef","props","ref","id","title","className","cancelProps","confirmProps","dialogProps","children","forwardedProps","cancelButtonRef","React","useRef","confirmationButtonRef","uniqueId","useMemo","uid","titleId","descriptionId","DescriptionElement","confirmLabel","label","confirmOnClick","onClick","forwardedConfirmProps","cancelLabel","cancelOnClick","forwardedCancelProps","role","classNames","handleBasicClasses","prefix","s","Emphasis","medium","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Size } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, b as _extends, d as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef, useRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
5
|
import { d as mdiClose } from './mdi.js';
|
|
5
6
|
import { u as useFocus } from './Popover2.js';
|
|
6
7
|
import { m as mergeRefs } from './mergeRefs.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AutocompleteMultiple.js","sources":["../../../src/components/autocomplete/Autocomplete.tsx","../../../src/components/autocomplete/AutocompleteMultiple.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, RefObject, SyntheticEvent, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Dropdown, IconButtonProps, Offset, Placement, TextField, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { useFocus } from '@lumx/react/hooks/useFocus';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteProps extends GenericProps {\n /**\n * Whether the suggestions list should display anchored to the input or to the wrapper.\n * @see {@link DropdownProps#anchorToInput}\n */\n anchorToInput?: boolean;\n /**\n * Props to pass to the clear button (minus those already set by the TextField props).\n * If not specified, the button won't be displayed.\n * @see {@link TextFieldProps#clearButtonProps}\n */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /**\n * Reference to the <input> or <textarea> element.\n * @see {@link TextFieldProps#inputRef}\n */\n inputRef?: RefObject<HTMLInputElement>;\n /**\n * The offset that will be applied to the Dropdown position.\n * @see {@link DropdownProps#offset}\n */\n offset?: Offset;\n /**\n * The preferred Dropdown location against the anchor element.\n * @see {@link DropdownProps#placement}\n */\n placement?: Placement;\n /**\n * Whether the dropdown should fit to the anchor width or not.\n * @see {@link DropdownProps#fitToAnchorWidth}\n */\n fitToAnchorWidth?: boolean;\n /**\n * The error related to the component.\n * @see {@link TextFieldProps#error}\n */\n error?: string | ReactNode;\n /**\n * Whether the text field is displayed with error style or not.\n * @see {@link TextFieldProps#hasError}\n */\n hasError?: boolean;\n /**\n * Whether the text box should be focused upon closing the suggestions or not.\n */\n shouldFocusOnClose?: boolean;\n /**\n * The helper message of the text field.\n * @see {@link TextFieldProps#helper}\n */\n helper?: string;\n /**\n * The icon of the text field (SVG path).\n * @see {@link TextFieldProps#icon}\n */\n icon?: string;\n /**\n * Whether the component is disabled or not.\n * @see {@link TextFieldProps#isDisabled}\n */\n isDisabled?: boolean;\n /**\n * Whether the component is required or not.\n * @see {@link TextFieldProps#isRequired}\n */\n isRequired?: boolean;\n /**\n * Whether the text field is displayed with valid style or not.\n * @see {@link TextFieldProps#isValid}\n */\n isValid?: boolean;\n /**\n * The label of the text field displayed in a label tag.\n * @see {@link TextFieldProps#label}\n */\n label?: string;\n /**\n * The placeholder message of the text field.\n * @see {@link TextFieldProps#placeholder}\n */\n placeholder?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** List of suggestions to display during autocomplete. */\n children: React.ReactNode;\n /**\n * The list of chips to be displayed before the text field input.\n */\n chips?: React.ReactNode;\n /**\n * The value of the text field.\n * @see {@link TextFieldProps#value}\n */\n value: string;\n /**\n * Whether the suggestions from the autocomplete should be displayed or not.\n * @see {@link DropdownProps#isOpen}\n */\n isOpen: boolean;\n /**\n * The native input name property.\n * @see {@link TextFieldProps#name}\n */\n name?: string;\n /**\n * Whether a click in the Autocomplete dropdown would close it or not.\n * @see {@link DropdownProps#closeOnClick}\n */\n closeOnClick?: boolean;\n /**\n * Whether a click anywhere out of the Autocomplete would close it or not.\n * @see {@link DropdownProps#closeOnClickAway}\n */\n closeOnClickAway?: boolean;\n /**\n * Whether an escape key press would close the Autocomplete or not.\n * @see {@link DropdownProps#closeOnEscape}\n */\n closeOnEscape?: boolean;\n /**\n * The function called on blur.\n * @see {@link TextFieldProps#onBlur}\n */\n onBlur?(event: React.FocusEvent): void;\n /**\n * On change callback.\n * @see {@link TextFieldProps#onChange}\n */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /**\n * The function called on close.\n * @see {@link DropdownProps#onClose}\n */\n onClose?(): void;\n /**\n * The function called on focus.\n * @see {@link TextFieldProps#onFocus}\n */\n onFocus?(event: React.FocusEvent): void;\n /**\n * The function called when the bottom of the dropdown is reached.\n * @see {@link DropdownProps#onInfiniteScroll}\n */\n onInfiniteScroll?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Autocomplete';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AutocompleteProps> = {\n anchorToInput: false,\n closeOnClick: false,\n closeOnClickAway: true,\n closeOnEscape: true,\n shouldFocusOnClose: false,\n};\n\n/**\n * Autocomplete component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Autocomplete: Comp<AutocompleteProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n anchorToInput,\n children,\n chips,\n className,\n closeOnClick,\n closeOnClickAway,\n closeOnEscape,\n disabled,\n error,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isDisabled = disabled,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClose,\n onFocus,\n onInfiniteScroll,\n placeholder,\n placement,\n shouldFocusOnClose,\n theme,\n value,\n ...forwardedProps\n } = props;\n const inputAnchorRef = useRef<HTMLElement>(null);\n const textFieldRef = useRef(null);\n useFocus(inputAnchorRef.current, !isOpen && shouldFocusOnClose);\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n }),\n )}\n >\n <TextField\n chips={chips}\n error={error}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={mergeRefs(inputAnchorRef, inputRef) as any}\n clearButtonProps={clearButtonProps}\n isDisabled={isDisabled}\n isRequired={isRequired}\n isValid={isValid}\n label={label}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n textFieldRef={textFieldRef}\n theme={theme}\n value={value}\n />\n <Dropdown\n anchorRef={anchorToInput ? inputAnchorRef : textFieldRef}\n closeOnClick={closeOnClick}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n fitToAnchorWidth={fitToAnchorWidth}\n isOpen={isOpen}\n offset={offset}\n onClose={onClose}\n onInfiniteScroll={onInfiniteScroll}\n placement={placement}\n shouldFocusOnOpen={false}\n theme={theme}\n >\n {children}\n </Dropdown>\n </div>\n );\n});\nAutocomplete.displayName = COMPONENT_NAME;\nAutocomplete.className = CLASSNAME;\nAutocomplete.defaultProps = DEFAULT_PROPS;\n","import { mdiClose } from '@lumx/icons';\nimport { Autocomplete, AutocompleteProps, Chip, ChipGroup, HorizontalAlignment, Icon, Size } from '@lumx/react';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactNode } from 'react';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteMultipleProps extends AutocompleteProps {\n /** Selected values. */\n values: any[];\n /** Alignment of the chips in the autocomplete. */\n chipsAlignment?: HorizontalAlignment;\n /** Selected value render function. Default: Renders the value inside of a Chip. */\n selectedChipRender(\n choice: any,\n index: number,\n onClear?: (event: React.MouseEvent, choice: any) => void,\n isDisabled?: boolean,\n ): ReactNode | string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AutocompleteMultiple';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AutocompleteMultipleProps> = {\n closeOnClickAway: true,\n closeOnEscape: true,\n selectedChipRender(choice, index, onClear, isDisabled) {\n const onClick = (event: React.MouseEvent) => onClear && onClear(event, choice);\n return (\n <Chip\n key={index}\n after={onClear && <Icon icon={mdiClose} size={Size.xxs} />}\n isDisabled={isDisabled}\n size={Size.s}\n onAfterClick={onClick}\n onClick={onClick}\n >\n {choice}\n </Chip>\n );\n },\n values: [],\n};\n\n/**\n * AutocompleteMultiple component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const AutocompleteMultiple: Comp<AutocompleteMultipleProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n anchorToInput,\n children,\n chipsAlignment,\n className,\n closeOnClickAway,\n closeOnEscape,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isDisabled,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClear,\n onClose,\n onFocus,\n onInfiniteScroll,\n onKeyDown,\n placeholder,\n placement,\n selectedChipRender,\n shouldFocusOnClose,\n theme,\n type,\n value,\n values,\n ...forwardedProps\n } = props;\n\n return (\n <Autocomplete\n ref={ref}\n {...forwardedProps}\n anchorToInput={anchorToInput}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n }),\n )}\n name={name}\n value={value}\n onChange={onChange}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n shouldFocusOnClose={shouldFocusOnClose}\n onFocus={onFocus}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={inputRef}\n chips={values && values.map((chip: any, index: number) => selectedChipRender(chip, index, onClear))}\n isDisabled={isDisabled}\n isRequired={isRequired}\n clearButtonProps={clearButtonProps}\n isValid={isValid}\n label={label}\n placeholder={placeholder}\n theme={theme}\n type={type}\n isOpen={isOpen}\n closeOnClick={false}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n onClose={onClose}\n offset={offset}\n placement={placement}\n fitToAnchorWidth={fitToAnchorWidth}\n onInfiniteScroll={onInfiniteScroll}\n >\n {children}\n </Autocomplete>\n );\n});\nAutocompleteMultiple.displayName = COMPONENT_NAME;\nAutocompleteMultiple.className = CLASSNAME;\nAutocompleteMultiple.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","anchorToInput","closeOnClick","closeOnClickAway","closeOnEscape","shouldFocusOnClose","Autocomplete","forwardRef","props","ref","children","chips","className","disabled","error","fitToAnchorWidth","hasError","helper","icon","inputRef","clearButtonProps","isDisabled","isRequired","isOpen","isValid","label","name","offset","onBlur","onChange","onClose","onFocus","onInfiniteScroll","placeholder","placement","theme","value","forwardedProps","inputAnchorRef","useRef","textFieldRef","useFocus","current","classNames","handleBasicClasses","prefix","mergeRefs","displayName","defaultProps","selectedChipRender","choice","index","onClear","onClick","event","mdiClose","Size","xxs","s","values","AutocompleteMultiple","chipsAlignment","onKeyDown","type","map","chip"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"AutocompleteMultiple.js","sources":["../../../src/components/autocomplete/Autocomplete.tsx","../../../src/components/autocomplete/AutocompleteMultiple.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, RefObject, SyntheticEvent, useRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Dropdown, IconButtonProps, Offset, Placement, TextField, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { useFocus } from '@lumx/react/hooks/useFocus';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteProps extends GenericProps {\n /**\n * Whether the suggestions list should display anchored to the input or to the wrapper.\n * @see {@link DropdownProps#anchorToInput}\n */\n anchorToInput?: boolean;\n /**\n * Props to pass to the clear button (minus those already set by the TextField props).\n * If not specified, the button won't be displayed.\n * @see {@link TextFieldProps#clearButtonProps}\n */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /**\n * Reference to the <input> or <textarea> element.\n * @see {@link TextFieldProps#inputRef}\n */\n inputRef?: RefObject<HTMLInputElement>;\n /**\n * The offset that will be applied to the Dropdown position.\n * @see {@link DropdownProps#offset}\n */\n offset?: Offset;\n /**\n * The preferred Dropdown location against the anchor element.\n * @see {@link DropdownProps#placement}\n */\n placement?: Placement;\n /**\n * Whether the dropdown should fit to the anchor width or not.\n * @see {@link DropdownProps#fitToAnchorWidth}\n */\n fitToAnchorWidth?: boolean;\n /**\n * The error related to the component.\n * @see {@link TextFieldProps#error}\n */\n error?: string | ReactNode;\n /**\n * Whether the text field is displayed with error style or not.\n * @see {@link TextFieldProps#hasError}\n */\n hasError?: boolean;\n /**\n * Whether the text box should be focused upon closing the suggestions or not.\n */\n shouldFocusOnClose?: boolean;\n /**\n * The helper message of the text field.\n * @see {@link TextFieldProps#helper}\n */\n helper?: string;\n /**\n * The icon of the text field (SVG path).\n * @see {@link TextFieldProps#icon}\n */\n icon?: string;\n /**\n * Whether the component is disabled or not.\n * @see {@link TextFieldProps#isDisabled}\n */\n isDisabled?: boolean;\n /**\n * Whether the component is required or not.\n * @see {@link TextFieldProps#isRequired}\n */\n isRequired?: boolean;\n /**\n * Whether the text field is displayed with valid style or not.\n * @see {@link TextFieldProps#isValid}\n */\n isValid?: boolean;\n /**\n * The label of the text field displayed in a label tag.\n * @see {@link TextFieldProps#label}\n */\n label?: string;\n /**\n * The placeholder message of the text field.\n * @see {@link TextFieldProps#placeholder}\n */\n placeholder?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** List of suggestions to display during autocomplete. */\n children: React.ReactNode;\n /**\n * The list of chips to be displayed before the text field input.\n */\n chips?: React.ReactNode;\n /**\n * The value of the text field.\n * @see {@link TextFieldProps#value}\n */\n value: string;\n /**\n * Whether the suggestions from the autocomplete should be displayed or not.\n * @see {@link DropdownProps#isOpen}\n */\n isOpen: boolean;\n /**\n * The native input name property.\n * @see {@link TextFieldProps#name}\n */\n name?: string;\n /**\n * Whether a click in the Autocomplete dropdown would close it or not.\n * @see {@link DropdownProps#closeOnClick}\n */\n closeOnClick?: boolean;\n /**\n * Whether a click anywhere out of the Autocomplete would close it or not.\n * @see {@link DropdownProps#closeOnClickAway}\n */\n closeOnClickAway?: boolean;\n /**\n * Whether an escape key press would close the Autocomplete or not.\n * @see {@link DropdownProps#closeOnEscape}\n */\n closeOnEscape?: boolean;\n /**\n * The function called on blur.\n * @see {@link TextFieldProps#onBlur}\n */\n onBlur?(event: React.FocusEvent): void;\n /**\n * On change callback.\n * @see {@link TextFieldProps#onChange}\n */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /**\n * The function called on close.\n * @see {@link DropdownProps#onClose}\n */\n onClose?(): void;\n /**\n * The function called on focus.\n * @see {@link TextFieldProps#onFocus}\n */\n onFocus?(event: React.FocusEvent): void;\n /**\n * The function called when the bottom of the dropdown is reached.\n * @see {@link DropdownProps#onInfiniteScroll}\n */\n onInfiniteScroll?(): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Autocomplete';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AutocompleteProps> = {\n anchorToInput: false,\n closeOnClick: false,\n closeOnClickAway: true,\n closeOnEscape: true,\n shouldFocusOnClose: false,\n};\n\n/**\n * Autocomplete component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Autocomplete: Comp<AutocompleteProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n anchorToInput,\n children,\n chips,\n className,\n closeOnClick,\n closeOnClickAway,\n closeOnEscape,\n disabled,\n error,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isDisabled = disabled,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClose,\n onFocus,\n onInfiniteScroll,\n placeholder,\n placement,\n shouldFocusOnClose,\n theme,\n value,\n ...forwardedProps\n } = props;\n const inputAnchorRef = useRef<HTMLElement>(null);\n const textFieldRef = useRef(null);\n useFocus(inputAnchorRef.current, !isOpen && shouldFocusOnClose);\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n }),\n )}\n >\n <TextField\n chips={chips}\n error={error}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={mergeRefs(inputAnchorRef, inputRef) as any}\n clearButtonProps={clearButtonProps}\n isDisabled={isDisabled}\n isRequired={isRequired}\n isValid={isValid}\n label={label}\n name={name}\n onBlur={onBlur}\n onChange={onChange}\n onFocus={onFocus}\n placeholder={placeholder}\n textFieldRef={textFieldRef}\n theme={theme}\n value={value}\n />\n <Dropdown\n anchorRef={anchorToInput ? inputAnchorRef : textFieldRef}\n closeOnClick={closeOnClick}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n fitToAnchorWidth={fitToAnchorWidth}\n isOpen={isOpen}\n offset={offset}\n onClose={onClose}\n onInfiniteScroll={onInfiniteScroll}\n placement={placement}\n shouldFocusOnOpen={false}\n theme={theme}\n >\n {children}\n </Dropdown>\n </div>\n );\n});\nAutocomplete.displayName = COMPONENT_NAME;\nAutocomplete.className = CLASSNAME;\nAutocomplete.defaultProps = DEFAULT_PROPS;\n","import { mdiClose } from '@lumx/icons';\nimport { Autocomplete, AutocompleteProps, Chip, ChipGroup, HorizontalAlignment, Icon, Size } from '@lumx/react';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactNode } from 'react';\n\n/**\n * Defines the props of the component.\n */\nexport interface AutocompleteMultipleProps extends AutocompleteProps {\n /** Selected values. */\n values: any[];\n /** Alignment of the chips in the autocomplete. */\n chipsAlignment?: HorizontalAlignment;\n /** Selected value render function. Default: Renders the value inside of a Chip. */\n selectedChipRender(\n choice: any,\n index: number,\n onClear?: (event: React.MouseEvent, choice: any) => void,\n isDisabled?: boolean,\n ): ReactNode | string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'AutocompleteMultiple';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AutocompleteMultipleProps> = {\n closeOnClickAway: true,\n closeOnEscape: true,\n selectedChipRender(choice, index, onClear, isDisabled) {\n const onClick = (event: React.MouseEvent) => onClear && onClear(event, choice);\n return (\n <Chip\n key={index}\n after={onClear && <Icon icon={mdiClose} size={Size.xxs} />}\n isDisabled={isDisabled}\n size={Size.s}\n onAfterClick={onClick}\n onClick={onClick}\n >\n {choice}\n </Chip>\n );\n },\n values: [],\n};\n\n/**\n * AutocompleteMultiple component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const AutocompleteMultiple: Comp<AutocompleteMultipleProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n anchorToInput,\n children,\n chipsAlignment,\n className,\n closeOnClickAway,\n closeOnEscape,\n fitToAnchorWidth,\n hasError,\n helper,\n icon,\n inputRef,\n clearButtonProps,\n isDisabled,\n isRequired,\n isOpen,\n isValid,\n label,\n name,\n offset,\n onBlur,\n onChange,\n onClear,\n onClose,\n onFocus,\n onInfiniteScroll,\n onKeyDown,\n placeholder,\n placement,\n selectedChipRender,\n shouldFocusOnClose,\n theme,\n type,\n value,\n values,\n ...forwardedProps\n } = props;\n\n return (\n <Autocomplete\n ref={ref}\n {...forwardedProps}\n anchorToInput={anchorToInput}\n className={classNames(\n className,\n handleBasicClasses({\n prefix: CLASSNAME,\n }),\n )}\n name={name}\n value={value}\n onChange={onChange}\n onKeyDown={onKeyDown}\n onBlur={onBlur}\n shouldFocusOnClose={shouldFocusOnClose}\n onFocus={onFocus}\n hasError={hasError}\n helper={helper}\n icon={icon}\n inputRef={inputRef}\n chips={values && values.map((chip: any, index: number) => selectedChipRender(chip, index, onClear))}\n isDisabled={isDisabled}\n isRequired={isRequired}\n clearButtonProps={clearButtonProps}\n isValid={isValid}\n label={label}\n placeholder={placeholder}\n theme={theme}\n type={type}\n isOpen={isOpen}\n closeOnClick={false}\n closeOnClickAway={closeOnClickAway}\n closeOnEscape={closeOnEscape}\n onClose={onClose}\n offset={offset}\n placement={placement}\n fitToAnchorWidth={fitToAnchorWidth}\n onInfiniteScroll={onInfiniteScroll}\n >\n {children}\n </Autocomplete>\n );\n});\nAutocompleteMultiple.displayName = COMPONENT_NAME;\nAutocompleteMultiple.className = CLASSNAME;\nAutocompleteMultiple.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","anchorToInput","closeOnClick","closeOnClickAway","closeOnEscape","shouldFocusOnClose","Autocomplete","forwardRef","props","ref","children","chips","className","disabled","error","fitToAnchorWidth","hasError","helper","icon","inputRef","clearButtonProps","isDisabled","isRequired","isOpen","isValid","label","name","offset","onBlur","onChange","onClose","onFocus","onInfiniteScroll","placeholder","placement","theme","value","forwardedProps","inputAnchorRef","useRef","textFieldRef","useFocus","current","classNames","handleBasicClasses","prefix","mergeRefs","displayName","defaultProps","selectedChipRender","choice","index","onClear","onClick","event","mdiClose","Size","xxs","s","values","AutocompleteMultiple","chipsAlignment","onKeyDown","type","map","chip"],"mappings":"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"}
|
package/esm/_internal/Avatar2.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { AspectRatio, Size, Theme } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, b as _extends, d as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
5
|
import { T as Thumbnail } from './Thumbnail2.js';
|
|
5
6
|
|
|
6
7
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Avatar2.js","sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, KeyboardEventHandler, MouseEventHandler, ReactElement, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, Size, Theme, Thumbnail, ThumbnailProps } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Avatar sizes.\n */\nexport type AvatarSize = Extract<Size, 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface AvatarProps extends GenericProps {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Image alternative text. */\n alt: string;\n /** Badge. */\n badge?: ReactElement;\n /** Image URL. */\n image: string;\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Size variant. */\n size?: AvatarSize;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Props to pass to the thumbnail (minus those already set by the Avatar props). */\n thumbnailProps?: Omit<\n ThumbnailProps,\n 'image' | 'alt' | 'size' | 'theme' | 'align' | 'fillHeight' | 'variant' | 'aspectRatio'\n >;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Avatar';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AvatarProps> = {\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Avatar component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Avatar: Comp<AvatarProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n actions,\n alt,\n badge,\n className,\n image,\n onClick,\n onKeyPress,\n size,\n theme,\n thumbnailProps,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, size, theme }))}\n >\n <Thumbnail\n className={`${CLASSNAME}__thumbnail`}\n onClick={onClick}\n onKeyPress={onKeyPress}\n {...thumbnailProps}\n aspectRatio={AspectRatio.square}\n size={size}\n image={image}\n alt={alt}\n />\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n {badge && <div className={`${CLASSNAME}__badge`}>{badge}</div>}\n </div>\n );\n});\nAvatar.displayName = COMPONENT_NAME;\nAvatar.className = CLASSNAME;\nAvatar.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","theme","Theme","light","Avatar","forwardRef","props","ref","actions","alt","badge","className","image","onClick","onKeyPress","thumbnailProps","forwardedProps","classNames","handleBasicClasses","prefix","AspectRatio","square","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Avatar2.js","sources":["../../../src/components/avatar/Avatar.tsx"],"sourcesContent":["import React, { forwardRef, KeyboardEventHandler, MouseEventHandler, ReactElement, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { AspectRatio, Size, Theme, Thumbnail, ThumbnailProps } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Avatar sizes.\n */\nexport type AvatarSize = Extract<Size, 'xs' | 's' | 'm' | 'l' | 'xl' | 'xxl'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface AvatarProps extends GenericProps {\n /** Action toolbar content. */\n actions?: ReactNode;\n /** Image alternative text. */\n alt: string;\n /** Badge. */\n badge?: ReactElement;\n /** Image URL. */\n image: string;\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Size variant. */\n size?: AvatarSize;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Props to pass to the thumbnail (minus those already set by the Avatar props). */\n thumbnailProps?: Omit<\n ThumbnailProps,\n 'image' | 'alt' | 'size' | 'theme' | 'align' | 'fillHeight' | 'variant' | 'aspectRatio'\n >;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Avatar';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<AvatarProps> = {\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Avatar component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Avatar: Comp<AvatarProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n actions,\n alt,\n badge,\n className,\n image,\n onClick,\n onKeyPress,\n size,\n theme,\n thumbnailProps,\n ...forwardedProps\n } = props;\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, size, theme }))}\n >\n <Thumbnail\n className={`${CLASSNAME}__thumbnail`}\n onClick={onClick}\n onKeyPress={onKeyPress}\n {...thumbnailProps}\n aspectRatio={AspectRatio.square}\n size={size}\n image={image}\n alt={alt}\n />\n {actions && <div className={`${CLASSNAME}__actions`}>{actions}</div>}\n {badge && <div className={`${CLASSNAME}__badge`}>{badge}</div>}\n </div>\n );\n});\nAvatar.displayName = COMPONENT_NAME;\nAvatar.className = CLASSNAME;\nAvatar.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","theme","Theme","light","Avatar","forwardRef","props","ref","actions","alt","badge","className","image","onClick","onKeyPress","thumbnailProps","forwardedProps","classNames","handleBasicClasses","prefix","AspectRatio","square","displayName","defaultProps"],"mappings":";;;;;;AAQA;;;;AAgCA;;;AAGA,IAAMA,cAAc,GAAG,QAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAmC,GAAG;AACxCC,EAAAA,IAAI,EAAEC,IAAI,CAACC,CAD6B;AAExCC,EAAAA,KAAK,EAAEC,KAAK,CAACC;AAF2B,CAA5C;AAKA;;;;;;;;IAOaC,MAAyC,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAE5EC,OAF4E,GAa5EF,KAb4E,CAE5EE,OAF4E;AAAA,MAG5EC,GAH4E,GAa5EH,KAb4E,CAG5EG,GAH4E;AAAA,MAI5EC,KAJ4E,GAa5EJ,KAb4E,CAI5EI,KAJ4E;AAAA,MAK5EC,SAL4E,GAa5EL,KAb4E,CAK5EK,SAL4E;AAAA,MAM5EC,KAN4E,GAa5EN,KAb4E,CAM5EM,KAN4E;AAAA,MAO5EC,OAP4E,GAa5EP,KAb4E,CAO5EO,OAP4E;AAAA,MAQ5EC,UAR4E,GAa5ER,KAb4E,CAQ5EQ,UAR4E;AAAA,MAS5EhB,IAT4E,GAa5EQ,KAb4E,CAS5ER,IAT4E;AAAA,MAU5EG,KAV4E,GAa5EK,KAb4E,CAU5EL,KAV4E;AAAA,MAW5Ec,cAX4E,GAa5ET,KAb4E,CAW5ES,cAX4E;AAAA,MAYzEC,cAZyE,4BAa5EV,KAb4E;;AAehF,SACI;AACI,IAAA,GAAG,EAAEC;AADT,KAEQS,cAFR;AAGI,IAAA,SAAS,EAAEC,UAAU,CAACN,SAAD,EAAYO,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAExB,SAAV;AAAqBG,MAAAA,IAAI,EAAJA,IAArB;AAA2BG,MAAAA,KAAK,EAALA;AAA3B,KAAD,CAA9B;AAHzB,MAKI,oBAAC,SAAD;AACI,IAAA,SAAS,YAAKN,SAAL,gBADb;AAEI,IAAA,OAAO,EAAEkB,OAFb;AAGI,IAAA,UAAU,EAAEC;AAHhB,KAIQC,cAJR;AAKI,IAAA,WAAW,EAAEK,WAAW,CAACC,MAL7B;AAMI,IAAA,IAAI,EAAEvB,IANV;AAOI,IAAA,KAAK,EAAEc,KAPX;AAQI,IAAA,GAAG,EAAEH;AART,KALJ,EAeKD,OAAO,IAAI;AAAK,IAAA,SAAS,YAAKb,SAAL;AAAd,KAA0Ca,OAA1C,CAfhB,EAgBKE,KAAK,IAAI;AAAK,IAAA,SAAS,YAAKf,SAAL;AAAd,KAAwCe,KAAxC,CAhBd,CADJ;AAoBH,CAnCkE;AAoCnEN,MAAM,CAACkB,WAAP,GAAqB5B,cAArB;AACAU,MAAM,CAACO,SAAP,GAAmBhB,SAAnB;AACAS,MAAM,CAACmB,YAAP,GAAsB1B,aAAtB;;;;"}
|
package/esm/_internal/Badge2.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { ColorPalette } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, b as _extends, d as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
5
|
|
|
5
6
|
/**
|
|
6
7
|
* Defines the props of the component.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Badge2.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import { Color, ColorPalette } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactNode } from 'react';\n\n/**\n * Defines the props of the component.\n */\nexport interface BadgeProps extends GenericProps {\n /** Badge content. */\n children?: ReactNode;\n /** Color variant. */\n color?: Color;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Badge';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<BadgeProps> = {\n color: ColorPalette.primary,\n};\n\n/**\n * Badge component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Badge: Comp<BadgeProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { children, className, color, ...forwardedProps } = props;\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, color }))}\n >\n {children}\n </div>\n );\n});\nBadge.displayName = COMPONENT_NAME;\nBadge.className = CLASSNAME;\nBadge.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","color","ColorPalette","primary","Badge","forwardRef","props","ref","children","className","forwardedProps","classNames","handleBasicClasses","prefix","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Badge2.js","sources":["../../../src/components/badge/Badge.tsx"],"sourcesContent":["import { Color, ColorPalette } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport classNames from 'classnames';\nimport React, { forwardRef, ReactNode } from 'react';\n\n/**\n * Defines the props of the component.\n */\nexport interface BadgeProps extends GenericProps {\n /** Badge content. */\n children?: ReactNode;\n /** Color variant. */\n color?: Color;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Badge';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<BadgeProps> = {\n color: ColorPalette.primary,\n};\n\n/**\n * Badge component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Badge: Comp<BadgeProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { children, className, color, ...forwardedProps } = props;\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(className, handleBasicClasses({ prefix: CLASSNAME, color }))}\n >\n {children}\n </div>\n );\n});\nBadge.displayName = COMPONENT_NAME;\nBadge.className = CLASSNAME;\nBadge.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","color","ColorPalette","primary","Badge","forwardRef","props","ref","children","className","forwardedProps","classNames","handleBasicClasses","prefix","displayName","defaultProps"],"mappings":";;;;;AAKA;;;;AAUA;;;AAGA,IAAMA,cAAc,GAAG,OAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAkC,GAAG;AACvCC,EAAAA,KAAK,EAAEC,YAAY,CAACC;AADmB,CAA3C;AAIA;;;;;;;;IAOaC,KAAuC,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MACtEC,QADsE,GACpBF,KADoB,CACtEE,QADsE;AAAA,MAC5DC,SAD4D,GACpBH,KADoB,CAC5DG,SAD4D;AAAA,MACjDR,KADiD,GACpBK,KADoB,CACjDL,KADiD;AAAA,MACvCS,cADuC,4BACpBJ,KADoB;;AAE9E,SACI;AACI,IAAA,GAAG,EAAEC;AADT,KAEQG,cAFR;AAGI,IAAA,SAAS,EAAEC,UAAU,CAACF,SAAD,EAAYG,kBAAkB,CAAC;AAAEC,MAAAA,MAAM,EAAEf,SAAV;AAAqBG,MAAAA,KAAK,EAALA;AAArB,KAAD,CAA9B;AAHzB,MAKKO,QALL,CADJ;AASH,CAXgE;AAYjEJ,KAAK,CAACU,WAAN,GAAoBjB,cAApB;AACAO,KAAK,CAACK,SAAN,GAAkBX,SAAlB;AACAM,KAAK,CAACW,YAAN,GAAqBf,aAArB;;;;"}
|
package/esm/_internal/Button2.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends, _ as _objectSpread2 } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Emphasis, Size, Theme } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, d as classnames, e as getBasicClass, b as _extends, c as _objectSpread2 } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, a as getBasicClass } from './getRootClassName.js';
|
|
4
5
|
import isEmpty from 'lodash/isEmpty';
|
|
5
6
|
import { B as ButtonRoot } from './ButtonRoot.js';
|
|
6
7
|
import { I as Icon } from './Icon2.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Button2.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\n\nimport { Emphasis, Icon, Size, Theme } from '@lumx/react';\nimport { Comp, getBasicClass, getRootClassName } from '@lumx/react/utils';\nimport { BaseButtonProps, ButtonRoot } from './ButtonRoot';\n\n/**\n * Button emphasis definition.\n * @deprecated Use Emphasis instead.\n */\nexport const ButtonEmphasis = Emphasis;\n\n/**\n * Defines the props of the component.\n */\nexport interface ButtonProps extends BaseButtonProps {\n /** Button content. */\n children?: ReactNode;\n /** Left icon (SVG path). */\n leftIcon?: string;\n /** Right icon (SVG path). */\n rightIcon?: string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Button';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ButtonProps> = {\n emphasis: Emphasis.high,\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Button component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Button: Comp<ButtonProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {\n const { children, className, emphasis, leftIcon, rightIcon, size, theme, ...forwardedProps } = props;\n\n const buttonClassName = classNames(\n className,\n getBasicClass({ prefix: CLASSNAME, type: 'hasLeftIcon', value: !isEmpty(leftIcon) }),\n getBasicClass({ prefix: CLASSNAME, type: 'hasRightIcon', value: !isEmpty(rightIcon) }),\n );\n\n return (\n <ButtonRoot\n ref={ref}\n {...{ emphasis, size, theme, ...forwardedProps }}\n className={buttonClassName}\n variant=\"button\"\n >\n {leftIcon && !isEmpty(leftIcon) && <Icon icon={leftIcon} />}\n {children && <span>{children}</span>}\n {rightIcon && !isEmpty(rightIcon) && <Icon icon={rightIcon} />}\n </ButtonRoot>\n );\n});\nButton.displayName = COMPONENT_NAME;\nButton.className = CLASSNAME;\nButton.defaultProps = DEFAULT_PROPS;\n"],"names":["ButtonEmphasis","Emphasis","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","emphasis","high","size","Size","m","theme","Theme","light","Button","forwardRef","props","ref","children","className","leftIcon","rightIcon","forwardedProps","buttonClassName","classNames","getBasicClass","prefix","type","value","isEmpty","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Button2.js","sources":["../../../src/components/button/Button.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\nimport isEmpty from 'lodash/isEmpty';\n\nimport { Emphasis, Icon, Size, Theme } from '@lumx/react';\nimport { Comp, getBasicClass, getRootClassName } from '@lumx/react/utils';\nimport { BaseButtonProps, ButtonRoot } from './ButtonRoot';\n\n/**\n * Button emphasis definition.\n * @deprecated Use Emphasis instead.\n */\nexport const ButtonEmphasis = Emphasis;\n\n/**\n * Defines the props of the component.\n */\nexport interface ButtonProps extends BaseButtonProps {\n /** Button content. */\n children?: ReactNode;\n /** Left icon (SVG path). */\n leftIcon?: string;\n /** Right icon (SVG path). */\n rightIcon?: string;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Button';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ButtonProps> = {\n emphasis: Emphasis.high,\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Button component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Button: Comp<ButtonProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {\n const { children, className, emphasis, leftIcon, rightIcon, size, theme, ...forwardedProps } = props;\n\n const buttonClassName = classNames(\n className,\n getBasicClass({ prefix: CLASSNAME, type: 'hasLeftIcon', value: !isEmpty(leftIcon) }),\n getBasicClass({ prefix: CLASSNAME, type: 'hasRightIcon', value: !isEmpty(rightIcon) }),\n );\n\n return (\n <ButtonRoot\n ref={ref}\n {...{ emphasis, size, theme, ...forwardedProps }}\n className={buttonClassName}\n variant=\"button\"\n >\n {leftIcon && !isEmpty(leftIcon) && <Icon icon={leftIcon} />}\n {children && <span>{children}</span>}\n {rightIcon && !isEmpty(rightIcon) && <Icon icon={rightIcon} />}\n </ButtonRoot>\n );\n});\nButton.displayName = COMPONENT_NAME;\nButton.className = CLASSNAME;\nButton.defaultProps = DEFAULT_PROPS;\n"],"names":["ButtonEmphasis","Emphasis","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","emphasis","high","size","Size","m","theme","Theme","light","Button","forwardRef","props","ref","children","className","leftIcon","rightIcon","forwardedProps","buttonClassName","classNames","getBasicClass","prefix","type","value","isEmpty","displayName","defaultProps"],"mappings":";;;;;;;;AASA;;;;;IAIaA,cAAc,GAAGC;AAE9B;;;;AAYA;;;AAGA,IAAMC,cAAc,GAAG,QAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAmC,GAAG;AACxCC,EAAAA,QAAQ,EAAEL,QAAQ,CAACM,IADqB;AAExCC,EAAAA,IAAI,EAAEC,IAAI,CAACC,CAF6B;AAGxCC,EAAAA,KAAK,EAAEC,KAAK,CAACC;AAH2B,CAA5C;AAMA;;;;;;;;IAOaC,MAAgE,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC/FC,QAD+F,GACRF,KADQ,CAC/FE,QAD+F;AAAA,MACrFC,SADqF,GACRH,KADQ,CACrFG,SADqF;AAAA,MAC1Eb,QAD0E,GACRU,KADQ,CAC1EV,QAD0E;AAAA,MAChEc,QADgE,GACRJ,KADQ,CAChEI,QADgE;AAAA,MACtDC,SADsD,GACRL,KADQ,CACtDK,SADsD;AAAA,MAC3Cb,IAD2C,GACRQ,KADQ,CAC3CR,IAD2C;AAAA,MACrCG,KADqC,GACRK,KADQ,CACrCL,KADqC;AAAA,MAC3BW,cAD2B,4BACRN,KADQ;;AAGvG,MAAMO,eAAe,GAAGC,UAAU,CAC9BL,SAD8B,EAE9BM,aAAa,CAAC;AAAEC,IAAAA,MAAM,EAAEvB,SAAV;AAAqBwB,IAAAA,IAAI,EAAE,aAA3B;AAA0CC,IAAAA,KAAK,EAAE,CAACC,OAAO,CAACT,QAAD;AAAzD,GAAD,CAFiB,EAG9BK,aAAa,CAAC;AAAEC,IAAAA,MAAM,EAAEvB,SAAV;AAAqBwB,IAAAA,IAAI,EAAE,cAA3B;AAA2CC,IAAAA,KAAK,EAAE,CAACC,OAAO,CAACR,SAAD;AAA1D,GAAD,CAHiB,CAAlC;AAMA,SACI,oBAAC,UAAD;AACI,IAAA,GAAG,EAAEJ;AADT;AAEUX,IAAAA,QAAQ,EAARA,QAFV;AAEoBE,IAAAA,IAAI,EAAJA,IAFpB;AAE0BG,IAAAA,KAAK,EAALA;AAF1B,KAEoCW,cAFpC;AAGI,IAAA,SAAS,EAAEC,eAHf;AAII,IAAA,OAAO,EAAC;AAJZ,MAMKH,QAAQ,IAAI,CAACS,OAAO,CAACT,QAAD,CAApB,IAAkC,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEA;AAAZ,IANvC,EAOKF,QAAQ,IAAI,kCAAOA,QAAP,CAPjB,EAQKG,SAAS,IAAI,CAACQ,OAAO,CAACR,SAAD,CAArB,IAAoC,oBAAC,IAAD;AAAM,IAAA,IAAI,EAAEA;AAAZ,IARzC,CADJ;AAYH,CArByF;AAsB1FP,MAAM,CAACgB,WAAP,GAAqB5B,cAArB;AACAY,MAAM,CAACK,SAAP,GAAmBhB,SAAnB;AACAW,MAAM,CAACiB,YAAP,GAAsB1B,aAAtB;;;;"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import React, { forwardRef } from 'react';
|
|
3
|
+
import { g as getRootClassName, c as classnames } from './getRootClassName.js';
|
|
3
4
|
import 'lodash/isBoolean';
|
|
4
5
|
import 'lodash/isEmpty';
|
|
5
6
|
import 'lodash/kebabCase';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonGroup.js","sources":["../../../src/components/button/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component\n */\nexport type ButtonGroupProps = GenericProps;\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ButtonGroupProps> = {};\n\n/**\n * ButtonGroup component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonGroup: Comp<ButtonGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n {children}\n </div>\n );\n});\nButtonGroup.displayName = COMPONENT_NAME;\nButtonGroup.className = CLASSNAME;\nButtonGroup.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","ButtonGroup","forwardRef","props","ref","children","className","forwardedProps","classNames","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ButtonGroup.js","sources":["../../../src/components/button/ButtonGroup.tsx"],"sourcesContent":["import React, { forwardRef } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component\n */\nexport type ButtonGroupProps = GenericProps;\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ButtonGroupProps> = {};\n\n/**\n * ButtonGroup component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonGroup: Comp<ButtonGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { children, className, ...forwardedProps } = props;\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, CLASSNAME)}>\n {children}\n </div>\n );\n});\nButtonGroup.displayName = COMPONENT_NAME;\nButtonGroup.className = CLASSNAME;\nButtonGroup.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","ButtonGroup","forwardRef","props","ref","children","className","forwardedProps","classNames","displayName","defaultProps"],"mappings":";;;;;;;;AAMA;;;;AAKA;;;AAGA,IAAMA,cAAc,GAAG,aAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;AAGA,IAAMG,aAAwC,GAAG,EAAjD;AAEA;;;;;;;;IAOaC,WAAmD,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAClFC,QADkF,GACvCF,KADuC,CAClFE,QADkF;AAAA,MACxEC,SADwE,GACvCH,KADuC,CACxEG,SADwE;AAAA,MAC1DC,cAD0D,4BACvCJ,KADuC;;AAG1F,SACI;AAAK,IAAA,GAAG,EAAEC;AAAV,KAAmBG,cAAnB;AAAmC,IAAA,SAAS,EAAEC,UAAU,CAACF,SAAD,EAAYR,SAAZ;AAAxD,MACKO,QADL,CADJ;AAKH,CAR4E;AAS7EJ,WAAW,CAACQ,WAAZ,GAA0BZ,cAA1B;AACAI,WAAW,CAACK,SAAZ,GAAwBR,SAAxB;AACAG,WAAW,CAACS,YAAZ,GAA2BV,aAA3B;;;;"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, _ as _objectSpread2, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Emphasis, ColorPalette, Theme } from './components.js';
|
|
2
|
-
import { a as _objectWithoutProperties, c as _objectSpread2, d as classnames, h as handleBasicClasses, b as _extends, C as CSS_PREFIX } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef } from 'react';
|
|
4
|
+
import { c as classnames, h as handleBasicClasses, C as CSS_PREFIX } from './getRootClassName.js';
|
|
4
5
|
import isEmpty from 'lodash/isEmpty';
|
|
5
6
|
import { r as renderLink } from './renderLink.js';
|
|
6
7
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonRoot.js","sources":["../../../src/components/button/ButtonRoot.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, DetailedHTMLProps, forwardRef, RefObject } from 'react';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport classNames from 'classnames';\n\nimport { Color, ColorPalette, Emphasis, Size, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses } from '@lumx/react/utils';\nimport { renderLink } from '@lumx/react/utils/renderLink';\n\ntype HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\n/**\n * Button size definition.\n */\nexport type ButtonSize = Extract<Size, 's' | 'm'>;\n\nexport interface BaseButtonProps extends GenericProps {\n /** ARIA button label. */\n ['aria-label']?: string;\n /** Color variant. */\n color?: Color;\n /** Emphasis variant. */\n emphasis?: Emphasis;\n /** Whether or not the button has a background color in low emphasis. */\n hasBackground?: boolean;\n /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */\n href?: string;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Native button name property. */\n name?: string;\n /** Size variant. */\n size?: ButtonSize;\n /** Native anchor target property. */\n target?: '_self' | '_blank' | '_parent' | '_top';\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Native button type. */\n type?: HTMLButtonProps['type'];\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\nexport interface ButtonRootProps extends BaseButtonProps {\n variant: 'button' | 'icon';\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonRoot';\n\nexport const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;\nexport const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;\n\n/**\n * Render a button wrapper with the ButtonRoot inside.\n *\n * @param props Component props.\n * @return React element.\n */\nconst renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {\n const { color, emphasis, variant } = props;\n\n const adaptedColor =\n emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);\n\n const wrapperClassName = classNames(\n handleBasicClasses({\n color: adaptedColor,\n prefix: BUTTON_WRAPPER_CLASSNAME,\n variant,\n }),\n );\n const buttonProps = { ...props, hasBackground: false };\n\n return (\n <div className={wrapperClassName}>\n {/* eslint-disable-next-line @typescript-eslint/no-use-before-define */}\n <ButtonRoot {...buttonProps} />\n </div>\n );\n};\n\n/**\n * ButtonRoot component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonRoot: Comp<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n 'aria-label': ariaLabel,\n children,\n className,\n color,\n disabled,\n emphasis,\n hasBackground,\n href,\n isDisabled = disabled,\n isSelected,\n linkAs,\n name,\n size,\n target,\n theme,\n variant,\n type = 'button',\n ...forwardedProps\n } = props;\n\n const adaptedColor =\n color ||\n (emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light) ||\n (emphasis === Emphasis.high && ColorPalette.primary) ||\n ColorPalette.dark;\n\n if (hasBackground) {\n return renderButtonWrapper({ ...props, ref, variant, color: adaptedColor });\n }\n\n const buttonClassName = classNames(\n className,\n handleBasicClasses({\n color: adaptedColor,\n emphasis,\n isSelected,\n isDisabled,\n prefix: BUTTON_CLASSNAME,\n size,\n theme: emphasis === Emphasis.high && theme,\n variant,\n }),\n );\n\n /**\n * If the linkAs prop is used, we use the linkAs component instead of a <button>.\n * If there is an href attribute, we display an <a> instead of a <button>.\n *\n * However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.\n */\n if ((linkAs || !isEmpty(props.href)) && !isDisabled) {\n return renderLink(\n {\n linkAs,\n ...forwardedProps,\n 'aria-label': ariaLabel,\n href,\n target,\n className: buttonClassName,\n ref: ref as RefObject<HTMLAnchorElement>,\n },\n children,\n );\n }\n return (\n <button\n {...forwardedProps}\n disabled={isDisabled}\n aria-disabled={isDisabled}\n aria-label={ariaLabel}\n ref={ref as RefObject<HTMLButtonElement>}\n className={buttonClassName}\n name={name}\n type={\n // eslint-disable-next-line react/button-has-type\n type\n }\n >\n {children}\n </button>\n );\n});\nButtonRoot.displayName = COMPONENT_NAME;\nButtonRoot.defaultProps = {};\n"],"names":["COMPONENT_NAME","BUTTON_WRAPPER_CLASSNAME","CSS_PREFIX","BUTTON_CLASSNAME","renderButtonWrapper","props","color","emphasis","variant","adaptedColor","Emphasis","low","ColorPalette","light","dark","wrapperClassName","classNames","handleBasicClasses","prefix","buttonProps","hasBackground","ButtonRoot","forwardRef","ref","ariaLabel","children","className","disabled","href","isDisabled","isSelected","linkAs","name","size","target","theme","type","forwardedProps","high","Theme","primary","buttonClassName","isEmpty","renderLink","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ButtonRoot.js","sources":["../../../src/components/button/ButtonRoot.tsx"],"sourcesContent":["import React, { ButtonHTMLAttributes, DetailedHTMLProps, forwardRef, RefObject } from 'react';\n\nimport isEmpty from 'lodash/isEmpty';\n\nimport classNames from 'classnames';\n\nimport { Color, ColorPalette, Emphasis, Size, Theme } from '@lumx/react';\nimport { CSS_PREFIX } from '@lumx/react/constants';\nimport { Comp, GenericProps, handleBasicClasses } from '@lumx/react/utils';\nimport { renderLink } from '@lumx/react/utils/renderLink';\n\ntype HTMLButtonProps = DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>;\n\n/**\n * Button size definition.\n */\nexport type ButtonSize = Extract<Size, 's' | 'm'>;\n\nexport interface BaseButtonProps extends GenericProps {\n /** ARIA button label. */\n ['aria-label']?: string;\n /** Color variant. */\n color?: Color;\n /** Emphasis variant. */\n emphasis?: Emphasis;\n /** Whether or not the button has a background color in low emphasis. */\n hasBackground?: boolean;\n /** Native anchor href property. It determines whether the Button will be a <button> or an <a>. */\n href?: string;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Native button name property. */\n name?: string;\n /** Size variant. */\n size?: ButtonSize;\n /** Native anchor target property. */\n target?: '_self' | '_blank' | '_parent' | '_top';\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Native button type. */\n type?: HTMLButtonProps['type'];\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\nexport interface ButtonRootProps extends BaseButtonProps {\n variant: 'button' | 'icon';\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ButtonRoot';\n\nexport const BUTTON_WRAPPER_CLASSNAME = `${CSS_PREFIX}-button-wrapper`;\nexport const BUTTON_CLASSNAME = `${CSS_PREFIX}-button`;\n\n/**\n * Render a button wrapper with the ButtonRoot inside.\n *\n * @param props Component props.\n * @return React element.\n */\nconst renderButtonWrapper: React.FC<ButtonRootProps> = (props) => {\n const { color, emphasis, variant } = props;\n\n const adaptedColor =\n emphasis === Emphasis.low && (color === ColorPalette.light ? ColorPalette.dark : ColorPalette.light);\n\n const wrapperClassName = classNames(\n handleBasicClasses({\n color: adaptedColor,\n prefix: BUTTON_WRAPPER_CLASSNAME,\n variant,\n }),\n );\n const buttonProps = { ...props, hasBackground: false };\n\n return (\n <div className={wrapperClassName}>\n {/* eslint-disable-next-line @typescript-eslint/no-use-before-define */}\n <ButtonRoot {...buttonProps} />\n </div>\n );\n};\n\n/**\n * ButtonRoot component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const ButtonRoot: Comp<ButtonRootProps, HTMLButtonElement | HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n 'aria-label': ariaLabel,\n children,\n className,\n color,\n disabled,\n emphasis,\n hasBackground,\n href,\n isDisabled = disabled,\n isSelected,\n linkAs,\n name,\n size,\n target,\n theme,\n variant,\n type = 'button',\n ...forwardedProps\n } = props;\n\n const adaptedColor =\n color ||\n (emphasis !== Emphasis.high && theme === Theme.dark && ColorPalette.light) ||\n (emphasis === Emphasis.high && ColorPalette.primary) ||\n ColorPalette.dark;\n\n if (hasBackground) {\n return renderButtonWrapper({ ...props, ref, variant, color: adaptedColor });\n }\n\n const buttonClassName = classNames(\n className,\n handleBasicClasses({\n color: adaptedColor,\n emphasis,\n isSelected,\n isDisabled,\n prefix: BUTTON_CLASSNAME,\n size,\n theme: emphasis === Emphasis.high && theme,\n variant,\n }),\n );\n\n /**\n * If the linkAs prop is used, we use the linkAs component instead of a <button>.\n * If there is an href attribute, we display an <a> instead of a <button>.\n *\n * However, in any case, if the component is disabled, we returned a <button> since disabled is not compatible with <a>.\n */\n if ((linkAs || !isEmpty(props.href)) && !isDisabled) {\n return renderLink(\n {\n linkAs,\n ...forwardedProps,\n 'aria-label': ariaLabel,\n href,\n target,\n className: buttonClassName,\n ref: ref as RefObject<HTMLAnchorElement>,\n },\n children,\n );\n }\n return (\n <button\n {...forwardedProps}\n disabled={isDisabled}\n aria-disabled={isDisabled}\n aria-label={ariaLabel}\n ref={ref as RefObject<HTMLButtonElement>}\n className={buttonClassName}\n name={name}\n type={\n // eslint-disable-next-line react/button-has-type\n type\n }\n >\n {children}\n </button>\n );\n});\nButtonRoot.displayName = COMPONENT_NAME;\nButtonRoot.defaultProps = {};\n"],"names":["COMPONENT_NAME","BUTTON_WRAPPER_CLASSNAME","CSS_PREFIX","BUTTON_CLASSNAME","renderButtonWrapper","props","color","emphasis","variant","adaptedColor","Emphasis","low","ColorPalette","light","dark","wrapperClassName","classNames","handleBasicClasses","prefix","buttonProps","hasBackground","ButtonRoot","forwardRef","ref","ariaLabel","children","className","disabled","href","isDisabled","isSelected","linkAs","name","size","target","theme","type","forwardedProps","high","Theme","primary","buttonClassName","isEmpty","renderLink","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Theme } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, b as _extends, d as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
3
3
|
import React, { forwardRef, useMemo } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses } from './getRootClassName.js';
|
|
4
5
|
import { e as mdiCheck } from './mdi.js';
|
|
5
6
|
import { u as uid } from '../index2.js';
|
|
6
7
|
import { I as Icon } from './Icon2.js';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox2.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useMemo, forwardRef, ReactNode, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { mdiCheck } from '@lumx/icons';\n\nimport { Icon, InputHelper, InputLabel, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface CheckboxProps extends GenericProps {\n /** Helper text. */\n helper?: string;\n /** Native input id property. */\n id?: string;\n /** Whether it is checked or not. */\n isChecked?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Label text. */\n label?: ReactNode;\n /** Native input name property. */\n name?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Native input value property. */\n value?: string;\n /** On change callback. */\n onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Checkbox';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<CheckboxProps> = {\n theme: Theme.light,\n};\n\n/**\n * Checkbox component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Checkbox: Comp<CheckboxProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n checked,\n className,\n disabled,\n helper,\n id,\n isChecked = checked,\n isDisabled = disabled,\n label,\n name,\n onChange,\n theme,\n value,\n ...forwardedProps\n } = props;\n const inputId = useMemo(() => id || `${CLASSNAME.toLowerCase()}-${uid()}`, [id]);\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(!isChecked, value, name, event);\n }\n };\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n isChecked,\n isDisabled,\n isUnchecked: !isChecked,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n <div className={`${CLASSNAME}__input-wrapper`}>\n <input\n type=\"checkbox\"\n id={inputId}\n className={`${CLASSNAME}__input-native`}\n tabIndex={isDisabled ? -1 : 0}\n name={name}\n value={value}\n checked={isChecked}\n onChange={handleChange}\n />\n\n <div className={`${CLASSNAME}__input-placeholder`}>\n <div className={`${CLASSNAME}__input-background`} />\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiCheck} />\n </div>\n </div>\n </div>\n\n <div className={`${CLASSNAME}__content`}>\n {label && (\n <InputLabel htmlFor={inputId} className={`${CLASSNAME}__label`} theme={theme}>\n {label}\n </InputLabel>\n )}\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n </div>\n );\n});\nCheckbox.displayName = COMPONENT_NAME;\nCheckbox.className = CLASSNAME;\nCheckbox.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","Checkbox","forwardRef","props","ref","checked","className","disabled","helper","id","isChecked","isDisabled","label","name","onChange","value","forwardedProps","inputId","useMemo","toLowerCase","uid","handleChange","event","classNames","handleBasicClasses","isUnchecked","prefix","mdiCheck","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Checkbox2.js","sources":["../../../src/components/checkbox/Checkbox.tsx"],"sourcesContent":["import React, { useMemo, forwardRef, ReactNode, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { mdiCheck } from '@lumx/icons';\n\nimport { Icon, InputHelper, InputLabel, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\n/**\n * Defines the props of the component.\n */\nexport interface CheckboxProps extends GenericProps {\n /** Helper text. */\n helper?: string;\n /** Native input id property. */\n id?: string;\n /** Whether it is checked or not. */\n isChecked?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Label text. */\n label?: ReactNode;\n /** Native input name property. */\n name?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Native input value property. */\n value?: string;\n /** On change callback. */\n onChange?(isChecked: boolean, value?: string, name?: string, event?: SyntheticEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Checkbox';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<CheckboxProps> = {\n theme: Theme.light,\n};\n\n/**\n * Checkbox component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Checkbox: Comp<CheckboxProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n checked,\n className,\n disabled,\n helper,\n id,\n isChecked = checked,\n isDisabled = disabled,\n label,\n name,\n onChange,\n theme,\n value,\n ...forwardedProps\n } = props;\n const inputId = useMemo(() => id || `${CLASSNAME.toLowerCase()}-${uid()}`, [id]);\n\n const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n if (onChange) {\n onChange(!isChecked, value, name, event);\n }\n };\n\n return (\n <div\n ref={ref}\n {...forwardedProps}\n className={classNames(\n className,\n handleBasicClasses({\n isChecked,\n isDisabled,\n isUnchecked: !isChecked,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n <div className={`${CLASSNAME}__input-wrapper`}>\n <input\n type=\"checkbox\"\n id={inputId}\n className={`${CLASSNAME}__input-native`}\n tabIndex={isDisabled ? -1 : 0}\n name={name}\n value={value}\n checked={isChecked}\n onChange={handleChange}\n />\n\n <div className={`${CLASSNAME}__input-placeholder`}>\n <div className={`${CLASSNAME}__input-background`} />\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiCheck} />\n </div>\n </div>\n </div>\n\n <div className={`${CLASSNAME}__content`}>\n {label && (\n <InputLabel htmlFor={inputId} className={`${CLASSNAME}__label`} theme={theme}>\n {label}\n </InputLabel>\n )}\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n </div>\n );\n});\nCheckbox.displayName = COMPONENT_NAME;\nCheckbox.className = CLASSNAME;\nCheckbox.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","Checkbox","forwardRef","props","ref","checked","className","disabled","helper","id","isChecked","isDisabled","label","name","onChange","value","forwardedProps","inputId","useMemo","toLowerCase","uid","handleChange","event","classNames","handleBasicClasses","isUnchecked","prefix","mdiCheck","displayName","defaultProps"],"mappings":"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"}
|
package/esm/_internal/Chip2.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { b as _objectWithoutProperties, c as _extends, a as _defineProperty } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Size, Theme, ColorPalette } from './components.js';
|
|
2
|
-
import { g as getRootClassName, a as _objectWithoutProperties, b as _extends, d as classnames, h as handleBasicClasses, o as onEnterPressed, _ as _defineProperty } from './getRootClassName.js';
|
|
3
3
|
import React, { useCallback, forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, c as classnames, h as handleBasicClasses, o as onEnterPressed } from './getRootClassName.js';
|
|
4
5
|
import isFunction from 'lodash/isFunction';
|
|
5
6
|
|
|
6
7
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Chip2.js","sources":["../../../src/hooks/useStopPropagation.ts","../../../src/components/chip/Chip.tsx"],"sourcesContent":["import isFunction from 'lodash/isFunction';\nimport { MouseEventHandler, useCallback } from 'react';\n\n/**\n * Wrap mouse event handler to stop event propagation.\n *\n * @param handler The mouse handler to wrap.\n * @return Mouse handler stopping propagation.\n */\nexport function useStopPropagation(handler?: MouseEventHandler): MouseEventHandler {\n return useCallback(\n (evt) => {\n if (!evt || !isFunction(handler)) {\n return;\n }\n handler(evt);\n evt.stopPropagation();\n },\n [handler],\n );\n}\n","import { Color, ColorPalette, Size, Theme } from '@lumx/react';\nimport { useStopPropagation } from '@lumx/react/hooks/useStopPropagation';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, onEnterPressed } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\n\nimport isFunction from 'lodash/isFunction';\nimport React, { forwardRef, MouseEventHandler, ReactNode } from 'react';\n\n/**\n * Chip sizes.\n */\ntype ChipSize = Extract<Size, 's' | 'm'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipProps extends GenericProps {\n /** A component to be rendered after the content. */\n after?: ReactNode;\n /** A component to be rendered before the content. */\n before?: ReactNode;\n /** Color variant. */\n color?: Color;\n /** Whether the component is clickable or not. */\n isClickable?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the chip is currently in a highlighted state or not. */\n isHighlighted?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Size variant. */\n size?: ChipSize;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** On \"after\" element clicked callback. */\n onAfterClick?: MouseEventHandler;\n /** On \"before\" element clicked callback. */\n onBeforeClick?: MouseEventHandler;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Chip';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipProps> = {\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Chip component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Chip: Comp<ChipProps, HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n after,\n before,\n children,\n className,\n color,\n disabled,\n isClickable,\n isDisabled = disabled,\n isHighlighted,\n isSelected,\n onAfterClick,\n onBeforeClick,\n onClick,\n size,\n theme,\n ...forwardedProps\n } = props;\n const hasAfterClick = isFunction(onAfterClick);\n const hasBeforeClick = isFunction(onBeforeClick);\n const hasOnClick = isFunction(onClick);\n\n // Adapt color to the theme.\n const chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);\n\n const handleOnBeforeClick = useStopPropagation(onBeforeClick);\n const handleOnAfterClick = useStopPropagation(onAfterClick);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <a\n {...forwardedProps}\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n clickable: Boolean(hasOnClick) || isClickable,\n color: chipColor,\n isDisabled,\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n highlighted: Boolean(isHighlighted),\n prefix: CLASSNAME,\n selected: Boolean(isSelected),\n size,\n unselected: Boolean(!isSelected),\n }),\n )}\n role={hasOnClick ? 'button' : undefined}\n tabIndex={isDisabled || !hasOnClick ? -1 : 0}\n aria-disabled={(hasOnClick && isDisabled) || undefined}\n onClick={hasOnClick ? onClick : undefined}\n onKeyDown={hasOnClick ? onEnterPressed(onClick) : undefined}\n >\n {before && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__before`, {\n [`${CLASSNAME}__before--is-clickable`]: hasBeforeClick,\n })}\n onClick={handleOnBeforeClick}\n >\n {before}\n </div>\n )}\n\n <div className={`${CLASSNAME}__label`}>{children}</div>\n\n {after && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__after`, {\n [`${CLASSNAME}__after--is-clickable`]: hasAfterClick,\n })}\n onClick={handleOnAfterClick}\n >\n {after}\n </div>\n )}\n </a>\n );\n});\nChip.displayName = COMPONENT_NAME;\nChip.className = CLASSNAME;\nChip.defaultProps = DEFAULT_PROPS;\n"],"names":["useStopPropagation","handler","useCallback","evt","isFunction","stopPropagation","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","theme","Theme","light","Chip","forwardRef","props","ref","after","before","children","className","color","disabled","isClickable","isDisabled","isHighlighted","isSelected","onAfterClick","onBeforeClick","onClick","forwardedProps","hasAfterClick","hasBeforeClick","hasOnClick","chipColor","ColorPalette","dark","handleOnBeforeClick","handleOnAfterClick","classNames","handleBasicClasses","clickable","Boolean","hasAfter","hasBefore","highlighted","prefix","selected","unselected","undefined","onEnterPressed","displayName","defaultProps"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Chip2.js","sources":["../../../src/hooks/useStopPropagation.ts","../../../src/components/chip/Chip.tsx"],"sourcesContent":["import isFunction from 'lodash/isFunction';\nimport { MouseEventHandler, useCallback } from 'react';\n\n/**\n * Wrap mouse event handler to stop event propagation.\n *\n * @param handler The mouse handler to wrap.\n * @return Mouse handler stopping propagation.\n */\nexport function useStopPropagation(handler?: MouseEventHandler): MouseEventHandler {\n return useCallback(\n (evt) => {\n if (!evt || !isFunction(handler)) {\n return;\n }\n handler(evt);\n evt.stopPropagation();\n },\n [handler],\n );\n}\n","import { Color, ColorPalette, Size, Theme } from '@lumx/react';\nimport { useStopPropagation } from '@lumx/react/hooks/useStopPropagation';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses, onEnterPressed } from '@lumx/react/utils';\n\nimport classNames from 'classnames';\n\nimport isFunction from 'lodash/isFunction';\nimport React, { forwardRef, MouseEventHandler, ReactNode } from 'react';\n\n/**\n * Chip sizes.\n */\ntype ChipSize = Extract<Size, 's' | 'm'>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipProps extends GenericProps {\n /** A component to be rendered after the content. */\n after?: ReactNode;\n /** A component to be rendered before the content. */\n before?: ReactNode;\n /** Color variant. */\n color?: Color;\n /** Whether the component is clickable or not. */\n isClickable?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the chip is currently in a highlighted state or not. */\n isHighlighted?: boolean;\n /** Whether the component is selected or not. */\n isSelected?: boolean;\n /** Size variant. */\n size?: ChipSize;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** On \"after\" element clicked callback. */\n onAfterClick?: MouseEventHandler;\n /** On \"before\" element clicked callback. */\n onBeforeClick?: MouseEventHandler;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Chip';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipProps> = {\n size: Size.m,\n theme: Theme.light,\n};\n\n/**\n * Chip component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Chip: Comp<ChipProps, HTMLAnchorElement> = forwardRef((props, ref) => {\n const {\n after,\n before,\n children,\n className,\n color,\n disabled,\n isClickable,\n isDisabled = disabled,\n isHighlighted,\n isSelected,\n onAfterClick,\n onBeforeClick,\n onClick,\n size,\n theme,\n ...forwardedProps\n } = props;\n const hasAfterClick = isFunction(onAfterClick);\n const hasBeforeClick = isFunction(onBeforeClick);\n const hasOnClick = isFunction(onClick);\n\n // Adapt color to the theme.\n const chipColor = color || (theme === Theme.light ? ColorPalette.dark : ColorPalette.light);\n\n const handleOnBeforeClick = useStopPropagation(onBeforeClick);\n const handleOnAfterClick = useStopPropagation(onAfterClick);\n\n return (\n // eslint-disable-next-line jsx-a11y/no-static-element-interactions\n <a\n {...forwardedProps}\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n clickable: Boolean(hasOnClick) || isClickable,\n color: chipColor,\n isDisabled,\n hasAfter: Boolean(after),\n hasBefore: Boolean(before),\n highlighted: Boolean(isHighlighted),\n prefix: CLASSNAME,\n selected: Boolean(isSelected),\n size,\n unselected: Boolean(!isSelected),\n }),\n )}\n role={hasOnClick ? 'button' : undefined}\n tabIndex={isDisabled || !hasOnClick ? -1 : 0}\n aria-disabled={(hasOnClick && isDisabled) || undefined}\n onClick={hasOnClick ? onClick : undefined}\n onKeyDown={hasOnClick ? onEnterPressed(onClick) : undefined}\n >\n {before && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__before`, {\n [`${CLASSNAME}__before--is-clickable`]: hasBeforeClick,\n })}\n onClick={handleOnBeforeClick}\n >\n {before}\n </div>\n )}\n\n <div className={`${CLASSNAME}__label`}>{children}</div>\n\n {after && (\n // eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions\n <div\n className={classNames(`${CLASSNAME}__after`, {\n [`${CLASSNAME}__after--is-clickable`]: hasAfterClick,\n })}\n onClick={handleOnAfterClick}\n >\n {after}\n </div>\n )}\n </a>\n );\n});\nChip.displayName = COMPONENT_NAME;\nChip.className = CLASSNAME;\nChip.defaultProps = DEFAULT_PROPS;\n"],"names":["useStopPropagation","handler","useCallback","evt","isFunction","stopPropagation","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","size","Size","m","theme","Theme","light","Chip","forwardRef","props","ref","after","before","children","className","color","disabled","isClickable","isDisabled","isHighlighted","isSelected","onAfterClick","onBeforeClick","onClick","forwardedProps","hasAfterClick","hasBeforeClick","hasOnClick","chipColor","ColorPalette","dark","handleOnBeforeClick","handleOnAfterClick","classNames","handleBasicClasses","clickable","Boolean","hasAfter","hasBefore","highlighted","prefix","selected","unselected","undefined","onEnterPressed","displayName","defaultProps"],"mappings":"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"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
+
import { d as _slicedToArray, b as _objectWithoutProperties, c as _extends } from './_rollupPluginBabelHelpers.js';
|
|
1
2
|
import { Alignment } from './components.js';
|
|
2
|
-
import { f as _slicedToArray, g as getRootClassName, a as _objectWithoutProperties, h as handleBasicClasses, b as _extends, d as classnames } from './getRootClassName.js';
|
|
3
3
|
import React, { useState, forwardRef } from 'react';
|
|
4
|
+
import { g as getRootClassName, h as handleBasicClasses, c as classnames } from './getRootClassName.js';
|
|
4
5
|
|
|
5
6
|
var INITIAL_STATE_ACTIVE_CHIP = -1;
|
|
6
7
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChipGroup.js","sources":["../../../src/hooks/useChipGroupNavigation.tsx","../../../src/components/chip/ChipGroup.tsx"],"sourcesContent":["import { useState } from 'react';\n\ninterface UseChipGroupNavigation {\n /** the current active chip index */\n activeChip: number;\n\n /** callback to be executed when the backspace was pressed */\n onBackspacePressed(): void;\n\n /** function that allows to reset the navigation */\n resetChipNavigation(): void;\n}\n\nexport type useChipGroupNavigationType<C = any> = (\n chips: C[],\n onChipDeleted: (chip: C) => void,\n initialActiveChip?: number,\n) => UseChipGroupNavigation;\n\nconst INITIAL_STATE_ACTIVE_CHIP = -1;\n\n/**\n * Hook that provides the necessary information to manage chips navigation.\n * @param chips List of chips selected.\n * @param onChipDeleted Callback executed when a chip must be eliminated.\n * @param initialActiveChip Initial active chip index.\n *\n * @return chip navigation tools.\n */\nexport const useChipGroupNavigation: useChipGroupNavigationType = (\n chips,\n onChipDeleted,\n initialActiveChip = INITIAL_STATE_ACTIVE_CHIP,\n) => {\n const [wasBackspacePressed, setWasBackspacePressed] = useState(false);\n const [activeChip, setActiveChip] = useState(initialActiveChip);\n\n /**\n * Resets the active index and backspace control to their initial state\n */\n const resetChipNavigation = () => {\n setWasBackspacePressed(false);\n setActiveChip(initialActiveChip);\n };\n\n /**\n * Callback to be executed when the backspace was pressed. If there are no chips\n * selected, it will return immediately. If there are it will check if the\n * backspace was already pressed. if it was, it means that the user wants to eliminate\n * the chip, so we execute the `onChipDeleted` function and reset internal state.\n *\n * If it was not pressed before, we set the `wasBackspacePressed` flag to true and\n * highlight the last chip.\n */\n const onBackspacePressed = () => {\n if (chips.length === 0) {\n return;\n }\n\n if (wasBackspacePressed) {\n const chipDeleted: any = chips[chips.length - 1];\n onChipDeleted(chipDeleted);\n resetChipNavigation();\n } else {\n setActiveChip(chips.length - 1);\n setWasBackspacePressed(true);\n }\n };\n\n return {\n activeChip,\n onBackspacePressed,\n resetChipNavigation,\n };\n};\n","import { Alignment, HorizontalAlignment } from '@lumx/react/components';\nimport React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { useChipGroupNavigation } from '@lumx/react/hooks/useChipGroupNavigation';\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipGroupProps extends GenericProps {\n /** Chip horizontal alignment. */\n align?: HorizontalAlignment;\n /** List of Chip. */\n children: ReactNode;\n}\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipGroupProps> = {\n align: Alignment.left,\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ChipGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * ChipGroup component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nconst InternalChipGroup: Comp<ChipGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { align, children, className, ...forwardedProps } = props;\n const chipGroupClassName = handleBasicClasses({\n align,\n prefix: CLASSNAME,\n });\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, chipGroupClassName)}>\n {children}\n </div>\n );\n});\nInternalChipGroup.displayName = COMPONENT_NAME;\nInternalChipGroup.className = CLASSNAME;\nInternalChipGroup.defaultProps = DEFAULT_PROPS;\n\nexport const ChipGroup = Object.assign(InternalChipGroup, { useChipGroupNavigation });\n"],"names":["INITIAL_STATE_ACTIVE_CHIP","useChipGroupNavigation","chips","onChipDeleted","initialActiveChip","useState","wasBackspacePressed","setWasBackspacePressed","activeChip","setActiveChip","resetChipNavigation","onBackspacePressed","length","chipDeleted","DEFAULT_PROPS","align","Alignment","left","COMPONENT_NAME","CLASSNAME","getRootClassName","InternalChipGroup","forwardRef","props","ref","children","className","forwardedProps","chipGroupClassName","handleBasicClasses","prefix","classNames","displayName","defaultProps","ChipGroup","Object","assign"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ChipGroup.js","sources":["../../../src/hooks/useChipGroupNavigation.tsx","../../../src/components/chip/ChipGroup.tsx"],"sourcesContent":["import { useState } from 'react';\n\ninterface UseChipGroupNavigation {\n /** the current active chip index */\n activeChip: number;\n\n /** callback to be executed when the backspace was pressed */\n onBackspacePressed(): void;\n\n /** function that allows to reset the navigation */\n resetChipNavigation(): void;\n}\n\nexport type useChipGroupNavigationType<C = any> = (\n chips: C[],\n onChipDeleted: (chip: C) => void,\n initialActiveChip?: number,\n) => UseChipGroupNavigation;\n\nconst INITIAL_STATE_ACTIVE_CHIP = -1;\n\n/**\n * Hook that provides the necessary information to manage chips navigation.\n * @param chips List of chips selected.\n * @param onChipDeleted Callback executed when a chip must be eliminated.\n * @param initialActiveChip Initial active chip index.\n *\n * @return chip navigation tools.\n */\nexport const useChipGroupNavigation: useChipGroupNavigationType = (\n chips,\n onChipDeleted,\n initialActiveChip = INITIAL_STATE_ACTIVE_CHIP,\n) => {\n const [wasBackspacePressed, setWasBackspacePressed] = useState(false);\n const [activeChip, setActiveChip] = useState(initialActiveChip);\n\n /**\n * Resets the active index and backspace control to their initial state\n */\n const resetChipNavigation = () => {\n setWasBackspacePressed(false);\n setActiveChip(initialActiveChip);\n };\n\n /**\n * Callback to be executed when the backspace was pressed. If there are no chips\n * selected, it will return immediately. If there are it will check if the\n * backspace was already pressed. if it was, it means that the user wants to eliminate\n * the chip, so we execute the `onChipDeleted` function and reset internal state.\n *\n * If it was not pressed before, we set the `wasBackspacePressed` flag to true and\n * highlight the last chip.\n */\n const onBackspacePressed = () => {\n if (chips.length === 0) {\n return;\n }\n\n if (wasBackspacePressed) {\n const chipDeleted: any = chips[chips.length - 1];\n onChipDeleted(chipDeleted);\n resetChipNavigation();\n } else {\n setActiveChip(chips.length - 1);\n setWasBackspacePressed(true);\n }\n };\n\n return {\n activeChip,\n onBackspacePressed,\n resetChipNavigation,\n };\n};\n","import { Alignment, HorizontalAlignment } from '@lumx/react/components';\nimport React, { forwardRef, ReactNode } from 'react';\n\nimport classNames from 'classnames';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { useChipGroupNavigation } from '@lumx/react/hooks/useChipGroupNavigation';\n\n/**\n * Defines the props of the component.\n */\nexport interface ChipGroupProps extends GenericProps {\n /** Chip horizontal alignment. */\n align?: HorizontalAlignment;\n /** List of Chip. */\n children: ReactNode;\n}\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<ChipGroupProps> = {\n align: Alignment.left,\n};\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'ChipGroup';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * ChipGroup component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nconst InternalChipGroup: Comp<ChipGroupProps, HTMLDivElement> = forwardRef((props, ref) => {\n const { align, children, className, ...forwardedProps } = props;\n const chipGroupClassName = handleBasicClasses({\n align,\n prefix: CLASSNAME,\n });\n\n return (\n <div ref={ref} {...forwardedProps} className={classNames(className, chipGroupClassName)}>\n {children}\n </div>\n );\n});\nInternalChipGroup.displayName = COMPONENT_NAME;\nInternalChipGroup.className = CLASSNAME;\nInternalChipGroup.defaultProps = DEFAULT_PROPS;\n\nexport const ChipGroup = Object.assign(InternalChipGroup, { useChipGroupNavigation });\n"],"names":["INITIAL_STATE_ACTIVE_CHIP","useChipGroupNavigation","chips","onChipDeleted","initialActiveChip","useState","wasBackspacePressed","setWasBackspacePressed","activeChip","setActiveChip","resetChipNavigation","onBackspacePressed","length","chipDeleted","DEFAULT_PROPS","align","Alignment","left","COMPONENT_NAME","CLASSNAME","getRootClassName","InternalChipGroup","forwardRef","props","ref","children","className","forwardedProps","chipGroupClassName","handleBasicClasses","prefix","classNames","displayName","defaultProps","ChipGroup","Object","assign"],"mappings":";;;;;AAmBA,IAAMA,yBAAyB,GAAG,CAAC,CAAnC;AAEA;;;;;;;;;AAQO,IAAMC,sBAAkD,GAAG,SAArDA,sBAAqD,CAC9DC,KAD8D,EAE9DC,aAF8D,EAI7D;AAAA,MADDC,iBACC,uEADmBJ,yBACnB;;AAAA,kBACqDK,QAAQ,CAAC,KAAD,CAD7D;AAAA;AAAA,MACMC,mBADN;AAAA,MAC2BC,sBAD3B;;AAAA,mBAEmCF,QAAQ,CAACD,iBAAD,CAF3C;AAAA;AAAA,MAEMI,UAFN;AAAA,MAEkBC,aAFlB;AAID;;;;;AAGA,MAAMC,mBAAmB,GAAG,SAAtBA,mBAAsB,GAAM;AAC9BH,IAAAA,sBAAsB,CAAC,KAAD,CAAtB;AACAE,IAAAA,aAAa,CAACL,iBAAD,CAAb;AACH,GAHD;AAKA;;;;;;;;;;;AASA,MAAMO,kBAAkB,GAAG,SAArBA,kBAAqB,GAAM;AAC7B,QAAIT,KAAK,CAACU,MAAN,KAAiB,CAArB,EAAwB;AACpB;AACH;;AAED,QAAIN,mBAAJ,EAAyB;AACrB,UAAMO,WAAgB,GAAGX,KAAK,CAACA,KAAK,CAACU,MAAN,GAAe,CAAhB,CAA9B;AACAT,MAAAA,aAAa,CAACU,WAAD,CAAb;AACAH,MAAAA,mBAAmB;AACtB,KAJD,MAIO;AACHD,MAAAA,aAAa,CAACP,KAAK,CAACU,MAAN,GAAe,CAAhB,CAAb;AACAL,MAAAA,sBAAsB,CAAC,IAAD,CAAtB;AACH;AACJ,GAbD;;AAeA,SAAO;AACHC,IAAAA,UAAU,EAAVA,UADG;AAEHG,IAAAA,kBAAkB,EAAlBA,kBAFG;AAGHD,IAAAA,mBAAmB,EAAnBA;AAHG,GAAP;AAKH,CA7CM;;ACpBP;;;;AAUA;;;AAGA,IAAMI,aAAsC,GAAG;AAC3CC,EAAAA,KAAK,EAAEC,SAAS,CAACC;AAD0B,CAA/C;AAIA;;;;AAGA,IAAMC,cAAc,GAAG,WAAvB;AAEA;;;;AAGA,IAAMC,SAAS,GAAGC,gBAAgB,CAACF,cAAD,CAAlC;AAEA;;;;;;;;AAOA,IAAMG,iBAAuD,GAAGC,UAAU,CAAC,UAACC,KAAD,EAAQC,GAAR,EAAgB;AAAA,MAC/ET,KAD+E,GAC7BQ,KAD6B,CAC/ER,KAD+E;AAAA,MACxEU,QADwE,GAC7BF,KAD6B,CACxEE,QADwE;AAAA,MAC9DC,SAD8D,GAC7BH,KAD6B,CAC9DG,SAD8D;AAAA,MAChDC,cADgD,4BAC7BJ,KAD6B;;AAEvF,MAAMK,kBAAkB,GAAGC,kBAAkB,CAAC;AAC1Cd,IAAAA,KAAK,EAALA,KAD0C;AAE1Ce,IAAAA,MAAM,EAAEX;AAFkC,GAAD,CAA7C;AAKA,SACI;AAAK,IAAA,GAAG,EAAEK;AAAV,KAAmBG,cAAnB;AAAmC,IAAA,SAAS,EAAEI,UAAU,CAACL,SAAD,EAAYE,kBAAZ;AAAxD,MACKH,QADL,CADJ;AAKH,CAZyE,CAA1E;AAaAJ,iBAAiB,CAACW,WAAlB,GAAgCd,cAAhC;AACAG,iBAAiB,CAACK,SAAlB,GAA8BP,SAA9B;AACAE,iBAAiB,CAACY,YAAlB,GAAiCnB,aAAjC;IAEaoB,SAAS,GAAGC,MAAM,CAACC,MAAP,CAAcf,iBAAd,EAAiC;AAAEpB,EAAAA,sBAAsB,EAAtBA;AAAF,CAAjC;;;;"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { e as _toConsumableArray } from './_rollupPluginBabelHelpers.js';
|
|
2
2
|
import React, { useEffect, createContext, useContext } from 'react';
|
|
3
|
+
import { e as onEscapePressed } from './getRootClassName.js';
|
|
3
4
|
import isEmpty from 'lodash/isEmpty';
|
|
4
5
|
import { D as DOCUMENT } from './constants.js';
|
|
5
6
|
import pull from 'lodash/pull';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ClickAwayProvider.js","sources":["../../../src/hooks/useCallbackOnEscape.ts","../../../src/hooks/useClickAway.tsx","../../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { DOCUMENT } from '@lumx/react/constants';\nimport { Callback, onEscapePressed } from '@lumx/react/utils';\nimport { useEffect } from 'react';\n\n/**\n * Triggers a callback when the escape key is pressed.\n *\n * @param callback Callback\n * @param closeOnEscape Disables the hook when false\n * @param rootElement Element on which to listen the escape key\n */\nexport function useCallbackOnEscape(\n callback: Callback | undefined,\n closeOnEscape = true,\n rootElement = DOCUMENT?.body,\n) {\n useEffect(() => {\n if (closeOnEscape && callback && rootElement) {\n const onKeyDown = onEscapePressed(callback);\n rootElement.addEventListener('keydown', onKeyDown);\n return () => rootElement.removeEventListener('keydown', onKeyDown);\n }\n return undefined;\n }, [callback, closeOnEscape, rootElement]);\n}\n","import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils';\n\nimport isEmpty from 'lodash/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(target: HTMLElement, refs: Array<RefObject<HTMLElement>>): boolean {\n // The target element is not contained in any of the listed element references.\n return !refs.some((e) => e?.current?.contains(target));\n}\n\nexport interface ClickAwayParameters {\n /**\n * A callback function to call when the user clicks away from the elements.\n */\n callback: EventListener | Falsy;\n /**\n * Elements from which we want to detect the click away.\n */\n refs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, refs }: ClickAwayParameters): void {\n useEffect(() => {\n const { current: currentRefs } = refs;\n if (!callback || !currentRefs || isEmpty(currentRefs)) {\n return undefined;\n }\n const listener: EventListener = (evt) => {\n if (isClickAway(evt.target as HTMLElement, currentRefs)) {\n callback(evt);\n }\n };\n\n EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n return () => {\n EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n };\n }, [callback, refs]);\n}\n","import React, { createContext, useContext, useEffect } from 'react';\nimport pull from 'lodash/pull';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\nconst ClickAwayAncestorContext = createContext<ClickAwayParameters['refs'] | null>(null);\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree we trying to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayParameters> = ({ children, callback, refs }) => {\n const ancestorChildrenRefs = useContext(ClickAwayAncestorContext);\n\n useEffect(() => {\n const { current: currentRefs } = refs;\n const { current: currentAncestorChildrenRefs } = ancestorChildrenRefs || {};\n if (!currentAncestorChildrenRefs || !currentRefs) {\n return undefined;\n }\n // Push current refs to parent.\n currentAncestorChildrenRefs.push(...currentRefs);\n return () => {\n // Pull current refs from parent.\n pull(currentAncestorChildrenRefs, ...currentRefs);\n };\n }, [ancestorChildrenRefs, refs]);\n\n useClickAway({ callback, refs });\n return <ClickAwayAncestorContext.Provider value={refs}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["useCallbackOnEscape","callback","closeOnEscape","rootElement","DOCUMENT","body","useEffect","onKeyDown","onEscapePressed","addEventListener","removeEventListener","undefined","EVENT_TYPES","isClickAway","target","refs","some","e","current","contains","useClickAway","currentRefs","isEmpty","listener","evt","forEach","evtType","document","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","ancestorChildrenRefs","useContext","currentAncestorChildrenRefs","push","pull","displayName"],"mappings":"
|
|
1
|
+
{"version":3,"file":"ClickAwayProvider.js","sources":["../../../src/hooks/useCallbackOnEscape.ts","../../../src/hooks/useClickAway.tsx","../../../src/utils/ClickAwayProvider/ClickAwayProvider.tsx"],"sourcesContent":["import { DOCUMENT } from '@lumx/react/constants';\nimport { Callback, onEscapePressed } from '@lumx/react/utils';\nimport { useEffect } from 'react';\n\n/**\n * Triggers a callback when the escape key is pressed.\n *\n * @param callback Callback\n * @param closeOnEscape Disables the hook when false\n * @param rootElement Element on which to listen the escape key\n */\nexport function useCallbackOnEscape(\n callback: Callback | undefined,\n closeOnEscape = true,\n rootElement = DOCUMENT?.body,\n) {\n useEffect(() => {\n if (closeOnEscape && callback && rootElement) {\n const onKeyDown = onEscapePressed(callback);\n rootElement.addEventListener('keydown', onKeyDown);\n return () => rootElement.removeEventListener('keydown', onKeyDown);\n }\n return undefined;\n }, [callback, closeOnEscape, rootElement]);\n}\n","import { RefObject, useEffect } from 'react';\n\nimport { Falsy } from '@lumx/react/utils';\n\nimport isEmpty from 'lodash/isEmpty';\n\nconst EVENT_TYPES = ['mousedown', 'touchstart'];\n\nfunction isClickAway(target: HTMLElement, refs: Array<RefObject<HTMLElement>>): boolean {\n // The target element is not contained in any of the listed element references.\n return !refs.some((e) => e?.current?.contains(target));\n}\n\nexport interface ClickAwayParameters {\n /**\n * A callback function to call when the user clicks away from the elements.\n */\n callback: EventListener | Falsy;\n /**\n * Elements from which we want to detect the click away.\n */\n refs: RefObject<Array<RefObject<HTMLElement>>>;\n}\n\n/**\n * Listen to clicks away from the given elements and callback the passed in function.\n *\n * Warning: If you need to detect click away on nested React portals, please use the `ClickAwayProvider` component.\n */\nexport function useClickAway({ callback, refs }: ClickAwayParameters): void {\n useEffect(() => {\n const { current: currentRefs } = refs;\n if (!callback || !currentRefs || isEmpty(currentRefs)) {\n return undefined;\n }\n const listener: EventListener = (evt) => {\n if (isClickAway(evt.target as HTMLElement, currentRefs)) {\n callback(evt);\n }\n };\n\n EVENT_TYPES.forEach((evtType) => document.addEventListener(evtType, listener));\n return () => {\n EVENT_TYPES.forEach((evtType) => document.removeEventListener(evtType, listener));\n };\n }, [callback, refs]);\n}\n","import React, { createContext, useContext, useEffect } from 'react';\nimport pull from 'lodash/pull';\nimport { ClickAwayParameters, useClickAway } from '@lumx/react/hooks/useClickAway';\n\nconst ClickAwayAncestorContext = createContext<ClickAwayParameters['refs'] | null>(null);\n\n/**\n * Component combining the `useClickAway` hook with a React context to hook into the React component tree and make sure\n * we take into account both the DOM tree and the React tree we trying to detect click away.\n *\n * @return the react component.\n */\nexport const ClickAwayProvider: React.FC<ClickAwayParameters> = ({ children, callback, refs }) => {\n const ancestorChildrenRefs = useContext(ClickAwayAncestorContext);\n\n useEffect(() => {\n const { current: currentRefs } = refs;\n const { current: currentAncestorChildrenRefs } = ancestorChildrenRefs || {};\n if (!currentAncestorChildrenRefs || !currentRefs) {\n return undefined;\n }\n // Push current refs to parent.\n currentAncestorChildrenRefs.push(...currentRefs);\n return () => {\n // Pull current refs from parent.\n pull(currentAncestorChildrenRefs, ...currentRefs);\n };\n }, [ancestorChildrenRefs, refs]);\n\n useClickAway({ callback, refs });\n return <ClickAwayAncestorContext.Provider value={refs}>{children}</ClickAwayAncestorContext.Provider>;\n};\nClickAwayProvider.displayName = 'ClickAwayProvider';\n"],"names":["useCallbackOnEscape","callback","closeOnEscape","rootElement","DOCUMENT","body","useEffect","onKeyDown","onEscapePressed","addEventListener","removeEventListener","undefined","EVENT_TYPES","isClickAway","target","refs","some","e","current","contains","useClickAway","currentRefs","isEmpty","listener","evt","forEach","evtType","document","ClickAwayAncestorContext","createContext","ClickAwayProvider","children","ancestorChildrenRefs","useContext","currentAncestorChildrenRefs","push","pull","displayName"],"mappings":"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"}
|