@lumx/react 2.2.19 → 2.2.20-alpha-type.1

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.
Files changed (96) hide show
  1. package/esm/_internal/AutocompleteMultiple.js.map +1 -1
  2. package/esm/_internal/ButtonRoot.js.map +1 -1
  3. package/esm/_internal/Checkbox2.js +3 -1
  4. package/esm/_internal/Checkbox2.js.map +1 -1
  5. package/esm/_internal/ClickAwayProvider.js +90 -12
  6. package/esm/_internal/ClickAwayProvider.js.map +1 -1
  7. package/esm/_internal/DatePickerField.js +18 -11
  8. package/esm/_internal/DatePickerField.js.map +1 -1
  9. package/esm/_internal/Dialog2.js +2 -2
  10. package/esm/_internal/Dialog2.js.map +1 -1
  11. package/esm/_internal/Dropdown2.js.map +1 -1
  12. package/esm/_internal/GenericBlock.js +90 -0
  13. package/esm/_internal/GenericBlock.js.map +1 -0
  14. package/esm/_internal/Lightbox2.js +2 -2
  15. package/esm/_internal/Lightbox2.js.map +1 -1
  16. package/esm/_internal/LinkPreview.js +22 -12
  17. package/esm/_internal/LinkPreview.js.map +1 -1
  18. package/esm/_internal/Popover2.js +21 -8
  19. package/esm/_internal/Popover2.js.map +1 -1
  20. package/esm/_internal/SelectMultiple.js +16 -4
  21. package/esm/_internal/SelectMultiple.js.map +1 -1
  22. package/esm/_internal/TextField.js.map +1 -1
  23. package/esm/_internal/Thumbnail2.js.map +1 -1
  24. package/esm/_internal/alert-dialog.js +2 -2
  25. package/esm/_internal/autocomplete.js +2 -1
  26. package/esm/_internal/autocomplete.js.map +1 -1
  27. package/esm/_internal/button.js +2 -1
  28. package/esm/_internal/button.js.map +1 -1
  29. package/esm/_internal/comment-block.js +2 -1
  30. package/esm/_internal/comment-block.js.map +1 -1
  31. package/esm/_internal/date-picker.js +3 -2
  32. package/esm/_internal/date-picker.js.map +1 -1
  33. package/esm/_internal/dialog.js +2 -2
  34. package/esm/_internal/dropdown.js +2 -1
  35. package/esm/_internal/dropdown.js.map +1 -1
  36. package/esm/_internal/expansion-panel.js +1 -1
  37. package/esm/_internal/generic-block.js +12 -0
  38. package/esm/_internal/generic-block.js.map +1 -0
  39. package/esm/_internal/lightbox.js +3 -2
  40. package/esm/_internal/lightbox.js.map +1 -1
  41. package/esm/_internal/popover.js +2 -1
  42. package/esm/_internal/popover.js.map +1 -1
  43. package/esm/_internal/select.js +2 -1
  44. package/esm/_internal/select.js.map +1 -1
  45. package/esm/_internal/side-navigation.js +2 -1
  46. package/esm/_internal/side-navigation.js.map +1 -1
  47. package/esm/_internal/slideshow.js +2 -1
  48. package/esm/_internal/slideshow.js.map +1 -1
  49. package/esm/_internal/text-field.js +2 -1
  50. package/esm/_internal/text-field.js.map +1 -1
  51. package/esm/_internal/tooltip.js +2 -1
  52. package/esm/_internal/tooltip.js.map +1 -1
  53. package/esm/_internal/type.js.map +1 -1
  54. package/esm/_internal/useFocusTrap.js +62 -78
  55. package/esm/_internal/useFocusTrap.js.map +1 -1
  56. package/esm/index.js +3 -2
  57. package/esm/index.js.map +1 -1
  58. package/package.json +5 -5
  59. package/src/components/autocomplete/Autocomplete.tsx +4 -4
  60. package/src/components/button/Button.stories.tsx +1 -0
  61. package/src/components/button/ButtonRoot.tsx +4 -4
  62. package/src/components/checkbox/Checkbox.tsx +2 -1
  63. package/src/components/checkbox/__snapshots__/Checkbox.test.tsx.snap +4 -0
  64. package/src/components/date-picker/DatePickerField.tsx +15 -16
  65. package/src/components/date-picker/types.ts +2 -2
  66. package/src/components/dialog/Dialog.stories.tsx +57 -13
  67. package/src/components/dialog/Dialog.tsx +3 -3
  68. package/src/components/dialog/__snapshots__/Dialog.test.tsx.snap +82 -14
  69. package/src/components/dropdown/Dropdown.tsx +4 -3
  70. package/src/components/generic-block/GenericBlock.stories.tsx +149 -0
  71. package/src/components/generic-block/GenericBlock.test.tsx +28 -0
  72. package/src/components/generic-block/GenericBlock.tsx +120 -0
  73. package/src/components/generic-block/__snapshots__/GenericBlock.test.tsx.snap +92 -0
  74. package/src/components/generic-block/index.ts +1 -0
  75. package/src/components/lightbox/Lightbox.tsx +1 -1
  76. package/src/components/link-preview/LinkPreview.test.tsx +50 -55
  77. package/src/components/link-preview/LinkPreview.tsx +43 -16
  78. package/src/components/popover/Popover.tsx +20 -4
  79. package/src/components/select/Select.stories.tsx +2 -0
  80. package/src/components/select/Select.tsx +11 -1
  81. package/src/components/select/SelectMultiple.stories.tsx +2 -0
  82. package/src/components/select/SelectMultiple.tsx +11 -1
  83. package/src/components/select/constants.ts +2 -0
  84. package/src/components/table/__snapshots__/Table.test.tsx.snap +5 -0
  85. package/src/components/text-field/TextField.tsx +4 -4
  86. package/src/components/thumbnail/Thumbnail.tsx +2 -2
  87. package/src/hooks/useCallbackOnEscape.ts +21 -13
  88. package/src/hooks/useFocusTrap.ts +68 -51
  89. package/src/index.ts +1 -0
  90. package/src/stories/generated/GenericBlock/Demos.stories.tsx +6 -0
  91. package/src/utils/focus/getFirstAndLastFocusable.test.ts +6 -0
  92. package/src/utils/focus/getFirstAndLastFocusable.ts +2 -2
  93. package/src/utils/makeListenerTowerContext.ts +32 -0
  94. package/src/utils/type.ts +3 -0
  95. package/types.d.ts +70 -16
  96. package/src/components/link-preview/__snapshots__/LinkPreview.test.tsx.snap +0 -51
@@ -200,6 +200,7 @@ var SelectField = function SelectField(_ref) {
200
200
  handleKeyboardNav = _ref.handleKeyboardNav,
201
201
  hasError = _ref.hasError,
202
202
  hasInputClear = _ref.hasInputClear,
203
+ icon = _ref.icon,
203
204
  id = _ref.id,
204
205
  isDisabled = _ref.isDisabled,
205
206
  isEmpty = _ref.isEmpty,
@@ -213,7 +214,7 @@ var SelectField = function SelectField(_ref) {
213
214
  theme = _ref.theme,
214
215
  value = _ref.value,
215
216
  variant = _ref.variant,
216
- forwardedProps = _objectWithoutProperties(_ref, ["anchorRef", "clearButtonProps", "handleKeyboardNav", "hasError", "hasInputClear", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedValueRender", "theme", "value", "variant"]);
217
+ forwardedProps = _objectWithoutProperties(_ref, ["anchorRef", "clearButtonProps", "handleKeyboardNav", "hasError", "hasInputClear", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedValueRender", "theme", "value", "variant"]);
217
218
 
218
219
  return React.createElement(React.Fragment, null, variant === SelectVariant.input && React.createElement(React.Fragment, null, label && React.createElement("div", {
219
220
  className: "".concat(CLASSNAME$1, "__header")
@@ -230,7 +231,12 @@ var SelectField = function SelectField(_ref) {
230
231
  onKeyDown: handleKeyboardNav,
231
232
  tabIndex: isDisabled ? undefined : 0,
232
233
  "aria-disabled": isDisabled || undefined
233
- }, forwardedProps), React.createElement("div", {
234
+ }, forwardedProps), icon && React.createElement(Icon, {
235
+ className: "".concat(CLASSNAME$1, "__input-icon"),
236
+ color: theme === Theme.dark ? 'light' : undefined,
237
+ icon: icon,
238
+ size: Size.xs
239
+ }), React.createElement("div", {
234
240
  className: classnames(["".concat(CLASSNAME$1, "__input-native"), isEmpty && placeholder && "".concat(CLASSNAME$1, "__input-native--placeholder")])
235
241
  }, !isEmpty && React.createElement("span", null, selectedValueRender === null || selectedValueRender === void 0 ? void 0 : selectedValueRender(value)), isEmpty && placeholder && React.createElement("span", null, placeholder)), (isValid || hasError) && React.createElement("div", {
236
242
  className: "".concat(CLASSNAME$1, "__input-validity")
@@ -326,6 +332,7 @@ var SelectMultipleField = function SelectMultipleField(_ref) {
326
332
  var anchorRef = _ref.anchorRef,
327
333
  handleKeyboardNav = _ref.handleKeyboardNav,
328
334
  hasError = _ref.hasError,
335
+ icon = _ref.icon,
329
336
  id = _ref.id,
330
337
  isDisabled = _ref.isDisabled,
331
338
  isEmpty = _ref.isEmpty,
@@ -340,7 +347,7 @@ var SelectMultipleField = function SelectMultipleField(_ref) {
340
347
  theme = _ref.theme,
341
348
  value = _ref.value,
342
349
  variant = _ref.variant,
343
- forwardedProps = _objectWithoutProperties(_ref, ["anchorRef", "handleKeyboardNav", "hasError", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedChipRender", "selectedValueRender", "theme", "value", "variant"]);
350
+ forwardedProps = _objectWithoutProperties(_ref, ["anchorRef", "handleKeyboardNav", "hasError", "icon", "id", "isDisabled", "isEmpty", "isRequired", "isValid", "label", "onClear", "onInputClick", "placeholder", "selectedChipRender", "selectedValueRender", "theme", "value", "variant"]);
344
351
 
345
352
  return React.createElement(React.Fragment, null, variant === SelectVariant.input && React.createElement(React.Fragment, null, label && React.createElement("div", {
346
353
  className: "".concat(CLASSNAME$2, "__header")
@@ -357,7 +364,12 @@ var SelectMultipleField = function SelectMultipleField(_ref) {
357
364
  onKeyDown: handleKeyboardNav,
358
365
  tabIndex: isDisabled ? undefined : 0,
359
366
  "aria-disabled": isDisabled || undefined
360
- }, forwardedProps), React.createElement("div", {
367
+ }, forwardedProps), icon && React.createElement(Icon, {
368
+ className: "".concat(CLASSNAME$2, "__input-icon"),
369
+ color: theme === Theme.dark ? 'light' : undefined,
370
+ icon: icon,
371
+ size: Size.xs
372
+ }), React.createElement("div", {
361
373
  className: "".concat(CLASSNAME$2, "__chips")
362
374
  }, !isEmpty && value.map(function (val, index) {
363
375
  return selectedChipRender === null || selectedChipRender === void 0 ? void 0 : selectedChipRender(val, index, onClear, isDisabled, theme);
@@ -1 +1 @@
1
- {"version":3,"file":"SelectMultiple.js","sources":["../../../src/hooks/useListenFocus.tsx","../../../src/components/select/constants.ts","../../../src/components/select/WithSelectContext.tsx","../../../src/components/select/Select.tsx","../../../src/components/select/SelectMultiple.tsx"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\n\n/**\n * Listen on element focus to store the focus status.\n */\nexport function useListenFocus(ref: RefObject<HTMLElement>) {\n const [isFocus, setFocus] = useState(false);\n\n useEffect(() => {\n const { current: element } = ref;\n if (!element) {\n return undefined;\n }\n\n const onFocus = () => setFocus(true);\n const onBlur = () => setFocus(false);\n element.addEventListener('focus', onFocus);\n element.addEventListener('blur', onBlur);\n return () => {\n element.removeEventListener('focus', onFocus);\n element.removeEventListener('blur', onBlur);\n };\n }, [ref, setFocus]);\n\n return isFocus;\n}\n","import { IconButtonProps } from '@lumx/react';\nimport { Theme } from '@lumx/react/components';\nimport { GenericProps, ValueOf } from '@lumx/react/utils';\nimport { ReactNode, SyntheticEvent } from 'react';\n\n/**\n * Select variants.\n */\nexport const SelectVariant = { input: 'input', chip: 'chip' } as const;\nexport type SelectVariant = ValueOf<typeof SelectVariant>;\n\nexport interface CoreSelectProps extends GenericProps {\n /** Props to pass to the clear button (minus those already set by the Select props). If not specified, the button won't be displayed. */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /** Whether the select (input variant) is displayed with error style or not. */\n hasError?: boolean;\n /** Error message. */\n error?: string | ReactNode;\n /** Helper text. */\n helper?: string;\n /** Whether the select should close on click. */\n closeOnClick?: boolean;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is required or not. */\n isRequired?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Whether the select (input variant) is displayed with valid style or not. */\n isValid?: boolean;\n /** Label text. */\n label?: string;\n /** Placeholder input text. */\n placeholder?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Select variant. */\n variant?: SelectVariant;\n /** On clear callback. */\n onClear?(event: SyntheticEvent, value?: string): void;\n /** On blur callback. */\n onBlur?(): void;\n /** On filter text change callback (with 500ms debounce). */\n onFilter?(): void;\n /** On input click callback (can be used for dropdown toggle). */\n onInputClick?(): void;\n /** On dropdown close callback. */\n onDropdownClose?(): void;\n /** On scroll end callback. */\n onInfiniteScroll?(): void;\n /** Render value function. Default: Renders the value as a string. */\n selectedValueRender?(choice: string): ReactNode | string;\n}\n","import React, { Ref, useCallback, useMemo, useRef } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { Kind, Theme } from '@lumx/react/components';\nimport { Dropdown } from '@lumx/react/components/dropdown/Dropdown';\nimport { InputHelper } from '@lumx/react/components/input-helper/InputHelper';\nimport { Placement } from '@lumx/react/components/popover/Popover';\n\nimport { getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useListenFocus } from '@lumx/react/hooks/useListenFocus';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nexport const DEFAULT_PROPS: Partial<CoreSelectProps> = {\n theme: Theme.light,\n variant: SelectVariant.input,\n};\n\nexport const WithSelectContext = (\n SelectElement: React.FC<any>,\n {\n children,\n className,\n isMultiple,\n closeOnClick = !isMultiple,\n disabled,\n error,\n hasError,\n helper,\n id,\n isDisabled = disabled,\n isEmpty,\n isOpen,\n isRequired,\n isValid,\n label,\n onClear,\n onDropdownClose,\n onInfiniteScroll,\n onInputClick,\n placeholder,\n theme = DEFAULT_PROPS.theme,\n value,\n variant = DEFAULT_PROPS.variant,\n ...forwardedProps\n }: CoreSelectProps,\n ref: Ref<HTMLDivElement>,\n): React.ReactElement => {\n const selectId = useMemo(() => id || `select-${uid()}`, [id]);\n const anchorRef = useRef<HTMLElement>(null);\n const selectRef = useRef<HTMLDivElement>(null);\n const isFocus = useListenFocus(anchorRef);\n\n const handleKeyboardNav = useCallback(\n (evt: React.KeyboardEvent<HTMLElement>) => {\n if ((evt.key === 'Enter' || evt.key === ' ' || evt.key === 'ArrowDown') && onInputClick) {\n evt.preventDefault();\n onInputClick();\n }\n },\n [onInputClick],\n );\n\n const onClose = () => {\n if (onDropdownClose) {\n onDropdownClose();\n }\n anchorRef?.current?.blur();\n };\n\n return (\n <div\n ref={mergeRefs(ref, selectRef)}\n className={classNames(\n className,\n handleBasicClasses({\n hasError,\n hasLabel: Boolean(label),\n hasPlaceholder: Boolean(placeholder),\n hasValue: !isEmpty,\n isDisabled,\n isEmpty,\n isFocus,\n isOpen,\n isValid,\n prefix: CLASSNAME,\n theme: theme === Theme.light ? Theme.light : Theme.dark,\n }),\n )}\n >\n <SelectElement\n {...forwardedProps}\n anchorRef={anchorRef}\n aria-disabled={isDisabled}\n handleKeyboardNav={handleKeyboardNav}\n hasError={hasError}\n isDisabled={isDisabled}\n isEmpty={isEmpty}\n isRequired={isRequired}\n isValid={isValid}\n label={label}\n placeholder={placeholder}\n id={selectId}\n theme={theme}\n value={value}\n variant={variant}\n onClear={onClear}\n onInputClick={onInputClick}\n />\n <Dropdown\n anchorRef={anchorRef}\n closeOnClick={closeOnClick}\n closeOnClickAway\n closeOnEscape\n isOpen={!!isOpen}\n placement={Placement.BOTTOM_START}\n onClose={onClose}\n onInfiniteScroll={onInfiniteScroll}\n >\n {children}\n </Dropdown>\n {hasError && error && (\n <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n {error}\n </InputHelper>\n )}\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n );\n};\n","import React, { forwardRef, RefObject } from 'react';\n\nimport classNames from 'classnames';\nimport lodashIsEmpty from 'lodash/isEmpty';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiCloseCircle, mdiMenuDown } from '@lumx/icons';\n\nimport { Emphasis, Size } from '@lumx/react/components';\nimport { IconButton } from '@lumx/react/components/button/IconButton';\nimport { Chip } from '@lumx/react/components/chip/Chip';\nimport { Icon } from '@lumx/react/components/icon/Icon';\nimport { InputLabel } from '@lumx/react/components/input-label/InputLabel';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { WithSelectContext } from './WithSelectContext';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** Defines the props of the component. */\nexport interface SelectProps extends CoreSelectProps {\n /** Selected value. */\n value: string;\n}\n\nexport { SelectVariant };\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nconst DEFAULT_PROPS: Partial<SelectProps> = {\n selectedValueRender: (choice) => choice,\n};\n\nconst stopPropagation = (evt: Event) => evt.stopPropagation();\n\n/**\n * Select component.\n */\nconst SelectField: React.FC<SelectProps> = ({\n anchorRef,\n clearButtonProps,\n handleKeyboardNav,\n hasError,\n hasInputClear,\n id,\n isDisabled,\n isEmpty,\n isRequired,\n isValid,\n label,\n onClear,\n onInputClick,\n placeholder,\n selectedValueRender,\n theme,\n value,\n variant,\n ...forwardedProps\n}) => {\n return (\n <>\n {variant === SelectVariant.input && (\n <>\n {label && (\n <div className={`${CLASSNAME}__header`}>\n <InputLabel\n htmlFor={id}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={anchorRef as RefObject<HTMLDivElement>}\n id={id}\n className={`${CLASSNAME}__wrapper`}\n onClick={onInputClick}\n onKeyDown={handleKeyboardNav}\n tabIndex={isDisabled ? undefined : 0}\n aria-disabled={isDisabled || undefined}\n {...forwardedProps}\n >\n <div\n className={classNames([\n `${CLASSNAME}__input-native`,\n isEmpty && placeholder && `${CLASSNAME}__input-native--placeholder`,\n ])}\n >\n {!isEmpty && <span>{selectedValueRender?.(value)}</span>}\n\n {isEmpty && placeholder && <span>{placeholder}</span>}\n </div>\n\n {(isValid || hasError) && (\n <div className={`${CLASSNAME}__input-validity`}>\n <Icon icon={isValid ? mdiCheckCircle : mdiAlertCircle} size={Size.xxs} />\n </div>\n )}\n\n {hasInputClear && clearButtonProps && (\n <IconButton\n {...clearButtonProps}\n className={`${CLASSNAME}__input-clear`}\n icon={mdiCloseCircle}\n emphasis={Emphasis.low}\n size={Size.s}\n theme={theme}\n onClick={onClear}\n onKeyDown={stopPropagation}\n />\n )}\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiMenuDown} size={Size.s} />\n </div>\n </div>\n </>\n )}\n\n {variant === SelectVariant.chip && (\n <Chip\n id={id}\n isSelected={!isEmpty}\n isDisabled={isDisabled}\n after={<Icon icon={isEmpty ? mdiMenuDown : mdiCloseCircle} />}\n onAfterClick={isEmpty ? onInputClick : onClear}\n onClick={onInputClick}\n ref={anchorRef as RefObject<HTMLAnchorElement>}\n theme={theme}\n {...forwardedProps}\n >\n {isEmpty && <span>{label}</span>}\n\n {!isEmpty && <span>{selectedValueRender?.(value)}</span>}\n </Chip>\n )}\n </>\n );\n};\n\n/**\n * Select component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Select: Comp<SelectProps, HTMLDivElement> = forwardRef((props, ref) => {\n const isEmpty = lodashIsEmpty(props.value);\n const hasInputClear = props.onClear && props.clearButtonProps && !isEmpty;\n\n return WithSelectContext(\n SelectField,\n {\n ...props,\n className: classNames(\n props.className,\n handleBasicClasses({\n hasInputClear,\n hasUnique: !props.isEmpty,\n prefix: CLASSNAME,\n }),\n ),\n hasInputClear,\n isEmpty,\n },\n ref,\n );\n});\nSelect.displayName = COMPONENT_NAME;\nSelect.className = CLASSNAME;\nSelect.defaultProps = DEFAULT_PROPS;\nSelect.className = CLASSNAME;\n","import React, { forwardRef, ReactNode, RefObject, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiClose, mdiCloseCircle, mdiMenuDown } from '@lumx/icons';\n\nimport { Size } from '@lumx/react/components';\nimport { Chip } from '@lumx/react/components/chip/Chip';\nimport { Icon } from '@lumx/react/components/icon/Icon';\nimport { InputLabel } from '@lumx/react/components/input-label/InputLabel';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { WithSelectContext } from './WithSelectContext';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** Defines the props of the component. */\nexport interface SelectMultipleProps extends CoreSelectProps {\n /** Selected values. */\n value: string[];\n /** Selected value render function. Default: Renders the value inside of a Chip. */\n selectedChipRender?(\n choice: string,\n index: number,\n onClear?: (event: SyntheticEvent, choice: string) => void,\n isDisabled?: boolean,\n theme?: any,\n ): ReactNode | string;\n}\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nconst DEFAULT_PROPS: Partial<SelectMultipleProps> = {\n selectedChipRender(choice, index, onClear, isDisabled?, theme?) {\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 theme={theme}\n >\n {choice}\n </Chip>\n );\n },\n selectedValueRender: (choice) => choice,\n};\n\nexport const SelectMultipleField: React.FC<SelectMultipleProps> = ({\n anchorRef,\n handleKeyboardNav,\n hasError,\n id,\n isDisabled,\n isEmpty,\n isRequired,\n isValid,\n label,\n onClear,\n onInputClick,\n placeholder,\n selectedChipRender,\n selectedValueRender,\n theme,\n value,\n variant,\n ...forwardedProps\n}) => (\n <>\n {variant === SelectVariant.input && (\n <>\n {label && (\n <div className={`${CLASSNAME}__header`}>\n <InputLabel\n htmlFor={id}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={anchorRef as RefObject<HTMLDivElement>}\n id={id}\n className={`${CLASSNAME}__wrapper`}\n onClick={onInputClick}\n onKeyDown={handleKeyboardNav}\n tabIndex={isDisabled ? undefined : 0}\n aria-disabled={isDisabled || undefined}\n {...forwardedProps}\n >\n <div className={`${CLASSNAME}__chips`}>\n {!isEmpty &&\n value.map((val, index) => selectedChipRender?.(val, index, onClear, isDisabled, theme))}\n </div>\n\n {isEmpty && placeholder && (\n <div\n className={classNames([\n `${CLASSNAME}__input-native`,\n `${CLASSNAME}__input-native--placeholder`,\n ])}\n >\n <span>{placeholder}</span>\n </div>\n )}\n\n {(isValid || hasError) && (\n <div className={`${CLASSNAME}__input-validity`}>\n <Icon icon={isValid ? mdiCheckCircle : mdiAlertCircle} size={Size.xxs} />\n </div>\n )}\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiMenuDown} size={Size.s} />\n </div>\n </div>\n </>\n )}\n\n {variant === SelectVariant.chip && (\n <Chip\n id={id}\n isSelected={!isEmpty}\n isDisabled={isDisabled}\n after={<Icon icon={isEmpty ? mdiMenuDown : mdiCloseCircle} />}\n onAfterClick={isEmpty ? onInputClick : onClear}\n onClick={onInputClick}\n ref={anchorRef as RefObject<HTMLAnchorElement>}\n theme={theme}\n {...forwardedProps}\n >\n {isEmpty && <span>{label}</span>}\n\n {!isEmpty && (\n <span>\n <span>{selectedValueRender?.(value[0])}</span>\n\n {value.length > 1 && <span>&nbsp;+{value.length - 1}</span>}\n </span>\n )}\n </Chip>\n )}\n </>\n);\n\n/**\n * SelectMultiple component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SelectMultiple: Comp<SelectMultipleProps, HTMLDivElement> = forwardRef((props, ref) => {\n return WithSelectContext(\n SelectMultipleField,\n {\n ...props,\n className: classNames(\n props.className,\n handleBasicClasses({\n hasMultiple: !props.isEmpty,\n prefix: CLASSNAME,\n }),\n ),\n isEmpty: props.value.length === 0,\n isMultiple: true,\n },\n ref,\n );\n});\nSelectMultiple.displayName = COMPONENT_NAME;\nSelectMultiple.className = CLASSNAME;\nSelectMultiple.defaultProps = DEFAULT_PROPS;\n"],"names":["useListenFocus","ref","useState","isFocus","setFocus","useEffect","element","current","undefined","onFocus","onBlur","addEventListener","removeEventListener","SelectVariant","input","chip","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","variant","WithSelectContext","SelectElement","children","className","isMultiple","closeOnClick","disabled","error","hasError","helper","id","isDisabled","isEmpty","isOpen","isRequired","isValid","label","onClear","onDropdownClose","onInfiniteScroll","onInputClick","placeholder","value","forwardedProps","selectId","useMemo","uid","anchorRef","useRef","selectRef","handleKeyboardNav","useCallback","evt","key","preventDefault","onClose","blur","mergeRefs","classNames","handleBasicClasses","hasLabel","Boolean","hasPlaceholder","hasValue","prefix","dark","Placement","BOTTOM_START","Kind","selectedValueRender","choice","stopPropagation","SelectField","clearButtonProps","hasInputClear","mdiCheckCircle","mdiAlertCircle","Size","xxs","mdiCloseCircle","Emphasis","low","s","mdiMenuDown","Select","forwardRef","props","lodashIsEmpty","hasUnique","displayName","defaultProps","selectedChipRender","index","onClick","event","mdiClose","SelectMultipleField","map","val","length","SelectMultiple","hasMultiple"],"mappings":"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"}
1
+ {"version":3,"file":"SelectMultiple.js","sources":["../../../src/hooks/useListenFocus.tsx","../../../src/components/select/constants.ts","../../../src/components/select/WithSelectContext.tsx","../../../src/components/select/Select.tsx","../../../src/components/select/SelectMultiple.tsx"],"sourcesContent":["import { RefObject, useEffect, useState } from 'react';\n\n/**\n * Listen on element focus to store the focus status.\n */\nexport function useListenFocus(ref: RefObject<HTMLElement>) {\n const [isFocus, setFocus] = useState(false);\n\n useEffect(() => {\n const { current: element } = ref;\n if (!element) {\n return undefined;\n }\n\n const onFocus = () => setFocus(true);\n const onBlur = () => setFocus(false);\n element.addEventListener('focus', onFocus);\n element.addEventListener('blur', onBlur);\n return () => {\n element.removeEventListener('focus', onFocus);\n element.removeEventListener('blur', onBlur);\n };\n }, [ref, setFocus]);\n\n return isFocus;\n}\n","import { IconButtonProps } from '@lumx/react';\nimport { Theme } from '@lumx/react/components';\nimport { GenericProps, ValueOf } from '@lumx/react/utils';\nimport { ReactNode, SyntheticEvent } from 'react';\n\n/**\n * Select variants.\n */\nexport const SelectVariant = { input: 'input', chip: 'chip' } as const;\nexport type SelectVariant = ValueOf<typeof SelectVariant>;\n\nexport interface CoreSelectProps extends GenericProps {\n /** Props to pass to the clear button (minus those already set by the Select props). If not specified, the button won't be displayed. */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /** Whether the select (input variant) is displayed with error style or not. */\n hasError?: boolean;\n /** Error message. */\n error?: string | ReactNode;\n /** Helper text. */\n helper?: string;\n /** Whether the select should close on click. */\n closeOnClick?: boolean;\n /** Icon (SVG path). */\n icon?: string;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is required or not. */\n isRequired?: boolean;\n /** Whether the component is open or not. */\n isOpen?: boolean;\n /** Whether the select (input variant) is displayed with valid style or not. */\n isValid?: boolean;\n /** Label text. */\n label?: string;\n /** Placeholder input text. */\n placeholder?: string;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Select variant. */\n variant?: SelectVariant;\n /** On clear callback. */\n onClear?(event: SyntheticEvent, value?: string): void;\n /** On blur callback. */\n onBlur?(): void;\n /** On filter text change callback (with 500ms debounce). */\n onFilter?(): void;\n /** On input click callback (can be used for dropdown toggle). */\n onInputClick?(): void;\n /** On dropdown close callback. */\n onDropdownClose?(): void;\n /** On scroll end callback. */\n onInfiniteScroll?(): void;\n /** Render value function. Default: Renders the value as a string. */\n selectedValueRender?(choice: string): ReactNode | string;\n}\n","import React, { Ref, useCallback, useMemo, useRef } from 'react';\n\nimport classNames from 'classnames';\nimport { uid } from 'uid';\n\nimport { Kind, Theme } from '@lumx/react/components';\nimport { Dropdown } from '@lumx/react/components/dropdown/Dropdown';\nimport { InputHelper } from '@lumx/react/components/input-helper/InputHelper';\nimport { Placement } from '@lumx/react/components/popover/Popover';\n\nimport { getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useListenFocus } from '@lumx/react/hooks/useListenFocus';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nexport const DEFAULT_PROPS: Partial<CoreSelectProps> = {\n theme: Theme.light,\n variant: SelectVariant.input,\n};\n\nexport const WithSelectContext = (\n SelectElement: React.FC<any>,\n {\n children,\n className,\n isMultiple,\n closeOnClick = !isMultiple,\n disabled,\n error,\n hasError,\n helper,\n id,\n isDisabled = disabled,\n isEmpty,\n isOpen,\n isRequired,\n isValid,\n label,\n onClear,\n onDropdownClose,\n onInfiniteScroll,\n onInputClick,\n placeholder,\n theme = DEFAULT_PROPS.theme,\n value,\n variant = DEFAULT_PROPS.variant,\n ...forwardedProps\n }: CoreSelectProps,\n ref: Ref<HTMLDivElement>,\n): React.ReactElement => {\n const selectId = useMemo(() => id || `select-${uid()}`, [id]);\n const anchorRef = useRef<HTMLElement>(null);\n const selectRef = useRef<HTMLDivElement>(null);\n const isFocus = useListenFocus(anchorRef);\n\n const handleKeyboardNav = useCallback(\n (evt: React.KeyboardEvent<HTMLElement>) => {\n if ((evt.key === 'Enter' || evt.key === ' ' || evt.key === 'ArrowDown') && onInputClick) {\n evt.preventDefault();\n onInputClick();\n }\n },\n [onInputClick],\n );\n\n const onClose = () => {\n if (onDropdownClose) {\n onDropdownClose();\n }\n anchorRef?.current?.blur();\n };\n\n return (\n <div\n ref={mergeRefs(ref, selectRef)}\n className={classNames(\n className,\n handleBasicClasses({\n hasError,\n hasLabel: Boolean(label),\n hasPlaceholder: Boolean(placeholder),\n hasValue: !isEmpty,\n isDisabled,\n isEmpty,\n isFocus,\n isOpen,\n isValid,\n prefix: CLASSNAME,\n theme: theme === Theme.light ? Theme.light : Theme.dark,\n }),\n )}\n >\n <SelectElement\n {...forwardedProps}\n anchorRef={anchorRef}\n aria-disabled={isDisabled}\n handleKeyboardNav={handleKeyboardNav}\n hasError={hasError}\n isDisabled={isDisabled}\n isEmpty={isEmpty}\n isRequired={isRequired}\n isValid={isValid}\n label={label}\n placeholder={placeholder}\n id={selectId}\n theme={theme}\n value={value}\n variant={variant}\n onClear={onClear}\n onInputClick={onInputClick}\n />\n <Dropdown\n anchorRef={anchorRef}\n closeOnClick={closeOnClick}\n closeOnClickAway\n closeOnEscape\n isOpen={!!isOpen}\n placement={Placement.BOTTOM_START}\n onClose={onClose}\n onInfiniteScroll={onInfiniteScroll}\n >\n {children}\n </Dropdown>\n {hasError && error && (\n <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n {error}\n </InputHelper>\n )}\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n );\n};\n","import React, { forwardRef, RefObject } from 'react';\n\nimport classNames from 'classnames';\nimport lodashIsEmpty from 'lodash/isEmpty';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiCloseCircle, mdiMenuDown } from '@lumx/icons';\n\nimport { Emphasis, Size, Theme } from '@lumx/react/components';\nimport { IconButton } from '@lumx/react/components/button/IconButton';\nimport { Chip } from '@lumx/react/components/chip/Chip';\nimport { Icon } from '@lumx/react/components/icon/Icon';\nimport { InputLabel } from '@lumx/react/components/input-label/InputLabel';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { WithSelectContext } from './WithSelectContext';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** Defines the props of the component. */\nexport interface SelectProps extends CoreSelectProps {\n /** Selected value. */\n value: string;\n}\n\nexport { SelectVariant };\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nconst DEFAULT_PROPS: Partial<SelectProps> = {\n selectedValueRender: (choice) => choice,\n};\n\nconst stopPropagation = (evt: Event) => evt.stopPropagation();\n\n/**\n * Select component.\n */\nconst SelectField: React.FC<SelectProps> = ({\n anchorRef,\n clearButtonProps,\n handleKeyboardNav,\n hasError,\n hasInputClear,\n icon,\n id,\n isDisabled,\n isEmpty,\n isRequired,\n isValid,\n label,\n onClear,\n onInputClick,\n placeholder,\n selectedValueRender,\n theme,\n value,\n variant,\n ...forwardedProps\n}) => {\n return (\n <>\n {variant === SelectVariant.input && (\n <>\n {label && (\n <div className={`${CLASSNAME}__header`}>\n <InputLabel\n htmlFor={id}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={anchorRef as RefObject<HTMLDivElement>}\n id={id}\n className={`${CLASSNAME}__wrapper`}\n onClick={onInputClick}\n onKeyDown={handleKeyboardNav}\n tabIndex={isDisabled ? undefined : 0}\n aria-disabled={isDisabled || undefined}\n {...forwardedProps}\n >\n {icon && (\n <Icon\n className={`${CLASSNAME}__input-icon`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={icon}\n size={Size.xs}\n />\n )}\n\n <div\n className={classNames([\n `${CLASSNAME}__input-native`,\n isEmpty && placeholder && `${CLASSNAME}__input-native--placeholder`,\n ])}\n >\n {!isEmpty && <span>{selectedValueRender?.(value)}</span>}\n\n {isEmpty && placeholder && <span>{placeholder}</span>}\n </div>\n\n {(isValid || hasError) && (\n <div className={`${CLASSNAME}__input-validity`}>\n <Icon icon={isValid ? mdiCheckCircle : mdiAlertCircle} size={Size.xxs} />\n </div>\n )}\n\n {hasInputClear && clearButtonProps && (\n <IconButton\n {...clearButtonProps}\n className={`${CLASSNAME}__input-clear`}\n icon={mdiCloseCircle}\n emphasis={Emphasis.low}\n size={Size.s}\n theme={theme}\n onClick={onClear}\n onKeyDown={stopPropagation}\n />\n )}\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiMenuDown} size={Size.s} />\n </div>\n </div>\n </>\n )}\n\n {variant === SelectVariant.chip && (\n <Chip\n id={id}\n isSelected={!isEmpty}\n isDisabled={isDisabled}\n after={<Icon icon={isEmpty ? mdiMenuDown : mdiCloseCircle} />}\n onAfterClick={isEmpty ? onInputClick : onClear}\n onClick={onInputClick}\n ref={anchorRef as RefObject<HTMLAnchorElement>}\n theme={theme}\n {...forwardedProps}\n >\n {isEmpty && <span>{label}</span>}\n\n {!isEmpty && <span>{selectedValueRender?.(value)}</span>}\n </Chip>\n )}\n </>\n );\n};\n\n/**\n * Select component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Select: Comp<SelectProps, HTMLDivElement> = forwardRef((props, ref) => {\n const isEmpty = lodashIsEmpty(props.value);\n const hasInputClear = props.onClear && props.clearButtonProps && !isEmpty;\n\n return WithSelectContext(\n SelectField,\n {\n ...props,\n className: classNames(\n props.className,\n handleBasicClasses({\n hasInputClear,\n hasUnique: !props.isEmpty,\n prefix: CLASSNAME,\n }),\n ),\n hasInputClear,\n isEmpty,\n },\n ref,\n );\n});\nSelect.displayName = COMPONENT_NAME;\nSelect.className = CLASSNAME;\nSelect.defaultProps = DEFAULT_PROPS;\nSelect.className = CLASSNAME;\n","import React, { forwardRef, ReactNode, RefObject, SyntheticEvent } from 'react';\n\nimport classNames from 'classnames';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiClose, mdiCloseCircle, mdiMenuDown } from '@lumx/icons';\n\nimport { Size, Theme } from '@lumx/react/components';\nimport { Chip } from '@lumx/react/components/chip/Chip';\nimport { Icon } from '@lumx/react/components/icon/Icon';\nimport { InputLabel } from '@lumx/react/components/input-label/InputLabel';\n\nimport { Comp, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { WithSelectContext } from './WithSelectContext';\nimport { CoreSelectProps, SelectVariant } from './constants';\n\n/** Defines the props of the component. */\nexport interface SelectMultipleProps extends CoreSelectProps {\n /** Selected values. */\n value: string[];\n /** Selected value render function. Default: Renders the value inside of a Chip. */\n selectedChipRender?(\n choice: string,\n index: number,\n onClear?: (event: SyntheticEvent, choice: string) => void,\n isDisabled?: boolean,\n theme?: any,\n ): ReactNode | string;\n}\n\n/** The display name of the component. */\nconst COMPONENT_NAME = 'Select';\n\n/** The default class name and classes prefix for this component. */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/** The default value of props. */\nconst DEFAULT_PROPS: Partial<SelectMultipleProps> = {\n selectedChipRender(choice, index, onClear, isDisabled?, theme?) {\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 theme={theme}\n >\n {choice}\n </Chip>\n );\n },\n selectedValueRender: (choice) => choice,\n};\n\nexport const SelectMultipleField: React.FC<SelectMultipleProps> = ({\n anchorRef,\n handleKeyboardNav,\n hasError,\n icon,\n id,\n isDisabled,\n isEmpty,\n isRequired,\n isValid,\n label,\n onClear,\n onInputClick,\n placeholder,\n selectedChipRender,\n selectedValueRender,\n theme,\n value,\n variant,\n ...forwardedProps\n}) => (\n <>\n {variant === SelectVariant.input && (\n <>\n {label && (\n <div className={`${CLASSNAME}__header`}>\n <InputLabel\n htmlFor={id}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n </div>\n )}\n\n {/* eslint-disable-next-line jsx-a11y/no-static-element-interactions */}\n <div\n ref={anchorRef as RefObject<HTMLDivElement>}\n id={id}\n className={`${CLASSNAME}__wrapper`}\n onClick={onInputClick}\n onKeyDown={handleKeyboardNav}\n tabIndex={isDisabled ? undefined : 0}\n aria-disabled={isDisabled || undefined}\n {...forwardedProps}\n >\n {icon && (\n <Icon\n className={`${CLASSNAME}__input-icon`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={icon}\n size={Size.xs}\n />\n )}\n\n <div className={`${CLASSNAME}__chips`}>\n {!isEmpty &&\n value.map((val, index) => selectedChipRender?.(val, index, onClear, isDisabled, theme))}\n </div>\n\n {isEmpty && placeholder && (\n <div\n className={classNames([\n `${CLASSNAME}__input-native`,\n `${CLASSNAME}__input-native--placeholder`,\n ])}\n >\n <span>{placeholder}</span>\n </div>\n )}\n\n {(isValid || hasError) && (\n <div className={`${CLASSNAME}__input-validity`}>\n <Icon icon={isValid ? mdiCheckCircle : mdiAlertCircle} size={Size.xxs} />\n </div>\n )}\n\n <div className={`${CLASSNAME}__input-indicator`}>\n <Icon icon={mdiMenuDown} size={Size.s} />\n </div>\n </div>\n </>\n )}\n\n {variant === SelectVariant.chip && (\n <Chip\n id={id}\n isSelected={!isEmpty}\n isDisabled={isDisabled}\n after={<Icon icon={isEmpty ? mdiMenuDown : mdiCloseCircle} />}\n onAfterClick={isEmpty ? onInputClick : onClear}\n onClick={onInputClick}\n ref={anchorRef as RefObject<HTMLAnchorElement>}\n theme={theme}\n {...forwardedProps}\n >\n {isEmpty && <span>{label}</span>}\n\n {!isEmpty && (\n <span>\n <span>{selectedValueRender?.(value[0])}</span>\n\n {value.length > 1 && <span>&nbsp;+{value.length - 1}</span>}\n </span>\n )}\n </Chip>\n )}\n </>\n);\n\n/**\n * SelectMultiple component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const SelectMultiple: Comp<SelectMultipleProps, HTMLDivElement> = forwardRef((props, ref) => {\n return WithSelectContext(\n SelectMultipleField,\n {\n ...props,\n className: classNames(\n props.className,\n handleBasicClasses({\n hasMultiple: !props.isEmpty,\n prefix: CLASSNAME,\n }),\n ),\n isEmpty: props.value.length === 0,\n isMultiple: true,\n },\n ref,\n );\n});\nSelectMultiple.displayName = COMPONENT_NAME;\nSelectMultiple.className = CLASSNAME;\nSelectMultiple.defaultProps = DEFAULT_PROPS;\n"],"names":["useListenFocus","ref","useState","isFocus","setFocus","useEffect","element","current","undefined","onFocus","onBlur","addEventListener","removeEventListener","SelectVariant","input","chip","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","theme","Theme","light","variant","WithSelectContext","SelectElement","children","className","isMultiple","closeOnClick","disabled","error","hasError","helper","id","isDisabled","isEmpty","isOpen","isRequired","isValid","label","onClear","onDropdownClose","onInfiniteScroll","onInputClick","placeholder","value","forwardedProps","selectId","useMemo","uid","anchorRef","useRef","selectRef","handleKeyboardNav","useCallback","evt","key","preventDefault","onClose","blur","mergeRefs","classNames","handleBasicClasses","hasLabel","Boolean","hasPlaceholder","hasValue","prefix","dark","Placement","BOTTOM_START","Kind","selectedValueRender","choice","stopPropagation","SelectField","clearButtonProps","hasInputClear","icon","Size","xs","mdiCheckCircle","mdiAlertCircle","xxs","mdiCloseCircle","Emphasis","low","s","mdiMenuDown","Select","forwardRef","props","lodashIsEmpty","hasUnique","displayName","defaultProps","selectedChipRender","index","onClick","event","mdiClose","SelectMultipleField","map","val","length","SelectMultiple","hasMultiple"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"TextField.js","sources":["../../../src/components/text-field/TextField.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, RefObject, SyntheticEvent, useEffect, useMemo, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\nimport get from 'lodash/get';\nimport { uid } from 'uid';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiCloseCircle } from '@lumx/icons';\nimport { Emphasis, Icon, IconButton, IconButtonProps, InputHelper, InputLabel, Kind, Size, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface TextFieldProps extends GenericProps {\n /** Chip Group to be rendered before the main text input. */\n chips?: HTMLElement | ReactNode;\n /** Props to pass to the clear button (minus those already set by the TextField props). If not specified, the button won't be displayed. */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /** Error message. */\n error?: string | ReactNode;\n /** Whether we force the focus style or not. */\n forceFocusStyle?: boolean;\n /** Whether the text field is displayed with error style or not. */\n hasError?: boolean;\n /** Additional element to put at the end of the text field. */\n afterElement?: ReactNode;\n /** Helper text. */\n helper?: string | ReactNode;\n /** Icon (SVG path). */\n icon?: string;\n /** Native input id property (generated if not provided to link the label element). */\n id?: string;\n /** Reference to the <input> or <textarea> element. */\n inputRef?: RefObject<HTMLInputElement> | RefObject<HTMLTextAreaElement>;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is required or not. */\n isRequired?: boolean;\n /** Whether the text field is displayed with valid style or not. */\n isValid?: boolean;\n /** Label text. */\n label?: string;\n /** Max string length the input accepts (constrains the input and displays a character counter). */\n maxLength?: number;\n /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */\n minimumRows?: number;\n /** Whether the text field is a textarea or an input. */\n multiline?: boolean;\n /** Native input name property. */\n name?: string;\n /** Placeholder text. */\n placeholder?: string;\n /** Reference to the wrapper. */\n textFieldRef?: RefObject<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Value. */\n value?: string;\n /** On blur callback. */\n onBlur?(event: React.FocusEvent): void;\n /** On change callback. */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /** On focus callback. */\n onFocus?(event: React.FocusEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TextField';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Default minimum number of rows in the multiline mode.\n */\nconst DEFAULT_MIN_ROWS = 2;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TextFieldProps> = {\n theme: Theme.light,\n type: 'text',\n};\n\n/**\n * Hook that allows to calculate the number of rows needed for a text area.\n * @param minimumRows Minimum number of rows that we want to display.\n * @return rows to be used and a callback to recalculate\n */\nconst useComputeNumberOfRows = (\n minimumRows: number,\n): {\n /** number of rows to be used on the text area */\n rows: number;\n /**\n * Callback in order to recalculate the number of rows due to a change on the text area\n */\n recomputeNumberOfRows(target: Element): void;\n} => {\n const [rows, setRows] = useState(minimumRows);\n\n const recompute = (target: Element) => {\n /**\n * HEAD's UP! This part is a little bit tricky. The idea here is to only\n * display the necessary rows on the textarea. In order to dynamically adjust\n * the height on that field, we need to:\n * 1. Set the current amount of rows to the minimum. That will make the scroll appear.\n * 2. With that, we will have the `scrollHeight`, meaning the height of the container adjusted to the current content\n * 3. With the scroll height, we can figure out how many rows we need to use by dividing the scroll height\n * by the line height.\n * 4. With that number, we can readjust the number of rows on the text area. We need to do that here, if we leave that to\n * the state change through React, there are some scenarios (resize, hitting ENTER or BACKSPACE which add or remove lines)\n * when we will not see the update and the rows will be resized to the minimum.\n * 5. In case there is any other update on the component that changes the UI, we need to keep the number of rows\n * on the state in order to allow React to re-render. Therefore, we save them using `useState`\n */\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = minimumRows;\n let currentRows = target.scrollHeight / (target.clientHeight / minimumRows);\n currentRows = currentRows >= minimumRows ? currentRows : minimumRows;\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = currentRows;\n\n setRows(currentRows);\n };\n\n return {\n recomputeNumberOfRows: recompute,\n rows,\n };\n};\n\ninterface InputNativeProps {\n id?: string;\n inputRef?: RefObject<HTMLInputElement> | RefObject<HTMLTextAreaElement>;\n isDisabled?: boolean;\n isRequired?: boolean;\n multiline?: boolean;\n maxLength?: number;\n placeholder?: string;\n rows: number;\n type: string;\n name?: string;\n value?: string;\n setFocus(focus: boolean): void;\n recomputeNumberOfRows(target: Element): void;\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n onFocus?(value: React.FocusEvent): void;\n onBlur?(value: React.FocusEvent): void;\n}\n\nconst renderInputNative: React.FC<InputNativeProps> = (props) => {\n const {\n id,\n isDisabled,\n isRequired,\n placeholder,\n multiline,\n value,\n setFocus,\n onChange,\n onFocus,\n onBlur,\n inputRef,\n rows,\n recomputeNumberOfRows,\n type,\n name,\n ...forwardedProps\n } = props;\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const ref = useRef<HTMLElement>(null);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n // Recompute the number of rows for the first rendering\n if (multiline && ref && ref.current) {\n recomputeNumberOfRows(ref.current);\n }\n }, [ref, multiline, recomputeNumberOfRows, value]);\n\n const onTextFieldFocus = (event: React.FocusEvent) => {\n onFocus?.(event);\n setFocus(true);\n };\n\n const onTextFieldBlur = (event: React.FocusEvent) => {\n onBlur?.(event);\n setFocus(false);\n };\n\n const handleChange = (event: React.ChangeEvent) => {\n onChange(get(event, 'target.value'), name, event);\n };\n\n const Component = multiline ? 'textarea' : 'input';\n const inputProps: any = {\n ...forwardedProps,\n id,\n className: multiline\n ? `${CLASSNAME}__input-native ${CLASSNAME}__input-native--textarea`\n : `${CLASSNAME}__input-native ${CLASSNAME}__input-native--text`,\n placeholder,\n value,\n name,\n disabled: isDisabled,\n required: isRequired,\n onFocus: onTextFieldFocus,\n onBlur: onTextFieldBlur,\n onChange: handleChange,\n ref: mergeRefs(inputRef as any, ref) as any,\n };\n if (multiline) {\n inputProps.rows = rows;\n } else {\n inputProps.type = type;\n }\n return <Component {...inputProps} />;\n};\n\n/**\n * TextField component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TextField: Comp<TextFieldProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n chips,\n className,\n clearButtonProps,\n disabled,\n error,\n forceFocusStyle,\n hasError,\n helper,\n icon,\n id,\n inputRef,\n isDisabled = disabled,\n isRequired,\n isValid,\n label,\n maxLength,\n minimumRows,\n multiline,\n name,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n textFieldRef,\n theme,\n type,\n value,\n afterElement,\n ...forwardedProps\n } = props;\n const textFieldId = useMemo(() => id || `text-field-${uid()}`, [id]);\n const [isFocus, setFocus] = useState(false);\n const { rows, recomputeNumberOfRows } = useComputeNumberOfRows(multiline ? minimumRows || DEFAULT_MIN_ROWS : 0);\n const valueLength = (value || '').length;\n const isNotEmpty = valueLength > 0;\n\n /**\n * Function triggered when the Clear Button is clicked.\n * The idea is to execute the `onChange` callback with an empty string\n * and remove focus from the clear button.\n * @param evt On clear event.\n */\n const onClear = (evt: React.ChangeEvent) => {\n evt.nativeEvent.preventDefault();\n evt.nativeEvent.stopPropagation();\n (evt.currentTarget as HTMLElement).blur();\n\n onChange('');\n };\n\n return (\n <div\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n hasChips: Boolean(chips),\n hasError: !isValid && hasError,\n hasIcon: Boolean(icon),\n hasInput: !multiline,\n hasInputClear: clearButtonProps && isNotEmpty,\n hasLabel: Boolean(label),\n hasPlaceholder: Boolean(placeholder),\n hasTextarea: multiline,\n hasValue: Boolean(value),\n isDisabled,\n isFocus: isFocus || forceFocusStyle,\n isValid,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n {(label || maxLength) && (\n <div className={`${CLASSNAME}__header`}>\n {label && (\n <InputLabel\n htmlFor={textFieldId}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n )}\n\n {maxLength && (\n <div className={`${CLASSNAME}__char-counter`}>\n <span>{maxLength - valueLength}</span>\n {maxLength - valueLength === 0 && <Icon icon={mdiAlertCircle} size={Size.xxs} />}\n </div>\n )}\n </div>\n )}\n\n <div className={`${CLASSNAME}__wrapper`} ref={textFieldRef}>\n {icon && (\n <Icon\n className={`${CLASSNAME}__input-icon`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={icon}\n size={Size.xs}\n />\n )}\n\n {chips && (\n <div className={`${CLASSNAME}__chips`}>\n {chips}\n\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {!chips && (\n <div className={`${CLASSNAME}__input-wrapper`}>\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {(isValid || hasError) && (\n <Icon\n className={`${CLASSNAME}__input-validity`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={isValid ? mdiCheckCircle : mdiAlertCircle}\n size={Size.xxs}\n />\n )}\n\n {clearButtonProps && isNotEmpty && (\n <IconButton\n {...clearButtonProps}\n className={`${CLASSNAME}__input-clear`}\n icon={mdiCloseCircle}\n emphasis={Emphasis.low}\n size={Size.s}\n theme={theme}\n onClick={onClear}\n type=\"button\"\n />\n )}\n\n {afterElement && <div className={`${CLASSNAME}__after-element`}>{afterElement}</div>}\n </div>\n\n {hasError && error && (\n <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n {error}\n </InputHelper>\n )}\n\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n );\n});\nTextField.displayName = COMPONENT_NAME;\nTextField.className = CLASSNAME;\nTextField.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_MIN_ROWS","DEFAULT_PROPS","theme","Theme","light","type","useComputeNumberOfRows","minimumRows","useState","rows","setRows","recompute","target","currentRows","scrollHeight","clientHeight","recomputeNumberOfRows","renderInputNative","props","id","isDisabled","isRequired","placeholder","multiline","value","setFocus","onChange","onFocus","onBlur","inputRef","name","forwardedProps","ref","useRef","useEffect","current","onTextFieldFocus","event","onTextFieldBlur","handleChange","get","Component","inputProps","className","disabled","required","mergeRefs","TextField","forwardRef","chips","clearButtonProps","error","forceFocusStyle","hasError","helper","icon","isValid","label","maxLength","textFieldRef","afterElement","textFieldId","useMemo","uid","isFocus","valueLength","length","isNotEmpty","onClear","evt","nativeEvent","preventDefault","stopPropagation","currentTarget","blur","classNames","handleBasicClasses","hasChips","Boolean","hasIcon","hasInput","hasInputClear","hasLabel","hasPlaceholder","hasTextarea","hasValue","prefix","mdiAlertCircle","Size","xxs","dark","undefined","xs","mdiCheckCircle","mdiCloseCircle","Emphasis","low","s","Kind","displayName","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"TextField.js","sources":["../../../src/components/text-field/TextField.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, Ref, SyntheticEvent, useEffect, useMemo, useRef, useState } from 'react';\n\nimport classNames from 'classnames';\nimport get from 'lodash/get';\nimport { uid } from 'uid';\n\nimport { mdiAlertCircle, mdiCheckCircle, mdiCloseCircle } from '@lumx/icons';\nimport { Emphasis, Icon, IconButton, IconButtonProps, InputHelper, InputLabel, Kind, Size, Theme } from '@lumx/react';\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\n\n/**\n * Defines the props of the component.\n */\nexport interface TextFieldProps extends GenericProps {\n /** Chip Group to be rendered before the main text input. */\n chips?: HTMLElement | ReactNode;\n /** Props to pass to the clear button (minus those already set by the TextField props). If not specified, the button won't be displayed. */\n clearButtonProps?: Pick<IconButtonProps, 'label'> &\n Omit<IconButtonProps, 'label' | 'onClick' | 'icon' | 'emphasis'>;\n /** Error message. */\n error?: string | ReactNode;\n /** Whether we force the focus style or not. */\n forceFocusStyle?: boolean;\n /** Whether the text field is displayed with error style or not. */\n hasError?: boolean;\n /** Additional element to put at the end of the text field. */\n afterElement?: ReactNode;\n /** Helper text. */\n helper?: string | ReactNode;\n /** Icon (SVG path). */\n icon?: string;\n /** Native input id property (generated if not provided to link the label element). */\n id?: string;\n /** Reference to the <input> or <textarea> element. */\n inputRef?: Ref<HTMLInputElement | HTMLTextAreaElement>;\n /** Whether the component is disabled or not. */\n isDisabled?: boolean;\n /** Whether the component is required or not. */\n isRequired?: boolean;\n /** Whether the text field is displayed with valid style or not. */\n isValid?: boolean;\n /** Label text. */\n label?: string;\n /** Max string length the input accepts (constrains the input and displays a character counter). */\n maxLength?: number;\n /** Minimum number of rows displayed in multiline mode (requires `multiline` to be enabled). */\n minimumRows?: number;\n /** Whether the text field is a textarea or an input. */\n multiline?: boolean;\n /** Native input name property. */\n name?: string;\n /** Placeholder text. */\n placeholder?: string;\n /** Reference to the wrapper. */\n textFieldRef?: Ref<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Value. */\n value?: string;\n /** On blur callback. */\n onBlur?(event: React.FocusEvent): void;\n /** On change callback. */\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n /** On focus callback. */\n onFocus?(event: React.FocusEvent): void;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'TextField';\n\n/**\n * Component default class name and class prefix.\n */\nconst CLASSNAME = getRootClassName(COMPONENT_NAME);\n\n/**\n * Default minimum number of rows in the multiline mode.\n */\nconst DEFAULT_MIN_ROWS = 2;\n\n/**\n * Component default props.\n */\nconst DEFAULT_PROPS: Partial<TextFieldProps> = {\n theme: Theme.light,\n type: 'text',\n};\n\n/**\n * Hook that allows to calculate the number of rows needed for a text area.\n * @param minimumRows Minimum number of rows that we want to display.\n * @return rows to be used and a callback to recalculate\n */\nconst useComputeNumberOfRows = (\n minimumRows: number,\n): {\n /** number of rows to be used on the text area */\n rows: number;\n /**\n * Callback in order to recalculate the number of rows due to a change on the text area\n */\n recomputeNumberOfRows(target: Element): void;\n} => {\n const [rows, setRows] = useState(minimumRows);\n\n const recompute = (target: Element) => {\n /**\n * HEAD's UP! This part is a little bit tricky. The idea here is to only\n * display the necessary rows on the textarea. In order to dynamically adjust\n * the height on that field, we need to:\n * 1. Set the current amount of rows to the minimum. That will make the scroll appear.\n * 2. With that, we will have the `scrollHeight`, meaning the height of the container adjusted to the current content\n * 3. With the scroll height, we can figure out how many rows we need to use by dividing the scroll height\n * by the line height.\n * 4. With that number, we can readjust the number of rows on the text area. We need to do that here, if we leave that to\n * the state change through React, there are some scenarios (resize, hitting ENTER or BACKSPACE which add or remove lines)\n * when we will not see the update and the rows will be resized to the minimum.\n * 5. In case there is any other update on the component that changes the UI, we need to keep the number of rows\n * on the state in order to allow React to re-render. Therefore, we save them using `useState`\n */\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = minimumRows;\n let currentRows = target.scrollHeight / (target.clientHeight / minimumRows);\n currentRows = currentRows >= minimumRows ? currentRows : minimumRows;\n // eslint-disable-next-line no-param-reassign\n (target as HTMLTextAreaElement).rows = currentRows;\n\n setRows(currentRows);\n };\n\n return {\n recomputeNumberOfRows: recompute,\n rows,\n };\n};\n\ninterface InputNativeProps {\n id?: string;\n inputRef?: TextFieldProps['inputRef'];\n isDisabled?: boolean;\n isRequired?: boolean;\n multiline?: boolean;\n maxLength?: number;\n placeholder?: string;\n rows: number;\n type: string;\n name?: string;\n value?: string;\n setFocus(focus: boolean): void;\n recomputeNumberOfRows(target: Element): void;\n onChange(value: string, name?: string, event?: SyntheticEvent): void;\n onFocus?(value: React.FocusEvent): void;\n onBlur?(value: React.FocusEvent): void;\n}\n\nconst renderInputNative: React.FC<InputNativeProps> = (props) => {\n const {\n id,\n isDisabled,\n isRequired,\n placeholder,\n multiline,\n value,\n setFocus,\n onChange,\n onFocus,\n onBlur,\n inputRef,\n rows,\n recomputeNumberOfRows,\n type,\n name,\n ...forwardedProps\n } = props;\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const ref = useRef<HTMLElement>(null);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\n useEffect(() => {\n // Recompute the number of rows for the first rendering\n if (multiline && ref && ref.current) {\n recomputeNumberOfRows(ref.current);\n }\n }, [ref, multiline, recomputeNumberOfRows, value]);\n\n const onTextFieldFocus = (event: React.FocusEvent) => {\n onFocus?.(event);\n setFocus(true);\n };\n\n const onTextFieldBlur = (event: React.FocusEvent) => {\n onBlur?.(event);\n setFocus(false);\n };\n\n const handleChange = (event: React.ChangeEvent) => {\n onChange(get(event, 'target.value'), name, event);\n };\n\n const Component = multiline ? 'textarea' : 'input';\n const inputProps: any = {\n ...forwardedProps,\n id,\n className: multiline\n ? `${CLASSNAME}__input-native ${CLASSNAME}__input-native--textarea`\n : `${CLASSNAME}__input-native ${CLASSNAME}__input-native--text`,\n placeholder,\n value,\n name,\n disabled: isDisabled,\n required: isRequired,\n onFocus: onTextFieldFocus,\n onBlur: onTextFieldBlur,\n onChange: handleChange,\n ref: mergeRefs(inputRef as any, ref) as any,\n };\n if (multiline) {\n inputProps.rows = rows;\n } else {\n inputProps.type = type;\n }\n return <Component {...inputProps} />;\n};\n\n/**\n * TextField component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const TextField: Comp<TextFieldProps, HTMLDivElement> = forwardRef((props, ref) => {\n const {\n chips,\n className,\n clearButtonProps,\n disabled,\n error,\n forceFocusStyle,\n hasError,\n helper,\n icon,\n id,\n inputRef,\n isDisabled = disabled,\n isRequired,\n isValid,\n label,\n maxLength,\n minimumRows,\n multiline,\n name,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n textFieldRef,\n theme,\n type,\n value,\n afterElement,\n ...forwardedProps\n } = props;\n const textFieldId = useMemo(() => id || `text-field-${uid()}`, [id]);\n const [isFocus, setFocus] = useState(false);\n const { rows, recomputeNumberOfRows } = useComputeNumberOfRows(multiline ? minimumRows || DEFAULT_MIN_ROWS : 0);\n const valueLength = (value || '').length;\n const isNotEmpty = valueLength > 0;\n\n /**\n * Function triggered when the Clear Button is clicked.\n * The idea is to execute the `onChange` callback with an empty string\n * and remove focus from the clear button.\n * @param evt On clear event.\n */\n const onClear = (evt: React.ChangeEvent) => {\n evt.nativeEvent.preventDefault();\n evt.nativeEvent.stopPropagation();\n (evt.currentTarget as HTMLElement).blur();\n\n onChange('');\n };\n\n return (\n <div\n ref={ref}\n className={classNames(\n className,\n handleBasicClasses({\n hasChips: Boolean(chips),\n hasError: !isValid && hasError,\n hasIcon: Boolean(icon),\n hasInput: !multiline,\n hasInputClear: clearButtonProps && isNotEmpty,\n hasLabel: Boolean(label),\n hasPlaceholder: Boolean(placeholder),\n hasTextarea: multiline,\n hasValue: Boolean(value),\n isDisabled,\n isFocus: isFocus || forceFocusStyle,\n isValid,\n prefix: CLASSNAME,\n theme,\n }),\n )}\n >\n {(label || maxLength) && (\n <div className={`${CLASSNAME}__header`}>\n {label && (\n <InputLabel\n htmlFor={textFieldId}\n className={`${CLASSNAME}__label`}\n isRequired={isRequired}\n theme={theme}\n >\n {label}\n </InputLabel>\n )}\n\n {maxLength && (\n <div className={`${CLASSNAME}__char-counter`}>\n <span>{maxLength - valueLength}</span>\n {maxLength - valueLength === 0 && <Icon icon={mdiAlertCircle} size={Size.xxs} />}\n </div>\n )}\n </div>\n )}\n\n <div className={`${CLASSNAME}__wrapper`} ref={textFieldRef}>\n {icon && (\n <Icon\n className={`${CLASSNAME}__input-icon`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={icon}\n size={Size.xs}\n />\n )}\n\n {chips && (\n <div className={`${CLASSNAME}__chips`}>\n {chips}\n\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {!chips && (\n <div className={`${CLASSNAME}__input-wrapper`}>\n {renderInputNative({\n id: textFieldId,\n inputRef,\n isDisabled,\n isRequired,\n maxLength,\n multiline,\n onBlur,\n onChange,\n onFocus,\n placeholder,\n recomputeNumberOfRows,\n rows,\n setFocus,\n type,\n value,\n name,\n ...forwardedProps,\n })}\n </div>\n )}\n\n {(isValid || hasError) && (\n <Icon\n className={`${CLASSNAME}__input-validity`}\n color={theme === Theme.dark ? 'light' : undefined}\n icon={isValid ? mdiCheckCircle : mdiAlertCircle}\n size={Size.xxs}\n />\n )}\n\n {clearButtonProps && isNotEmpty && (\n <IconButton\n {...clearButtonProps}\n className={`${CLASSNAME}__input-clear`}\n icon={mdiCloseCircle}\n emphasis={Emphasis.low}\n size={Size.s}\n theme={theme}\n onClick={onClear}\n type=\"button\"\n />\n )}\n\n {afterElement && <div className={`${CLASSNAME}__after-element`}>{afterElement}</div>}\n </div>\n\n {hasError && error && (\n <InputHelper className={`${CLASSNAME}__helper`} kind={Kind.error} theme={theme}>\n {error}\n </InputHelper>\n )}\n\n {helper && (\n <InputHelper className={`${CLASSNAME}__helper`} theme={theme}>\n {helper}\n </InputHelper>\n )}\n </div>\n );\n});\nTextField.displayName = COMPONENT_NAME;\nTextField.className = CLASSNAME;\nTextField.defaultProps = DEFAULT_PROPS;\n"],"names":["COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_MIN_ROWS","DEFAULT_PROPS","theme","Theme","light","type","useComputeNumberOfRows","minimumRows","useState","rows","setRows","recompute","target","currentRows","scrollHeight","clientHeight","recomputeNumberOfRows","renderInputNative","props","id","isDisabled","isRequired","placeholder","multiline","value","setFocus","onChange","onFocus","onBlur","inputRef","name","forwardedProps","ref","useRef","useEffect","current","onTextFieldFocus","event","onTextFieldBlur","handleChange","get","Component","inputProps","className","disabled","required","mergeRefs","TextField","forwardRef","chips","clearButtonProps","error","forceFocusStyle","hasError","helper","icon","isValid","label","maxLength","textFieldRef","afterElement","textFieldId","useMemo","uid","isFocus","valueLength","length","isNotEmpty","onClear","evt","nativeEvent","preventDefault","stopPropagation","currentTarget","blur","classNames","handleBasicClasses","hasChips","Boolean","hasIcon","hasInput","hasInputClear","hasLabel","hasPlaceholder","hasTextarea","hasValue","prefix","mdiAlertCircle","Size","xxs","dark","undefined","xs","mdiCheckCircle","mdiCloseCircle","Emphasis","low","s","Kind","displayName","defaultProps"],"mappings":"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"}
@@ -1 +1 @@
1
- {"version":3,"file":"Thumbnail2.js","sources":["../../../src/components/thumbnail/useImageLoad.ts","../../../src/components/thumbnail/useFocusPointStyle.tsx","../../../src/components/thumbnail/Thumbnail.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type LoadingState = 'isLoading' | 'isLoaded' | 'hasError';\n\nfunction getState(img: HTMLImageElement | null | undefined, event?: Event) {\n // Error event occurred or image loaded empty.\n if (event?.type === 'error' || (img?.complete && (img?.naturalWidth === 0 || img?.naturalHeight === 0))) {\n return 'hasError';\n }\n // Image is undefined or incomplete.\n if (!img || !img.complete) {\n return 'isLoading';\n }\n // Else loaded.\n return 'isLoaded';\n}\n\nexport function useImageLoad(imageURL: string, imgRef?: HTMLImageElement): LoadingState {\n const [state, setState] = useState<LoadingState>(getState(imgRef));\n\n // Update state when changing image URL or DOM reference.\n useEffect(() => {\n setState(getState(imgRef));\n }, [imageURL, imgRef]);\n\n // Listen to `load` and `error` event on image\n useEffect(() => {\n const img = imgRef;\n if (!img) return undefined;\n const update = (event?: Event) => setState(getState(img, event));\n img.addEventListener('load', update);\n img.addEventListener('error', update);\n return () => {\n img.removeEventListener('load', update);\n img.removeEventListener('error', update);\n };\n }, [imgRef, imgRef?.src]);\n\n return state;\n}\n","import { CSSProperties, useEffect, useMemo, useState } from 'react';\nimport { AspectRatio } from '@lumx/react/components';\nimport { ThumbnailProps } from '@lumx/react/components/thumbnail/Thumbnail';\n\n// Calculate shift to center the focus point in the container.\nfunction shiftPosition(scale: number, focusPoint: number, imageSize: number, containerSize: number) {\n const scaledSize = imageSize / scale;\n const scaledFocusHeight = focusPoint * scaledSize;\n const startFocus = scaledFocusHeight - containerSize / 2;\n const shift = startFocus / (scaledSize - containerSize);\n return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);\n}\n\ntype Size = { width: number; height: number };\n\n// Compute CSS properties to apply the focus point.\nexport const useFocusPointStyle = (\n { image, aspectRatio, focusPoint, imgProps: { width, height } = {} }: ThumbnailProps,\n element: HTMLImageElement | undefined,\n isLoaded: boolean,\n): CSSProperties => {\n // Get natural image size from imgProps or img element.\n const imageSize: Size | undefined = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) return undefined;\n if (typeof width === 'number' && typeof height === 'number') return { width, height };\n if (element && isLoaded) return { width: element.naturalWidth, height: element.naturalHeight };\n return undefined;\n }, [aspectRatio, element, focusPoint?.x, focusPoint?.y, height, image, isLoaded, width]);\n\n // Get container size (dependant on imageSize).\n const [containerSize, setContainerSize] = useState<Size | undefined>(undefined);\n useEffect(\n function updateContainerSize() {\n const cWidth = element?.offsetWidth;\n const cHeight = element?.offsetHeight;\n if (cWidth && cHeight) {\n // Update only if needed.\n setContainerSize((oldContainerSize) =>\n oldContainerSize?.width === cWidth && oldContainerSize.height === cHeight\n ? oldContainerSize\n : { width: cWidth, height: cHeight },\n );\n } else if (imageSize) {\n // Wait for a render (in case the container size is dependent on the image size).\n requestAnimationFrame(updateContainerSize);\n }\n },\n [element?.offsetHeight, element?.offsetWidth, imageSize],\n );\n\n // Compute style.\n const [style, setStyle] = useState<CSSProperties>({});\n useEffect(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) {\n return;\n }\n if (!element || !imageSize) {\n // Focus point can be computed but now right now (image size unknown).\n setStyle({ visibility: 'hidden' });\n return;\n }\n if (!containerSize) {\n // Missing container size abort focus point compute.\n setStyle({});\n return;\n }\n\n const heightScale = imageSize.height / containerSize.height;\n const widthScale = imageSize.width / containerSize.width;\n const scale = Math.min(widthScale, heightScale);\n\n // Focus Y relative to the top (instead of the center)\n const focusPointFromTop = Math.abs((focusPoint?.y || 0) - 1) / 2;\n const y = shiftPosition(scale, focusPointFromTop, imageSize.height, containerSize.height);\n\n // Focus X relative to the left (instead of the center)\n const focusPointFromLeft = Math.abs((focusPoint?.x || 0) + 1) / 2;\n const x = shiftPosition(scale, focusPointFromLeft, imageSize.width, containerSize.width);\n\n const objectPosition = `${x}% ${y}%`;\n\n // Update only if needed.\n setStyle((oldStyle) => (oldStyle.objectPosition === objectPosition ? oldStyle : { objectPosition }));\n }, [aspectRatio, containerSize, element, focusPoint?.x, focusPoint?.y, image, imageSize]);\n\n return style;\n};\n","import React, {\n CSSProperties,\n forwardRef,\n ImgHTMLAttributes,\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n Ref,\n useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { AspectRatio, HorizontalAlignment, Icon, Size, Theme } from '@lumx/react';\n\nimport { Comp, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { mdiImageBroken } from '@lumx/icons';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';\nimport { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';\nimport { FocusPoint, ThumbnailSize, ThumbnailVariant } from './types';\n\ntype ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ThumbnailProps extends GenericProps {\n /** Alignment of the thumbnail in it's parent (requires flex parent). */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Badge. */\n badge?: ReactElement;\n /** Image cross origin resource policy. */\n crossOrigin?: ImgHTMLProps['crossOrigin'];\n /** Fallback icon (SVG path) or react node when image fails to load. */\n fallback?: string | ReactNode;\n /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */\n fillHeight?: boolean;\n /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */\n focusPoint?: FocusPoint;\n /** Image URL. */\n image: string;\n /** Props to inject into the native <img> element. */\n imgProps?: ImgHTMLProps;\n /** Reference to the native <img> element. */\n imgRef?: Ref<HTMLImageElement>;\n /** Set to true to force the display of the loading skeleton. */\n isLoading?: boolean;\n /** Size variant of the component. */\n size?: ThumbnailSize;\n /** Image loading mode. */\n loading?: ImgHTMLProps['loading'];\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Variant of the component. */\n variant?: ThumbnailVariant;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Thumbnail';\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<ThumbnailProps> = {\n fallback: mdiImageBroken,\n loading: 'lazy',\n theme: Theme.light,\n};\n\n/**\n * Thumbnail component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Thumbnail: Comp<ThumbnailProps> = forwardRef((props, ref) => {\n const {\n align,\n alt,\n aspectRatio = AspectRatio.original,\n badge,\n className,\n crossOrigin,\n fallback,\n fillHeight,\n // `focusPoint` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n focusPoint,\n image,\n imgProps,\n imgRef: propImgRef,\n isLoading: isLoadingProp,\n loading,\n size,\n theme,\n variant,\n linkProps,\n linkAs,\n ...forwardedProps\n } = props;\n const [imgElement, setImgElement] = useState<HTMLImageElement>();\n\n // Image loading state.\n const loadingState = useImageLoad(image, imgElement);\n const isLoaded = loadingState === 'isLoaded';\n const isLoading = isLoadingProp || loadingState === 'isLoading';\n const hasError = loadingState === 'hasError';\n\n // Focus point.\n const focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);\n\n const hasIconErrorFallback = hasError && typeof fallback === 'string';\n const hasCustomErrorFallback = hasError && !hasIconErrorFallback;\n const imageErrorStyle: CSSProperties = {};\n if (hasIconErrorFallback) {\n // Keep the image layout on icon fallback.\n imageErrorStyle.visibility = 'hidden';\n } else if (hasCustomErrorFallback) {\n // Remove the image on custom fallback.\n imageErrorStyle.display = 'none';\n }\n\n const isLink = Boolean(linkProps?.href || linkAs);\n const isButton = !!forwardedProps.onClick;\n const isClickable = isButton || isLink;\n\n let Wrapper: any = 'div';\n const wrapperProps = { ...forwardedProps };\n if (isLink) {\n Wrapper = linkAs || 'a';\n Object.assign(wrapperProps, linkProps);\n } else if (isButton) {\n Wrapper = 'button';\n wrapperProps.type = forwardedProps.type || 'button';\n wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;\n }\n\n return (\n <Wrapper\n {...wrapperProps}\n ref={ref}\n className={classNames(\n linkProps?.className,\n className,\n handleBasicClasses({\n align,\n aspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n isClickable,\n hasError,\n hasIconErrorFallback,\n hasCustomErrorFallback,\n isLoading,\n hasBadge: !!badge,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <div className={`${CLASSNAME}__background`}>\n <img\n {...imgProps}\n style={{\n ...imgProps?.style,\n ...imageErrorStyle,\n ...focusPointStyle,\n }}\n ref={mergeRefs(setImgElement, propImgRef)}\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__image`,\n isLoading,\n hasDefinedSize: Boolean(imgProps?.height && imgProps.width),\n }),\n imgProps?.className,\n )}\n crossOrigin={crossOrigin}\n src={image}\n alt={alt}\n loading={loading}\n />\n {!isLoading && hasError && (\n <div className={`${CLASSNAME}__fallback`}>\n {hasIconErrorFallback ? (\n <Icon icon={fallback as string} size={Size.xxs} theme={theme} />\n ) : (\n fallback\n )}\n </div>\n )}\n </div>\n {badge &&\n React.cloneElement(badge, { className: classNames(`${CLASSNAME}__badge`, badge.props.className) })}\n </Wrapper>\n );\n});\nThumbnail.displayName = COMPONENT_NAME;\nThumbnail.className = CLASSNAME;\nThumbnail.defaultProps = DEFAULT_PROPS;\n"],"names":["getState","img","event","type","complete","naturalWidth","naturalHeight","useImageLoad","imageURL","imgRef","useState","state","setState","useEffect","undefined","update","addEventListener","removeEventListener","src","shiftPosition","scale","focusPoint","imageSize","containerSize","scaledSize","scaledFocusHeight","startFocus","shift","Math","floor","max","min","useFocusPointStyle","element","isLoaded","image","aspectRatio","imgProps","width","height","useMemo","AspectRatio","original","x","y","setContainerSize","updateContainerSize","cWidth","offsetWidth","cHeight","offsetHeight","oldContainerSize","requestAnimationFrame","style","setStyle","visibility","heightScale","widthScale","focusPointFromTop","abs","focusPointFromLeft","objectPosition","oldStyle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","fallback","mdiImageBroken","loading","theme","Theme","light","Thumbnail","forwardRef","props","ref","align","alt","badge","className","crossOrigin","fillHeight","propImgRef","isLoadingProp","isLoading","size","variant","linkProps","linkAs","forwardedProps","imgElement","setImgElement","loadingState","hasError","focusPointStyle","hasIconErrorFallback","hasCustomErrorFallback","imageErrorStyle","display","isLink","Boolean","href","isButton","onClick","isClickable","Wrapper","wrapperProps","Object","assign","classNames","handleBasicClasses","prefix","hasBadge","mergeRefs","hasDefinedSize","Size","xxs","React","cloneElement","displayName","defaultProps"],"mappings":"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"}
1
+ {"version":3,"file":"Thumbnail2.js","sources":["../../../src/components/thumbnail/useImageLoad.ts","../../../src/components/thumbnail/useFocusPointStyle.tsx","../../../src/components/thumbnail/Thumbnail.tsx"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nexport type LoadingState = 'isLoading' | 'isLoaded' | 'hasError';\n\nfunction getState(img: HTMLImageElement | null | undefined, event?: Event) {\n // Error event occurred or image loaded empty.\n if (event?.type === 'error' || (img?.complete && (img?.naturalWidth === 0 || img?.naturalHeight === 0))) {\n return 'hasError';\n }\n // Image is undefined or incomplete.\n if (!img || !img.complete) {\n return 'isLoading';\n }\n // Else loaded.\n return 'isLoaded';\n}\n\nexport function useImageLoad(imageURL: string, imgRef?: HTMLImageElement): LoadingState {\n const [state, setState] = useState<LoadingState>(getState(imgRef));\n\n // Update state when changing image URL or DOM reference.\n useEffect(() => {\n setState(getState(imgRef));\n }, [imageURL, imgRef]);\n\n // Listen to `load` and `error` event on image\n useEffect(() => {\n const img = imgRef;\n if (!img) return undefined;\n const update = (event?: Event) => setState(getState(img, event));\n img.addEventListener('load', update);\n img.addEventListener('error', update);\n return () => {\n img.removeEventListener('load', update);\n img.removeEventListener('error', update);\n };\n }, [imgRef, imgRef?.src]);\n\n return state;\n}\n","import { CSSProperties, useEffect, useMemo, useState } from 'react';\nimport { AspectRatio } from '@lumx/react/components';\nimport { ThumbnailProps } from '@lumx/react/components/thumbnail/Thumbnail';\n\n// Calculate shift to center the focus point in the container.\nfunction shiftPosition(scale: number, focusPoint: number, imageSize: number, containerSize: number) {\n const scaledSize = imageSize / scale;\n const scaledFocusHeight = focusPoint * scaledSize;\n const startFocus = scaledFocusHeight - containerSize / 2;\n const shift = startFocus / (scaledSize - containerSize);\n return Math.floor(Math.max(Math.min(shift, 1), 0) * 100);\n}\n\ntype Size = { width: number; height: number };\n\n// Compute CSS properties to apply the focus point.\nexport const useFocusPointStyle = (\n { image, aspectRatio, focusPoint, imgProps: { width, height } = {} }: ThumbnailProps,\n element: HTMLImageElement | undefined,\n isLoaded: boolean,\n): CSSProperties => {\n // Get natural image size from imgProps or img element.\n const imageSize: Size | undefined = useMemo(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) return undefined;\n if (typeof width === 'number' && typeof height === 'number') return { width, height };\n if (element && isLoaded) return { width: element.naturalWidth, height: element.naturalHeight };\n return undefined;\n }, [aspectRatio, element, focusPoint?.x, focusPoint?.y, height, image, isLoaded, width]);\n\n // Get container size (dependant on imageSize).\n const [containerSize, setContainerSize] = useState<Size | undefined>(undefined);\n useEffect(\n function updateContainerSize() {\n const cWidth = element?.offsetWidth;\n const cHeight = element?.offsetHeight;\n if (cWidth && cHeight) {\n // Update only if needed.\n setContainerSize((oldContainerSize) =>\n oldContainerSize?.width === cWidth && oldContainerSize.height === cHeight\n ? oldContainerSize\n : { width: cWidth, height: cHeight },\n );\n } else if (imageSize) {\n // Wait for a render (in case the container size is dependent on the image size).\n requestAnimationFrame(updateContainerSize);\n }\n },\n [element?.offsetHeight, element?.offsetWidth, imageSize],\n );\n\n // Compute style.\n const [style, setStyle] = useState<CSSProperties>({});\n useEffect(() => {\n // Focus point is not applicable => exit early\n if (!image || aspectRatio === AspectRatio.original || (!focusPoint?.x && !focusPoint?.y)) {\n return;\n }\n if (!element || !imageSize) {\n // Focus point can be computed but now right now (image size unknown).\n setStyle({ visibility: 'hidden' });\n return;\n }\n if (!containerSize) {\n // Missing container size abort focus point compute.\n setStyle({});\n return;\n }\n\n const heightScale = imageSize.height / containerSize.height;\n const widthScale = imageSize.width / containerSize.width;\n const scale = Math.min(widthScale, heightScale);\n\n // Focus Y relative to the top (instead of the center)\n const focusPointFromTop = Math.abs((focusPoint?.y || 0) - 1) / 2;\n const y = shiftPosition(scale, focusPointFromTop, imageSize.height, containerSize.height);\n\n // Focus X relative to the left (instead of the center)\n const focusPointFromLeft = Math.abs((focusPoint?.x || 0) + 1) / 2;\n const x = shiftPosition(scale, focusPointFromLeft, imageSize.width, containerSize.width);\n\n const objectPosition = `${x}% ${y}%`;\n\n // Update only if needed.\n setStyle((oldStyle) => (oldStyle.objectPosition === objectPosition ? oldStyle : { objectPosition }));\n }, [aspectRatio, containerSize, element, focusPoint?.x, focusPoint?.y, image, imageSize]);\n\n return style;\n};\n","import React, {\n CSSProperties,\n forwardRef,\n ImgHTMLAttributes,\n KeyboardEventHandler,\n MouseEventHandler,\n ReactElement,\n ReactNode,\n Ref,\n useState,\n} from 'react';\nimport classNames from 'classnames';\n\nimport { AspectRatio, HorizontalAlignment, Icon, Size, Theme } from '@lumx/react';\n\nimport { Comp, Falsy, GenericProps, getRootClassName, handleBasicClasses } from '@lumx/react/utils';\n\nimport { mdiImageBroken } from '@lumx/icons';\nimport { mergeRefs } from '@lumx/react/utils/mergeRefs';\nimport { useImageLoad } from '@lumx/react/components/thumbnail/useImageLoad';\nimport { useFocusPointStyle } from '@lumx/react/components/thumbnail/useFocusPointStyle';\nimport { FocusPoint, ThumbnailSize, ThumbnailVariant } from './types';\n\ntype ImgHTMLProps = ImgHTMLAttributes<HTMLImageElement>;\n\n/**\n * Defines the props of the component.\n */\nexport interface ThumbnailProps extends GenericProps {\n /** Alignment of the thumbnail in it's parent (requires flex parent). */\n align?: HorizontalAlignment;\n /** Image alternative text. */\n alt: string;\n /** Image aspect ratio. */\n aspectRatio?: AspectRatio;\n /** Badge. */\n badge?: ReactElement | Falsy;\n /** Image cross origin resource policy. */\n crossOrigin?: ImgHTMLProps['crossOrigin'];\n /** Fallback icon (SVG path) or react node when image fails to load. */\n fallback?: string | ReactNode;\n /** Whether the thumbnail should fill it's parent size (requires flex parent) or not. */\n fillHeight?: boolean;\n /** Apply relative vertical and horizontal shift (from -1 to 1) on the image position inside the thumbnail. */\n focusPoint?: FocusPoint;\n /** Image URL. */\n image: string;\n /** Props to inject into the native <img> element. */\n imgProps?: ImgHTMLProps;\n /** Reference to the native <img> element. */\n imgRef?: Ref<HTMLImageElement>;\n /** Set to true to force the display of the loading skeleton. */\n isLoading?: boolean;\n /** Size variant of the component. */\n size?: ThumbnailSize;\n /** Image loading mode. */\n loading?: ImgHTMLProps['loading'];\n /** On click callback. */\n onClick?: MouseEventHandler<HTMLDivElement>;\n /** On key press callback. */\n onKeyPress?: KeyboardEventHandler<HTMLDivElement>;\n /** Theme adapting the component to light or dark background. */\n theme?: Theme;\n /** Variant of the component. */\n variant?: ThumbnailVariant;\n /** Props to pass to the link wrapping the thumbnail. */\n linkProps?: React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>;\n /** Custom react component for the link (can be used to inject react router Link). */\n linkAs?: 'a' | any;\n}\n\n/**\n * Component display name.\n */\nconst COMPONENT_NAME = 'Thumbnail';\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<ThumbnailProps> = {\n fallback: mdiImageBroken,\n loading: 'lazy',\n theme: Theme.light,\n};\n\n/**\n * Thumbnail component.\n *\n * @param props Component props.\n * @param ref Component ref.\n * @return React element.\n */\nexport const Thumbnail: Comp<ThumbnailProps> = forwardRef((props, ref) => {\n const {\n align,\n alt,\n aspectRatio = AspectRatio.original,\n badge,\n className,\n crossOrigin,\n fallback,\n fillHeight,\n // `focusPoint` needs to be here to remove it from `forwardedProps`.\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n focusPoint,\n image,\n imgProps,\n imgRef: propImgRef,\n isLoading: isLoadingProp,\n loading,\n size,\n theme,\n variant,\n linkProps,\n linkAs,\n ...forwardedProps\n } = props;\n const [imgElement, setImgElement] = useState<HTMLImageElement>();\n\n // Image loading state.\n const loadingState = useImageLoad(image, imgElement);\n const isLoaded = loadingState === 'isLoaded';\n const isLoading = isLoadingProp || loadingState === 'isLoading';\n const hasError = loadingState === 'hasError';\n\n // Focus point.\n const focusPointStyle = useFocusPointStyle(props, imgElement, isLoaded);\n\n const hasIconErrorFallback = hasError && typeof fallback === 'string';\n const hasCustomErrorFallback = hasError && !hasIconErrorFallback;\n const imageErrorStyle: CSSProperties = {};\n if (hasIconErrorFallback) {\n // Keep the image layout on icon fallback.\n imageErrorStyle.visibility = 'hidden';\n } else if (hasCustomErrorFallback) {\n // Remove the image on custom fallback.\n imageErrorStyle.display = 'none';\n }\n\n const isLink = Boolean(linkProps?.href || linkAs);\n const isButton = !!forwardedProps.onClick;\n const isClickable = isButton || isLink;\n\n let Wrapper: any = 'div';\n const wrapperProps = { ...forwardedProps };\n if (isLink) {\n Wrapper = linkAs || 'a';\n Object.assign(wrapperProps, linkProps);\n } else if (isButton) {\n Wrapper = 'button';\n wrapperProps.type = forwardedProps.type || 'button';\n wrapperProps['aria-label'] = forwardedProps['aria-label'] || alt;\n }\n\n return (\n <Wrapper\n {...wrapperProps}\n ref={ref}\n className={classNames(\n linkProps?.className,\n className,\n handleBasicClasses({\n align,\n aspectRatio,\n prefix: CLASSNAME,\n size,\n theme,\n variant,\n isClickable,\n hasError,\n hasIconErrorFallback,\n hasCustomErrorFallback,\n isLoading,\n hasBadge: !!badge,\n }),\n fillHeight && `${CLASSNAME}--fill-height`,\n )}\n >\n <div className={`${CLASSNAME}__background`}>\n <img\n {...imgProps}\n style={{\n ...imgProps?.style,\n ...imageErrorStyle,\n ...focusPointStyle,\n }}\n ref={mergeRefs(setImgElement, propImgRef)}\n className={classNames(\n handleBasicClasses({\n prefix: `${CLASSNAME}__image`,\n isLoading,\n hasDefinedSize: Boolean(imgProps?.height && imgProps.width),\n }),\n imgProps?.className,\n )}\n crossOrigin={crossOrigin}\n src={image}\n alt={alt}\n loading={loading}\n />\n {!isLoading && hasError && (\n <div className={`${CLASSNAME}__fallback`}>\n {hasIconErrorFallback ? (\n <Icon icon={fallback as string} size={Size.xxs} theme={theme} />\n ) : (\n fallback\n )}\n </div>\n )}\n </div>\n {badge &&\n React.cloneElement(badge, { className: classNames(`${CLASSNAME}__badge`, badge.props.className) })}\n </Wrapper>\n );\n});\nThumbnail.displayName = COMPONENT_NAME;\nThumbnail.className = CLASSNAME;\nThumbnail.defaultProps = DEFAULT_PROPS;\n"],"names":["getState","img","event","type","complete","naturalWidth","naturalHeight","useImageLoad","imageURL","imgRef","useState","state","setState","useEffect","undefined","update","addEventListener","removeEventListener","src","shiftPosition","scale","focusPoint","imageSize","containerSize","scaledSize","scaledFocusHeight","startFocus","shift","Math","floor","max","min","useFocusPointStyle","element","isLoaded","image","aspectRatio","imgProps","width","height","useMemo","AspectRatio","original","x","y","setContainerSize","updateContainerSize","cWidth","offsetWidth","cHeight","offsetHeight","oldContainerSize","requestAnimationFrame","style","setStyle","visibility","heightScale","widthScale","focusPointFromTop","abs","focusPointFromLeft","objectPosition","oldStyle","COMPONENT_NAME","CLASSNAME","getRootClassName","DEFAULT_PROPS","fallback","mdiImageBroken","loading","theme","Theme","light","Thumbnail","forwardRef","props","ref","align","alt","badge","className","crossOrigin","fillHeight","propImgRef","isLoadingProp","isLoading","size","variant","linkProps","linkAs","forwardedProps","imgElement","setImgElement","loadingState","hasError","focusPointStyle","hasIconErrorFallback","hasCustomErrorFallback","imageErrorStyle","display","isLink","Boolean","href","isButton","onClick","isClickable","Wrapper","wrapperProps","Object","assign","classNames","handleBasicClasses","prefix","hasBadge","mergeRefs","hasDefinedSize","Size","xxs","React","cloneElement","displayName","defaultProps"],"mappings":"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"}
@@ -22,11 +22,11 @@ import './mergeRefs.js';
22
22
  import './renderLink.js';
23
23
  import './ButtonRoot.js';
24
24
  import './Button2.js';
25
+ import './ClickAwayProvider.js';
26
+ import 'lodash/pull';
25
27
  import './useFocusTrap.js';
26
28
  import 'react-dom';
27
- import './ClickAwayProvider.js';
28
29
  import './Dialog2.js';
29
- import 'lodash/pull';
30
30
  import './useDelayedVisibility.js';
31
31
  import './useDisableBodyScroll.js';
32
32
  import './Progress2.js';
@@ -9,6 +9,7 @@ import 'lodash/isEmpty';
9
9
  import 'lodash/kebabCase';
10
10
  import 'lodash/noop';
11
11
  import './constants.js';
12
+ import 'lodash/last';
12
13
  import 'lodash/get';
13
14
  import './type.js';
14
15
  import './Popover2.js';
@@ -19,9 +20,9 @@ import './ButtonRoot.js';
19
20
  import './IconButton.js';
20
21
  import 'lodash/isFunction';
21
22
  import './Chip2.js';
22
- import 'react-dom';
23
23
  import './ClickAwayProvider.js';
24
24
  import 'lodash/pull';
25
+ import 'react-dom';
25
26
  import './List2.js';
26
27
  import './Dropdown2.js';
27
28
  import './InputHelper.js';
@@ -1 +1 @@
1
- {"version":3,"file":"autocomplete.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"autocomplete.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -9,6 +9,7 @@ import 'lodash/isEmpty';
9
9
  import 'lodash/kebabCase';
10
10
  import 'lodash/noop';
11
11
  import './constants.js';
12
+ import 'lodash/last';
12
13
  import 'lodash/get';
13
14
  import './Popover2.js';
14
15
  import './mergeRefs.js';
@@ -17,8 +18,8 @@ import './ButtonRoot.js';
17
18
  export { a as Button, B as ButtonEmphasis } from './Button2.js';
18
19
  export { I as IconButton } from './IconButton.js';
19
20
  export { B as ButtonGroup } from './ButtonGroup.js';
20
- import 'react-dom';
21
21
  import './ClickAwayProvider.js';
22
22
  import 'lodash/pull';
23
+ import 'react-dom';
23
24
  import './Tooltip2.js';
24
25
  //# sourceMappingURL=button.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"button.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;"}
@@ -9,15 +9,16 @@ import 'lodash/isEmpty';
9
9
  import 'lodash/kebabCase';
10
10
  import 'lodash/noop';
11
11
  import './constants.js';
12
+ import 'lodash/last';
12
13
  import 'lodash/get';
13
14
  import './Popover2.js';
14
15
  import './mergeRefs.js';
15
16
  import './Avatar2.js';
16
17
  import 'lodash/isFunction';
17
18
  export { a as CommentBlock, C as CommentBlockVariant } from './CommentBlock.js';
18
- import 'react-dom';
19
19
  import './ClickAwayProvider.js';
20
20
  import 'lodash/pull';
21
+ import 'react-dom';
21
22
  import './Thumbnail2.js';
22
23
  import './Tooltip2.js';
23
24
  //# sourceMappingURL=comment-block.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"comment-block.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"comment-block.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;"}