@frontify/fondue 12.0.0-beta.371 → 12.0.0-beta.373
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/Checkbox/Checkbox.es.js +12 -12
- package/dist/components/Checkbox/Checkbox.es.js.map +1 -1
- package/dist/components/ComponentEnum.es.js +1 -1
- package/dist/components/ComponentEnum.es.js.map +1 -1
- package/dist/components/{Textarea/Textarea.es.js → LegacyTextarea/LegacyTextarea.es.js} +21 -21
- package/dist/components/LegacyTextarea/LegacyTextarea.es.js.map +1 -0
- package/dist/index.cjs.js +2 -2
- package/dist/index.cjs.js.map +1 -1
- package/dist/index.d.ts +6 -6
- package/dist/index.es.js +2 -2
- package/dist/index.umd.js +2 -2
- package/dist/index.umd.js.map +1 -1
- package/package.json +1 -1
- package/dist/components/Textarea/Textarea.es.js.map +0 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as r, jsxs as p } from "react/jsx-runtime";
|
|
2
2
|
import { InputLabel as Z } from "../InputLabel/InputLabel.es.js";
|
|
3
|
-
import { forwardRef as q, useState as
|
|
3
|
+
import { forwardRef as q, useState as g, useRef as E, useEffect as y, useCallback as R } from "react";
|
|
4
4
|
import { FOCUS_STYLE as T } from "../../utilities/focusStyle.es.js";
|
|
5
5
|
import { merge as o } from "../../utilities/merge.es.js";
|
|
6
6
|
import { mergeProps as ee } from "@react-aria/utils";
|
|
@@ -26,9 +26,9 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
26
26
|
emphasis: k = "Default",
|
|
27
27
|
size: C = "Default",
|
|
28
28
|
disabled: s,
|
|
29
|
-
required:
|
|
29
|
+
required: v,
|
|
30
30
|
label: i,
|
|
31
|
-
hideLabel:
|
|
31
|
+
hideLabel: b,
|
|
32
32
|
tooltip: z,
|
|
33
33
|
helperText: l,
|
|
34
34
|
"aria-label": L = "Checkbox",
|
|
@@ -42,7 +42,7 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
42
42
|
onChange: s ? void 0 : X,
|
|
43
43
|
isSelected: c === "Checked"
|
|
44
44
|
/* Checked */
|
|
45
|
-
}), [H, D] =
|
|
45
|
+
}), [H, D] = g(), [F, K] = g(), w = E(null), d = E(null), [Y, _] = g(!1), [A, B] = g(!1), N = (n) => {
|
|
46
46
|
n.key === "Tab" && D(!0);
|
|
47
47
|
}, S = () => {
|
|
48
48
|
D(!1);
|
|
@@ -54,7 +54,7 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
54
54
|
const { inputProps: G } = te(
|
|
55
55
|
{
|
|
56
56
|
isDisabled: s,
|
|
57
|
-
isRequired:
|
|
57
|
+
isRequired: v,
|
|
58
58
|
isIndeterminate: c === "Mixed",
|
|
59
59
|
"aria-label": L,
|
|
60
60
|
value: U
|
|
@@ -78,18 +78,18 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
78
78
|
);
|
|
79
79
|
}, [w, d]);
|
|
80
80
|
return y(() => {
|
|
81
|
-
if (!(!i && !l ||
|
|
81
|
+
if (!(!i && !l || b))
|
|
82
82
|
return u(), window.removeEventListener("resize", u), window.addEventListener("resize", u), () => {
|
|
83
83
|
window.removeEventListener("resize", u);
|
|
84
84
|
};
|
|
85
|
-
}, [i, l,
|
|
85
|
+
}, [i, l, b, u]), /* @__PURE__ */ r("div", { className: "tw-gap-1 tw-transition-colors tw-w-full", "data-test-id": a, children: /* @__PURE__ */ r("div", { className: o(["tw-inline-flex tw-flex-row tw-rounded tw-w-full", H ? T : ""]), children: /* @__PURE__ */ r(
|
|
86
86
|
Z,
|
|
87
87
|
{
|
|
88
88
|
disabled: s,
|
|
89
89
|
clickable: !0,
|
|
90
90
|
htmlFor: M,
|
|
91
91
|
tooltip: z,
|
|
92
|
-
required:
|
|
92
|
+
required: v,
|
|
93
93
|
bold: h,
|
|
94
94
|
children: /* @__PURE__ */ p("span", { className: "tw-flex tw-items-center tw-whitespace-nowrap", children: [
|
|
95
95
|
/* @__PURE__ */ p("span", { className: "tw-inline-flex", children: [
|
|
@@ -104,7 +104,7 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
104
104
|
"aria-label": L,
|
|
105
105
|
role: "checkbox",
|
|
106
106
|
"aria-checked": c === "Checked",
|
|
107
|
-
required:
|
|
107
|
+
required: v
|
|
108
108
|
}
|
|
109
109
|
),
|
|
110
110
|
/* @__PURE__ */ r(
|
|
@@ -121,8 +121,8 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
121
121
|
}
|
|
122
122
|
)
|
|
123
123
|
] }),
|
|
124
|
-
/* @__PURE__ */ p("span", { className: "tw-inline-flex tw-flex-col tw-min-w-0 tw-ml-1.5", children: [
|
|
125
|
-
i &&
|
|
124
|
+
!b && /* @__PURE__ */ p("span", { className: "tw-inline-flex tw-flex-col tw-min-w-0 tw-ml-1.5", children: [
|
|
125
|
+
i && /* @__PURE__ */ r(
|
|
126
126
|
"span",
|
|
127
127
|
{
|
|
128
128
|
ref: w,
|
|
@@ -136,7 +136,7 @@ const de = (e) => e === "Checked" || e === "Mixed", W = "tw-bg-box-selected-stro
|
|
|
136
136
|
children: i
|
|
137
137
|
}
|
|
138
138
|
),
|
|
139
|
-
l &&
|
|
139
|
+
l && /* @__PURE__ */ r(
|
|
140
140
|
"span",
|
|
141
141
|
{
|
|
142
142
|
ref: d,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.es.js","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCheckMark, IconMinus } from '@foundation/Icon/Generated';\nimport { InputLabel, InputLabelTooltipProps } from '@components/InputLabel/InputLabel';\nimport {\n ForwardRefRenderFunction,\n HTMLAttributes,\n ReactNode,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { IconSize } from '@foundation/Icon';\nimport { merge } from '@utilities/merge';\nimport { mergeProps } from '@react-aria/utils';\nimport { useCheckbox } from '@react-aria/checkbox';\nimport { useFocusRing } from '@react-aria/focus';\nimport { useForwardedRef } from '@utilities/useForwardedRef';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useToggleState } from '@react-stately/toggle';\n\nexport enum CheckboxState {\n Checked = 'Checked',\n Unchecked = 'Unchecked',\n Mixed = 'Mixed',\n}\n\nexport enum CheckboxEmphasis {\n Default = 'Default',\n Weak = 'Weak',\n Strong = 'Strong',\n}\n\nexport enum CheckboxSize {\n Default = 'Default',\n Large = 'Large',\n XLarge = 'XLarge',\n}\n\nexport type CheckboxProps = {\n id?: string;\n state?: CheckboxState;\n emphasis?: CheckboxEmphasis;\n size?: CheckboxSize;\n disabled?: boolean;\n required?: boolean;\n value?: string;\n onChange?: (isChecked: boolean) => void;\n label?: string;\n hideLabel?: boolean;\n tooltip?: InputLabelTooltipProps;\n helperText?: string;\n 'aria-label'?: string;\n groupInputProps?: HTMLAttributes<HTMLElement>;\n 'data-test-id'?: string;\n};\n\nconst isCheckedOrMixed = (checked: CheckboxState): boolean => {\n return checked === CheckboxState.Checked || checked === CheckboxState.Mixed;\n};\n\nconst emphasisDefaultClasses =\n 'tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover';\n\nconst emphasisCheckedClassesMap: Record<CheckboxEmphasis, string> = {\n [CheckboxEmphasis.Weak]:\n 'tw-bg-box-neutral-strong tw-text-box-neutral-strong-inverse hover:tw-bg-box-neutral-strong-hover',\n [CheckboxEmphasis.Default]: emphasisDefaultClasses,\n [CheckboxEmphasis.Strong]: emphasisDefaultClasses,\n};\n\nconst sizeClassesMap: Record<CheckboxSize, string> = {\n [CheckboxSize.Default]: 'tw-h-4 tw-w-4',\n [CheckboxSize.Large]: 'tw-h-5 tw-w-5',\n [CheckboxSize.XLarge]: 'tw-h-8 tw-w-8',\n};\n\nconst CheckboxComponent: ForwardRefRenderFunction<HTMLInputElement, CheckboxProps> = (\n {\n id: propId,\n emphasis = CheckboxEmphasis.Default,\n size = CheckboxSize.Default,\n disabled,\n required,\n label,\n hideLabel,\n tooltip,\n helperText,\n 'aria-label': ariaLabel = 'Checkbox',\n value,\n groupInputProps,\n onChange,\n state = CheckboxState.Unchecked,\n 'data-test-id': dataTestId = 'checkbox',\n },\n ref,\n) => {\n const id = useMemoizedId(propId);\n const inputRef = useForwardedRef<HTMLInputElement | null>(ref);\n const { focusProps } = useFocusRing();\n const toggleState = useToggleState({\n onChange: disabled ? undefined : onChange,\n isSelected: state === CheckboxState.Checked,\n });\n const [showFocus, setShowFocus] = useState<Nullable<boolean>>();\n const [listeningForKeyboardEvents, setListeningForKeyboardEvents] = useState<Nullable<boolean>>();\n const labelContainer = useRef<HTMLSpanElement>(null);\n const helperTextContainer = useRef<HTMLSpanElement>(null);\n const [isLabelOverflowing, setIsLabelOverflowing] = useState(false);\n const [isHelperTextOverflowing, setIsHelperTextOverflowing] = useState(false);\n\n const tabFocusListener = (event: KeyboardEvent) => {\n if (event.key === 'Tab') {\n setShowFocus(true);\n }\n };\n\n const blurListener = () => {\n setShowFocus(false);\n };\n\n useEffect(() => {\n if (!listeningForKeyboardEvents) {\n inputRef?.current?.removeEventListener('keyup', tabFocusListener);\n inputRef?.current?.addEventListener('keyup', tabFocusListener);\n inputRef?.current?.removeEventListener('blur', blurListener);\n inputRef?.current?.addEventListener('blur', blurListener);\n\n setListeningForKeyboardEvents(true);\n }\n }, [listeningForKeyboardEvents, inputRef]);\n\n const { inputProps } = useCheckbox(\n {\n isDisabled: disabled,\n isRequired: required,\n isIndeterminate: state === CheckboxState.Mixed,\n 'aria-label': ariaLabel,\n value,\n },\n toggleState,\n inputRef,\n );\n\n const stateMap: Record<CheckboxState, ReactNode> = {\n [CheckboxState.Checked]: (\n <IconCheckMark size={size === CheckboxSize.XLarge ? IconSize.Size24 : IconSize.Size16} />\n ),\n [CheckboxState.Mixed]: <IconMinus />,\n [CheckboxState.Unchecked]: null,\n };\n\n const checkedOrMixed = isCheckedOrMixed(state);\n\n const disabledClasses = merge([\n 'tw-bg-box-disabled tw-pointer-events-none tw-text-box-disabled-inverse tw-border-line-strong',\n checkedOrMixed && 'tw-text-box-disabled-inverse tw-border-line-strong',\n ]);\n\n const enabledClasses = checkedOrMixed\n ? emphasisCheckedClassesMap[emphasis]\n : merge([\n 'tw-bg-base hover:tw-bg-box-neutral',\n emphasis === CheckboxEmphasis.Strong\n ? 'tw-border-2 tw-border-box-selected-strong'\n : 'tw-border tw-border-line-xx-strong',\n ]);\n\n const checkOverflowing = useCallback(() => {\n if (labelContainer.current) {\n setIsLabelOverflowing(labelContainer.current?.scrollWidth > labelContainer.current?.clientWidth);\n }\n\n if (helperTextContainer.current) {\n setIsHelperTextOverflowing(\n helperTextContainer.current?.scrollWidth > helperTextContainer.current?.clientWidth,\n );\n }\n }, [labelContainer, helperTextContainer]);\n\n useEffect(() => {\n if ((!label && !helperText) || hideLabel) {\n return;\n }\n checkOverflowing();\n\n window.removeEventListener('resize', checkOverflowing);\n window.addEventListener('resize', checkOverflowing);\n\n return () => {\n window.removeEventListener('resize', checkOverflowing);\n };\n }, [label, helperText, hideLabel, checkOverflowing]);\n\n return (\n <div className=\"tw-gap-1 tw-transition-colors tw-w-full\" data-test-id={dataTestId}>\n <div className={merge(['tw-inline-flex tw-flex-row tw-rounded tw-w-full', showFocus ? FOCUS_STYLE : ''])}>\n <InputLabel\n disabled={disabled}\n clickable\n htmlFor={id}\n tooltip={tooltip}\n required={required}\n bold={checkedOrMixed}\n >\n <span className=\"tw-flex tw-items-center tw-whitespace-nowrap\">\n <span className=\"tw-inline-flex\">\n <input\n {...mergeProps(groupInputProps || inputProps, focusProps)}\n id={id}\n ref={inputRef}\n className=\"tw-sr-only\"\n data-test-id={`${dataTestId}-input`}\n aria-label={ariaLabel}\n role=\"checkbox\"\n aria-checked={state === CheckboxState.Checked}\n required={required}\n />\n <span\n data-test-id={`${dataTestId}-icon-box`}\n aria-hidden=\"true\"\n className={merge([\n 'tw-leading-3 tw-relative tw-flex tw-items-center tw-justify-center tw-rounded tw-shrink-0 tw-flex-none',\n sizeClassesMap[size],\n disabled ? disabledClasses : enabledClasses,\n ])}\n >\n {stateMap[state]}\n </span>\n </span>\n <span className=\"tw-inline-flex tw-flex-col tw-min-w-0 tw-ml-1.5\">\n {label && !hideLabel && (\n <span\n ref={labelContainer}\n data-test-id={`${dataTestId}-label`}\n className={merge([\n 'tw-text-ellipsis tw-overflow-hidden',\n 'tw-text-xs tw-select-none hover:tw-cursor-pointer hover:tw-text-black dark:hover:tw-text-white group-hover:tw-text-black dark:group-hover:tw-text-white',\n checkedOrMixed && 'tw-font-medium',\n ])}\n title={isLabelOverflowing ? label : undefined}\n >\n {label}\n </span>\n )}\n {helperText && !hideLabel && (\n <span\n ref={helperTextContainer}\n data-test-id={`${dataTestId}-helper-text`}\n className={merge([\n 'tw-text-ellipsis tw-overflow-hidden',\n 'tw-font-sans tw-text-xs tw-font-normal',\n disabled ? 'text-disabled' : 'tw-text-text-weak',\n ])}\n title={isHelperTextOverflowing ? helperText : undefined}\n >\n {helperText}\n </span>\n )}\n </span>\n </span>\n </InputLabel>\n </div>\n </div>\n );\n};\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(CheckboxComponent);\nCheckbox.displayName = 'FondueCheckbox';\n"],"names":["CheckboxState","CheckboxEmphasis","CheckboxSize","isCheckedOrMixed","checked","emphasisDefaultClasses","emphasisCheckedClassesMap","sizeClassesMap","CheckboxComponent","propId","emphasis","size","disabled","required","label","hideLabel","tooltip","helperText","ariaLabel","value","groupInputProps","onChange","state","dataTestId","ref","id","useMemoizedId","inputRef","useForwardedRef","focusProps","useFocusRing","toggleState","useToggleState","showFocus","setShowFocus","useState","listeningForKeyboardEvents","setListeningForKeyboardEvents","labelContainer","useRef","helperTextContainer","isLabelOverflowing","setIsLabelOverflowing","isHelperTextOverflowing","setIsHelperTextOverflowing","tabFocusListener","event","blurListener","useEffect","_a","_b","_c","_d","inputProps","useCheckbox","stateMap","jsx","IconCheckMark","IconSize","IconMinus","checkedOrMixed","disabledClasses","merge","enabledClasses","checkOverflowing","useCallback","FOCUS_STYLE","InputLabel","jsxs","mergeProps","Checkbox","forwardRef"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"Checkbox.es.js","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconCheckMark, IconMinus } from '@foundation/Icon/Generated';\nimport { InputLabel, InputLabelTooltipProps } from '@components/InputLabel/InputLabel';\nimport {\n ForwardRefRenderFunction,\n HTMLAttributes,\n ReactNode,\n forwardRef,\n useCallback,\n useEffect,\n useRef,\n useState,\n} from 'react';\n\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { IconSize } from '@foundation/Icon';\nimport { merge } from '@utilities/merge';\nimport { mergeProps } from '@react-aria/utils';\nimport { useCheckbox } from '@react-aria/checkbox';\nimport { useFocusRing } from '@react-aria/focus';\nimport { useForwardedRef } from '@utilities/useForwardedRef';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useToggleState } from '@react-stately/toggle';\n\nexport enum CheckboxState {\n Checked = 'Checked',\n Unchecked = 'Unchecked',\n Mixed = 'Mixed',\n}\n\nexport enum CheckboxEmphasis {\n Default = 'Default',\n Weak = 'Weak',\n Strong = 'Strong',\n}\n\nexport enum CheckboxSize {\n Default = 'Default',\n Large = 'Large',\n XLarge = 'XLarge',\n}\n\nexport type CheckboxProps = {\n id?: string;\n state?: CheckboxState;\n emphasis?: CheckboxEmphasis;\n size?: CheckboxSize;\n disabled?: boolean;\n required?: boolean;\n value?: string;\n onChange?: (isChecked: boolean) => void;\n label?: string;\n hideLabel?: boolean;\n tooltip?: InputLabelTooltipProps;\n helperText?: string;\n 'aria-label'?: string;\n groupInputProps?: HTMLAttributes<HTMLElement>;\n 'data-test-id'?: string;\n};\n\nconst isCheckedOrMixed = (checked: CheckboxState): boolean => {\n return checked === CheckboxState.Checked || checked === CheckboxState.Mixed;\n};\n\nconst emphasisDefaultClasses =\n 'tw-bg-box-selected-strong tw-text-box-selected-strong-inverse hover:tw-bg-box-selected-strong-hover';\n\nconst emphasisCheckedClassesMap: Record<CheckboxEmphasis, string> = {\n [CheckboxEmphasis.Weak]:\n 'tw-bg-box-neutral-strong tw-text-box-neutral-strong-inverse hover:tw-bg-box-neutral-strong-hover',\n [CheckboxEmphasis.Default]: emphasisDefaultClasses,\n [CheckboxEmphasis.Strong]: emphasisDefaultClasses,\n};\n\nconst sizeClassesMap: Record<CheckboxSize, string> = {\n [CheckboxSize.Default]: 'tw-h-4 tw-w-4',\n [CheckboxSize.Large]: 'tw-h-5 tw-w-5',\n [CheckboxSize.XLarge]: 'tw-h-8 tw-w-8',\n};\n\nconst CheckboxComponent: ForwardRefRenderFunction<HTMLInputElement, CheckboxProps> = (\n {\n id: propId,\n emphasis = CheckboxEmphasis.Default,\n size = CheckboxSize.Default,\n disabled,\n required,\n label,\n hideLabel,\n tooltip,\n helperText,\n 'aria-label': ariaLabel = 'Checkbox',\n value,\n groupInputProps,\n onChange,\n state = CheckboxState.Unchecked,\n 'data-test-id': dataTestId = 'checkbox',\n },\n ref,\n) => {\n const id = useMemoizedId(propId);\n const inputRef = useForwardedRef<HTMLInputElement | null>(ref);\n const { focusProps } = useFocusRing();\n const toggleState = useToggleState({\n onChange: disabled ? undefined : onChange,\n isSelected: state === CheckboxState.Checked,\n });\n const [showFocus, setShowFocus] = useState<Nullable<boolean>>();\n const [listeningForKeyboardEvents, setListeningForKeyboardEvents] = useState<Nullable<boolean>>();\n const labelContainer = useRef<HTMLSpanElement>(null);\n const helperTextContainer = useRef<HTMLSpanElement>(null);\n const [isLabelOverflowing, setIsLabelOverflowing] = useState(false);\n const [isHelperTextOverflowing, setIsHelperTextOverflowing] = useState(false);\n\n const tabFocusListener = (event: KeyboardEvent) => {\n if (event.key === 'Tab') {\n setShowFocus(true);\n }\n };\n\n const blurListener = () => {\n setShowFocus(false);\n };\n\n useEffect(() => {\n if (!listeningForKeyboardEvents) {\n inputRef?.current?.removeEventListener('keyup', tabFocusListener);\n inputRef?.current?.addEventListener('keyup', tabFocusListener);\n inputRef?.current?.removeEventListener('blur', blurListener);\n inputRef?.current?.addEventListener('blur', blurListener);\n\n setListeningForKeyboardEvents(true);\n }\n }, [listeningForKeyboardEvents, inputRef]);\n\n const { inputProps } = useCheckbox(\n {\n isDisabled: disabled,\n isRequired: required,\n isIndeterminate: state === CheckboxState.Mixed,\n 'aria-label': ariaLabel,\n value,\n },\n toggleState,\n inputRef,\n );\n\n const stateMap: Record<CheckboxState, ReactNode> = {\n [CheckboxState.Checked]: (\n <IconCheckMark size={size === CheckboxSize.XLarge ? IconSize.Size24 : IconSize.Size16} />\n ),\n [CheckboxState.Mixed]: <IconMinus />,\n [CheckboxState.Unchecked]: null,\n };\n\n const checkedOrMixed = isCheckedOrMixed(state);\n\n const disabledClasses = merge([\n 'tw-bg-box-disabled tw-pointer-events-none tw-text-box-disabled-inverse tw-border-line-strong',\n checkedOrMixed && 'tw-text-box-disabled-inverse tw-border-line-strong',\n ]);\n\n const enabledClasses = checkedOrMixed\n ? emphasisCheckedClassesMap[emphasis]\n : merge([\n 'tw-bg-base hover:tw-bg-box-neutral',\n emphasis === CheckboxEmphasis.Strong\n ? 'tw-border-2 tw-border-box-selected-strong'\n : 'tw-border tw-border-line-xx-strong',\n ]);\n\n const checkOverflowing = useCallback(() => {\n if (labelContainer.current) {\n setIsLabelOverflowing(labelContainer.current?.scrollWidth > labelContainer.current?.clientWidth);\n }\n\n if (helperTextContainer.current) {\n setIsHelperTextOverflowing(\n helperTextContainer.current?.scrollWidth > helperTextContainer.current?.clientWidth,\n );\n }\n }, [labelContainer, helperTextContainer]);\n\n useEffect(() => {\n if ((!label && !helperText) || hideLabel) {\n return;\n }\n checkOverflowing();\n\n window.removeEventListener('resize', checkOverflowing);\n window.addEventListener('resize', checkOverflowing);\n\n return () => {\n window.removeEventListener('resize', checkOverflowing);\n };\n }, [label, helperText, hideLabel, checkOverflowing]);\n\n return (\n <div className=\"tw-gap-1 tw-transition-colors tw-w-full\" data-test-id={dataTestId}>\n <div className={merge(['tw-inline-flex tw-flex-row tw-rounded tw-w-full', showFocus ? FOCUS_STYLE : ''])}>\n <InputLabel\n disabled={disabled}\n clickable\n htmlFor={id}\n tooltip={tooltip}\n required={required}\n bold={checkedOrMixed}\n >\n <span className=\"tw-flex tw-items-center tw-whitespace-nowrap\">\n <span className=\"tw-inline-flex\">\n <input\n {...mergeProps(groupInputProps || inputProps, focusProps)}\n id={id}\n ref={inputRef}\n className=\"tw-sr-only\"\n data-test-id={`${dataTestId}-input`}\n aria-label={ariaLabel}\n role=\"checkbox\"\n aria-checked={state === CheckboxState.Checked}\n required={required}\n />\n <span\n data-test-id={`${dataTestId}-icon-box`}\n aria-hidden=\"true\"\n className={merge([\n 'tw-leading-3 tw-relative tw-flex tw-items-center tw-justify-center tw-rounded tw-shrink-0 tw-flex-none',\n sizeClassesMap[size],\n disabled ? disabledClasses : enabledClasses,\n ])}\n >\n {stateMap[state]}\n </span>\n </span>\n {!hideLabel && (\n <span className=\"tw-inline-flex tw-flex-col tw-min-w-0 tw-ml-1.5\">\n {label && (\n <span\n ref={labelContainer}\n data-test-id={`${dataTestId}-label`}\n className={merge([\n 'tw-text-ellipsis tw-overflow-hidden',\n 'tw-text-xs tw-select-none hover:tw-cursor-pointer hover:tw-text-black dark:hover:tw-text-white group-hover:tw-text-black dark:group-hover:tw-text-white',\n checkedOrMixed && 'tw-font-medium',\n ])}\n title={isLabelOverflowing ? label : undefined}\n >\n {label}\n </span>\n )}\n {helperText && (\n <span\n ref={helperTextContainer}\n data-test-id={`${dataTestId}-helper-text`}\n className={merge([\n 'tw-text-ellipsis tw-overflow-hidden',\n 'tw-font-sans tw-text-xs tw-font-normal',\n disabled ? 'text-disabled' : 'tw-text-text-weak',\n ])}\n title={isHelperTextOverflowing ? helperText : undefined}\n >\n {helperText}\n </span>\n )}\n </span>\n )}\n </span>\n </InputLabel>\n </div>\n </div>\n );\n};\n\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(CheckboxComponent);\nCheckbox.displayName = 'FondueCheckbox';\n"],"names":["CheckboxState","CheckboxEmphasis","CheckboxSize","isCheckedOrMixed","checked","emphasisDefaultClasses","emphasisCheckedClassesMap","sizeClassesMap","CheckboxComponent","propId","emphasis","size","disabled","required","label","hideLabel","tooltip","helperText","ariaLabel","value","groupInputProps","onChange","state","dataTestId","ref","id","useMemoizedId","inputRef","useForwardedRef","focusProps","useFocusRing","toggleState","useToggleState","showFocus","setShowFocus","useState","listeningForKeyboardEvents","setListeningForKeyboardEvents","labelContainer","useRef","helperTextContainer","isLabelOverflowing","setIsLabelOverflowing","isHelperTextOverflowing","setIsHelperTextOverflowing","tabFocusListener","event","blurListener","useEffect","_a","_b","_c","_d","inputProps","useCheckbox","stateMap","jsx","IconCheckMark","IconSize","IconMinus","checkedOrMixed","disabledClasses","merge","enabledClasses","checkOverflowing","useCallback","FOCUS_STYLE","InputLabel","jsxs","mergeProps","Checkbox","forwardRef"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var d = /* @__PURE__ */ ((e) => (e["Fondue - Accordion"] = "Accordion", e["Fondue - AccordionHeader"] = "AccordionHeader", e["Fondue - AccordionHeaderIcon"] = "AccordionHeaderIcon", e["Fondue - AddBlockButton"] = "AddBlockButton", e["Fondue - AssetInput"] = "AssetInput", e["Fondue - AssetThumbnail"] = "AssetThumbnail", e["Fondue - Badge"] = "Badge", e["Fondue - BadgeStatusIcon"] = "BadgeStatusIcon", e["Fondue - Box"] = "Box", e["Fondue - BreadcrumbItem"] = "BreadcrumbItem", e["Fondue - Breadcrumbs"] = "Breadcrumbs", e["Fondue - CurrentBreadcrumbItem"] = "CurrentBreadcrumbItem", e["Fondue - FormattedBreadcrumbs"] = "FormattedBreadcrumbs", e["Fondue - Button"] = "Button", e["Fondue - ButtonGroup"] = "ButtonGroup", e["Fondue - Card"] = "Card", e["Fondue - Checkbox"] = "Checkbox", e["Fondue - Checklist"] = "Checklist", e["Fondue - CollapsibleWrap"] = "CollapsibleWrap", e["Fondue - ColorInputTitle"] = "ColorInputTitle", e["Fondue - ColorPickerFlyout"] = "ColorPickerFlyout", e["Fondue - ColorPickerTrigger"] = "ColorPickerTrigger", e["Fondue - BrandColorPicker"] = "BrandColorPicker", e["Fondue - ColorInput"] = "ColorInput", e["Fondue - ColorPicker"] = "ColorPicker", e["Fondue - ColorPreview"] = "ColorPreview", e["Fondue - CustomColorPicker"] = "CustomColorPicker", e["Fondue - Container"] = "Container", e["Fondue - DatePicker"] = "DatePicker", e["Fondue - DatePickerTrigger"] = "DatePickerTrigger", e["Fondue - Dialog"] = "Dialog", e["Fondue - DialogBody"] = "DialogBody", e["Fondue - DialogFooter"] = "DialogFooter", e["Fondue - DialogHeader"] = "DialogHeader", e["Fondue - Divider"] = "Divider", e["Fondue - DropZone"] = "DropZone", e["Fondue - Dropdown"] = "Dropdown", e["Fondue - EditableText"] = "EditableText", e["Fondue - FieldsetHeader"] = "FieldsetHeader", e["Fondue - Flex"] = "Flex", e["Fondue - Flyout"] = "Flyout", e["Fondue - FlyoutFooter"] = "FlyoutFooter", e["Fondue - Overlay"] = "Overlay", e["Fondue - Form"] = "Form", e["Fondue - FormControl"] = "FormControl", e["Fondue - FormField"] = "FormField", e["Fondue - FrontifyPattern"] = "FrontifyPattern", e["Fondue - Grid"] = "Grid", e["Fondue - InlineDialog"] = "InlineDialog", e["Fondue - InputLabel"] = "InputLabel", e["Fondue - LegacyCollectionItem"] = "LegacyCollectionItem", e["Fondue - LegacyOrderableList"] = "LegacyOrderableList", e["Fondue - BrightHeader"] = "BrightHeader", e["Fondue - LegacyTooltip"] = "LegacyTooltip", e["Fondue - LinkChooser"] = "LinkChooser", e["Fondue - NavigationMenu"] = "NavigationMenu", e["Fondue - Popover"] = "Popover", e["Fondue - SearchInput"] = "SearchInput", e["Fondue - SearchResultOption"] = "SearchResultOption", e["Fondue - SearchResultSection"] = "SearchResultSection", e["Fondue - SearchResultsList"] = "SearchResultsList", e["Fondue - LoadingBar"] = "LoadingBar", e["Fondue - LoadingCircle"] = "LoadingCircle", e["Fondue - Menu"] = "Menu", e["Fondue - MenuItem"] = "MenuItem", e["Fondue - MenuItemContent"] = "MenuItemContent", e["Fondue - Modal"] = "Modal", e["Fondue - ModalBody"] = "ModalBody", e["Fondue - ModalFooter"] = "ModalFooter", e["Fondue - ModalHeader"] = "ModalHeader", e["Fondue - ModalVisual"] = "ModalVisual", e["Fondue - MultiInput"] = "MultiInput", e["Fondue - MultiSelect"] = "MultiSelect", e["Fondue - NumberInput"] = "NumberInput", e["Fondue - OrderableList"] = "OrderableList", e["Fondue - OverflowMenu"] = "OverflowMenu", e["Fondue - Popper"] = "Popper", e["Fondue - Portal"] = "Portal", e["Fondue - RadioButton"] = "RadioButton", e["Fondue - RadioList"] = "RadioList", e["Fondue - RadioPill"] = "RadioPill", e["Fondue - RichTextEditor"] = "RichTextEditor", e["Fondue - ScrollWrapper"] = "ScrollWrapper", e["Fondue - SegmentedControls"] = "SegmentedControls", e["Fondue - Slider"] = "Slider", e["Fondue - Stack"] = "Stack", e["Fondue - Switch"] = "Switch", e["Fondue - Table"] = "Table", e["Fondue - TableCell"] = "TableCell", e["Fondue - TableColumnHeader"] = "TableColumnHeader", e["Fondue - TableHeaderRow"] = "TableHeaderRow", e["Fondue - TableRow"] = "TableRow", e["Fondue - TabItem"] = "TabItem", e["Fondue - Tabs"] = "Tabs", e["Fondue - Tag"] = "Tag", e["Fondue - TextInput"] = "TextInput", e["Fondue -
|
|
1
|
+
var d = /* @__PURE__ */ ((e) => (e["Fondue - Accordion"] = "Accordion", e["Fondue - AccordionHeader"] = "AccordionHeader", e["Fondue - AccordionHeaderIcon"] = "AccordionHeaderIcon", e["Fondue - AddBlockButton"] = "AddBlockButton", e["Fondue - AssetInput"] = "AssetInput", e["Fondue - AssetThumbnail"] = "AssetThumbnail", e["Fondue - Badge"] = "Badge", e["Fondue - BadgeStatusIcon"] = "BadgeStatusIcon", e["Fondue - Box"] = "Box", e["Fondue - BreadcrumbItem"] = "BreadcrumbItem", e["Fondue - Breadcrumbs"] = "Breadcrumbs", e["Fondue - CurrentBreadcrumbItem"] = "CurrentBreadcrumbItem", e["Fondue - FormattedBreadcrumbs"] = "FormattedBreadcrumbs", e["Fondue - Button"] = "Button", e["Fondue - ButtonGroup"] = "ButtonGroup", e["Fondue - Card"] = "Card", e["Fondue - Checkbox"] = "Checkbox", e["Fondue - Checklist"] = "Checklist", e["Fondue - CollapsibleWrap"] = "CollapsibleWrap", e["Fondue - ColorInputTitle"] = "ColorInputTitle", e["Fondue - ColorPickerFlyout"] = "ColorPickerFlyout", e["Fondue - ColorPickerTrigger"] = "ColorPickerTrigger", e["Fondue - BrandColorPicker"] = "BrandColorPicker", e["Fondue - ColorInput"] = "ColorInput", e["Fondue - ColorPicker"] = "ColorPicker", e["Fondue - ColorPreview"] = "ColorPreview", e["Fondue - CustomColorPicker"] = "CustomColorPicker", e["Fondue - Container"] = "Container", e["Fondue - DatePicker"] = "DatePicker", e["Fondue - DatePickerTrigger"] = "DatePickerTrigger", e["Fondue - Dialog"] = "Dialog", e["Fondue - DialogBody"] = "DialogBody", e["Fondue - DialogFooter"] = "DialogFooter", e["Fondue - DialogHeader"] = "DialogHeader", e["Fondue - Divider"] = "Divider", e["Fondue - DropZone"] = "DropZone", e["Fondue - Dropdown"] = "Dropdown", e["Fondue - EditableText"] = "EditableText", e["Fondue - FieldsetHeader"] = "FieldsetHeader", e["Fondue - Flex"] = "Flex", e["Fondue - Flyout"] = "Flyout", e["Fondue - FlyoutFooter"] = "FlyoutFooter", e["Fondue - Overlay"] = "Overlay", e["Fondue - Form"] = "Form", e["Fondue - FormControl"] = "FormControl", e["Fondue - FormField"] = "FormField", e["Fondue - FrontifyPattern"] = "FrontifyPattern", e["Fondue - Grid"] = "Grid", e["Fondue - InlineDialog"] = "InlineDialog", e["Fondue - InputLabel"] = "InputLabel", e["Fondue - LegacyCollectionItem"] = "LegacyCollectionItem", e["Fondue - LegacyOrderableList"] = "LegacyOrderableList", e["Fondue - LegacyTextarea"] = "LegacyTextarea", e["Fondue - BrightHeader"] = "BrightHeader", e["Fondue - LegacyTooltip"] = "LegacyTooltip", e["Fondue - LinkChooser"] = "LinkChooser", e["Fondue - NavigationMenu"] = "NavigationMenu", e["Fondue - Popover"] = "Popover", e["Fondue - SearchInput"] = "SearchInput", e["Fondue - SearchResultOption"] = "SearchResultOption", e["Fondue - SearchResultSection"] = "SearchResultSection", e["Fondue - SearchResultsList"] = "SearchResultsList", e["Fondue - LoadingBar"] = "LoadingBar", e["Fondue - LoadingCircle"] = "LoadingCircle", e["Fondue - Menu"] = "Menu", e["Fondue - MenuItem"] = "MenuItem", e["Fondue - MenuItemContent"] = "MenuItemContent", e["Fondue - Modal"] = "Modal", e["Fondue - ModalBody"] = "ModalBody", e["Fondue - ModalFooter"] = "ModalFooter", e["Fondue - ModalHeader"] = "ModalHeader", e["Fondue - ModalVisual"] = "ModalVisual", e["Fondue - MultiInput"] = "MultiInput", e["Fondue - MultiSelect"] = "MultiSelect", e["Fondue - NumberInput"] = "NumberInput", e["Fondue - OrderableList"] = "OrderableList", e["Fondue - OverflowMenu"] = "OverflowMenu", e["Fondue - Popper"] = "Popper", e["Fondue - Portal"] = "Portal", e["Fondue - RadioButton"] = "RadioButton", e["Fondue - RadioList"] = "RadioList", e["Fondue - RadioPill"] = "RadioPill", e["Fondue - RichTextEditor"] = "RichTextEditor", e["Fondue - ScrollWrapper"] = "ScrollWrapper", e["Fondue - SegmentedControls"] = "SegmentedControls", e["Fondue - Slider"] = "Slider", e["Fondue - Stack"] = "Stack", e["Fondue - Switch"] = "Switch", e["Fondue - Table"] = "Table", e["Fondue - TableCell"] = "TableCell", e["Fondue - TableColumnHeader"] = "TableColumnHeader", e["Fondue - TableHeaderRow"] = "TableHeaderRow", e["Fondue - TableRow"] = "TableRow", e["Fondue - TabItem"] = "TabItem", e["Fondue - Tabs"] = "Tabs", e["Fondue - Tag"] = "Tag", e["Fondue - TextInput"] = "TextInput", e["Fondue - Toast"] = "Toast", e["Fondue - types"] = "types", e["Fondue - Tooltip"] = "Tooltip", e["Fondue - TooltipIcon"] = "TooltipIcon", e["Fondue - Tree"] = "Tree", e["Fondue - Trigger"] = "Trigger", e))(d || {});
|
|
2
2
|
export {
|
|
3
3
|
d as ComponentEnum
|
|
4
4
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComponentEnum.es.js","sources":["../../src/components/ComponentEnum.ts"],"sourcesContent":["\n export enum ComponentEnum {\n \"Fondue - Accordion\" = \"Accordion\",\n\"Fondue - AccordionHeader\" = \"AccordionHeader\",\n\"Fondue - AccordionHeaderIcon\" = \"AccordionHeaderIcon\",\n\"Fondue - AddBlockButton\" = \"AddBlockButton\",\n\"Fondue - AssetInput\" = \"AssetInput\",\n\"Fondue - AssetThumbnail\" = \"AssetThumbnail\",\n\"Fondue - Badge\" = \"Badge\",\n\"Fondue - BadgeStatusIcon\" = \"BadgeStatusIcon\",\n\"Fondue - Box\" = \"Box\",\n\"Fondue - BreadcrumbItem\" = \"BreadcrumbItem\",\n\"Fondue - Breadcrumbs\" = \"Breadcrumbs\",\n\"Fondue - CurrentBreadcrumbItem\" = \"CurrentBreadcrumbItem\",\n\"Fondue - FormattedBreadcrumbs\" = \"FormattedBreadcrumbs\",\n\"Fondue - Button\" = \"Button\",\n\"Fondue - ButtonGroup\" = \"ButtonGroup\",\n\"Fondue - Card\" = \"Card\",\n\"Fondue - Checkbox\" = \"Checkbox\",\n\"Fondue - Checklist\" = \"Checklist\",\n\"Fondue - CollapsibleWrap\" = \"CollapsibleWrap\",\n\"Fondue - ColorInputTitle\" = \"ColorInputTitle\",\n\"Fondue - ColorPickerFlyout\" = \"ColorPickerFlyout\",\n\"Fondue - ColorPickerTrigger\" = \"ColorPickerTrigger\",\n\"Fondue - BrandColorPicker\" = \"BrandColorPicker\",\n\"Fondue - ColorInput\" = \"ColorInput\",\n\"Fondue - ColorPicker\" = \"ColorPicker\",\n\"Fondue - ColorPreview\" = \"ColorPreview\",\n\"Fondue - CustomColorPicker\" = \"CustomColorPicker\",\n\"Fondue - Container\" = \"Container\",\n\"Fondue - DatePicker\" = \"DatePicker\",\n\"Fondue - DatePickerTrigger\" = \"DatePickerTrigger\",\n\"Fondue - Dialog\" = \"Dialog\",\n\"Fondue - DialogBody\" = \"DialogBody\",\n\"Fondue - DialogFooter\" = \"DialogFooter\",\n\"Fondue - DialogHeader\" = \"DialogHeader\",\n\"Fondue - Divider\" = \"Divider\",\n\"Fondue - DropZone\" = \"DropZone\",\n\"Fondue - Dropdown\" = \"Dropdown\",\n\"Fondue - EditableText\" = \"EditableText\",\n\"Fondue - FieldsetHeader\" = \"FieldsetHeader\",\n\"Fondue - Flex\" = \"Flex\",\n\"Fondue - Flyout\" = \"Flyout\",\n\"Fondue - FlyoutFooter\" = \"FlyoutFooter\",\n\"Fondue - Overlay\" = \"Overlay\",\n\"Fondue - Form\" = \"Form\",\n\"Fondue - FormControl\" = \"FormControl\",\n\"Fondue - FormField\" = \"FormField\",\n\"Fondue - FrontifyPattern\" = \"FrontifyPattern\",\n\"Fondue - Grid\" = \"Grid\",\n\"Fondue - InlineDialog\" = \"InlineDialog\",\n\"Fondue - InputLabel\" = \"InputLabel\",\n\"Fondue - LegacyCollectionItem\" = \"LegacyCollectionItem\",\n\"Fondue - LegacyOrderableList\" = \"LegacyOrderableList\",\n\"Fondue - BrightHeader\" = \"BrightHeader\",\n\"Fondue - LegacyTooltip\" = \"LegacyTooltip\",\n\"Fondue - LinkChooser\" = \"LinkChooser\",\n\"Fondue - NavigationMenu\" = \"NavigationMenu\",\n\"Fondue - Popover\" = \"Popover\",\n\"Fondue - SearchInput\" = \"SearchInput\",\n\"Fondue - SearchResultOption\" = \"SearchResultOption\",\n\"Fondue - SearchResultSection\" = \"SearchResultSection\",\n\"Fondue - SearchResultsList\" = \"SearchResultsList\",\n\"Fondue - LoadingBar\" = \"LoadingBar\",\n\"Fondue - LoadingCircle\" = \"LoadingCircle\",\n\"Fondue - Menu\" = \"Menu\",\n\"Fondue - MenuItem\" = \"MenuItem\",\n\"Fondue - MenuItemContent\" = \"MenuItemContent\",\n\"Fondue - Modal\" = \"Modal\",\n\"Fondue - ModalBody\" = \"ModalBody\",\n\"Fondue - ModalFooter\" = \"ModalFooter\",\n\"Fondue - ModalHeader\" = \"ModalHeader\",\n\"Fondue - ModalVisual\" = \"ModalVisual\",\n\"Fondue - MultiInput\" = \"MultiInput\",\n\"Fondue - MultiSelect\" = \"MultiSelect\",\n\"Fondue - NumberInput\" = \"NumberInput\",\n\"Fondue - OrderableList\" = \"OrderableList\",\n\"Fondue - OverflowMenu\" = \"OverflowMenu\",\n\"Fondue - Popper\" = \"Popper\",\n\"Fondue - Portal\" = \"Portal\",\n\"Fondue - RadioButton\" = \"RadioButton\",\n\"Fondue - RadioList\" = \"RadioList\",\n\"Fondue - RadioPill\" = \"RadioPill\",\n\"Fondue - RichTextEditor\" = \"RichTextEditor\",\n\"Fondue - ScrollWrapper\" = \"ScrollWrapper\",\n\"Fondue - SegmentedControls\" = \"SegmentedControls\",\n\"Fondue - Slider\" = \"Slider\",\n\"Fondue - Stack\" = \"Stack\",\n\"Fondue - Switch\" = \"Switch\",\n\"Fondue - Table\" = \"Table\",\n\"Fondue - TableCell\" = \"TableCell\",\n\"Fondue - TableColumnHeader\" = \"TableColumnHeader\",\n\"Fondue - TableHeaderRow\" = \"TableHeaderRow\",\n\"Fondue - TableRow\" = \"TableRow\",\n\"Fondue - TabItem\" = \"TabItem\",\n\"Fondue - Tabs\" = \"Tabs\",\n\"Fondue - Tag\" = \"Tag\",\n\"Fondue - TextInput\" = \"TextInput\",\n\"Fondue -
|
|
1
|
+
{"version":3,"file":"ComponentEnum.es.js","sources":["../../src/components/ComponentEnum.ts"],"sourcesContent":["\n export enum ComponentEnum {\n \"Fondue - Accordion\" = \"Accordion\",\n\"Fondue - AccordionHeader\" = \"AccordionHeader\",\n\"Fondue - AccordionHeaderIcon\" = \"AccordionHeaderIcon\",\n\"Fondue - AddBlockButton\" = \"AddBlockButton\",\n\"Fondue - AssetInput\" = \"AssetInput\",\n\"Fondue - AssetThumbnail\" = \"AssetThumbnail\",\n\"Fondue - Badge\" = \"Badge\",\n\"Fondue - BadgeStatusIcon\" = \"BadgeStatusIcon\",\n\"Fondue - Box\" = \"Box\",\n\"Fondue - BreadcrumbItem\" = \"BreadcrumbItem\",\n\"Fondue - Breadcrumbs\" = \"Breadcrumbs\",\n\"Fondue - CurrentBreadcrumbItem\" = \"CurrentBreadcrumbItem\",\n\"Fondue - FormattedBreadcrumbs\" = \"FormattedBreadcrumbs\",\n\"Fondue - Button\" = \"Button\",\n\"Fondue - ButtonGroup\" = \"ButtonGroup\",\n\"Fondue - Card\" = \"Card\",\n\"Fondue - Checkbox\" = \"Checkbox\",\n\"Fondue - Checklist\" = \"Checklist\",\n\"Fondue - CollapsibleWrap\" = \"CollapsibleWrap\",\n\"Fondue - ColorInputTitle\" = \"ColorInputTitle\",\n\"Fondue - ColorPickerFlyout\" = \"ColorPickerFlyout\",\n\"Fondue - ColorPickerTrigger\" = \"ColorPickerTrigger\",\n\"Fondue - BrandColorPicker\" = \"BrandColorPicker\",\n\"Fondue - ColorInput\" = \"ColorInput\",\n\"Fondue - ColorPicker\" = \"ColorPicker\",\n\"Fondue - ColorPreview\" = \"ColorPreview\",\n\"Fondue - CustomColorPicker\" = \"CustomColorPicker\",\n\"Fondue - Container\" = \"Container\",\n\"Fondue - DatePicker\" = \"DatePicker\",\n\"Fondue - DatePickerTrigger\" = \"DatePickerTrigger\",\n\"Fondue - Dialog\" = \"Dialog\",\n\"Fondue - DialogBody\" = \"DialogBody\",\n\"Fondue - DialogFooter\" = \"DialogFooter\",\n\"Fondue - DialogHeader\" = \"DialogHeader\",\n\"Fondue - Divider\" = \"Divider\",\n\"Fondue - DropZone\" = \"DropZone\",\n\"Fondue - Dropdown\" = \"Dropdown\",\n\"Fondue - EditableText\" = \"EditableText\",\n\"Fondue - FieldsetHeader\" = \"FieldsetHeader\",\n\"Fondue - Flex\" = \"Flex\",\n\"Fondue - Flyout\" = \"Flyout\",\n\"Fondue - FlyoutFooter\" = \"FlyoutFooter\",\n\"Fondue - Overlay\" = \"Overlay\",\n\"Fondue - Form\" = \"Form\",\n\"Fondue - FormControl\" = \"FormControl\",\n\"Fondue - FormField\" = \"FormField\",\n\"Fondue - FrontifyPattern\" = \"FrontifyPattern\",\n\"Fondue - Grid\" = \"Grid\",\n\"Fondue - InlineDialog\" = \"InlineDialog\",\n\"Fondue - InputLabel\" = \"InputLabel\",\n\"Fondue - LegacyCollectionItem\" = \"LegacyCollectionItem\",\n\"Fondue - LegacyOrderableList\" = \"LegacyOrderableList\",\n\"Fondue - LegacyTextarea\" = \"LegacyTextarea\",\n\"Fondue - BrightHeader\" = \"BrightHeader\",\n\"Fondue - LegacyTooltip\" = \"LegacyTooltip\",\n\"Fondue - LinkChooser\" = \"LinkChooser\",\n\"Fondue - NavigationMenu\" = \"NavigationMenu\",\n\"Fondue - Popover\" = \"Popover\",\n\"Fondue - SearchInput\" = \"SearchInput\",\n\"Fondue - SearchResultOption\" = \"SearchResultOption\",\n\"Fondue - SearchResultSection\" = \"SearchResultSection\",\n\"Fondue - SearchResultsList\" = \"SearchResultsList\",\n\"Fondue - LoadingBar\" = \"LoadingBar\",\n\"Fondue - LoadingCircle\" = \"LoadingCircle\",\n\"Fondue - Menu\" = \"Menu\",\n\"Fondue - MenuItem\" = \"MenuItem\",\n\"Fondue - MenuItemContent\" = \"MenuItemContent\",\n\"Fondue - Modal\" = \"Modal\",\n\"Fondue - ModalBody\" = \"ModalBody\",\n\"Fondue - ModalFooter\" = \"ModalFooter\",\n\"Fondue - ModalHeader\" = \"ModalHeader\",\n\"Fondue - ModalVisual\" = \"ModalVisual\",\n\"Fondue - MultiInput\" = \"MultiInput\",\n\"Fondue - MultiSelect\" = \"MultiSelect\",\n\"Fondue - NumberInput\" = \"NumberInput\",\n\"Fondue - OrderableList\" = \"OrderableList\",\n\"Fondue - OverflowMenu\" = \"OverflowMenu\",\n\"Fondue - Popper\" = \"Popper\",\n\"Fondue - Portal\" = \"Portal\",\n\"Fondue - RadioButton\" = \"RadioButton\",\n\"Fondue - RadioList\" = \"RadioList\",\n\"Fondue - RadioPill\" = \"RadioPill\",\n\"Fondue - RichTextEditor\" = \"RichTextEditor\",\n\"Fondue - ScrollWrapper\" = \"ScrollWrapper\",\n\"Fondue - SegmentedControls\" = \"SegmentedControls\",\n\"Fondue - Slider\" = \"Slider\",\n\"Fondue - Stack\" = \"Stack\",\n\"Fondue - Switch\" = \"Switch\",\n\"Fondue - Table\" = \"Table\",\n\"Fondue - TableCell\" = \"TableCell\",\n\"Fondue - TableColumnHeader\" = \"TableColumnHeader\",\n\"Fondue - TableHeaderRow\" = \"TableHeaderRow\",\n\"Fondue - TableRow\" = \"TableRow\",\n\"Fondue - TabItem\" = \"TabItem\",\n\"Fondue - Tabs\" = \"Tabs\",\n\"Fondue - Tag\" = \"Tag\",\n\"Fondue - TextInput\" = \"TextInput\",\n\"Fondue - Toast\" = \"Toast\",\n\"Fondue - types\" = \"types\",\n\"Fondue - Tooltip\" = \"Tooltip\",\n\"Fondue - TooltipIcon\" = \"TooltipIcon\",\n\"Fondue - Tree\" = \"Tree\",\n\"Fondue - Trigger\" = \"Trigger\"\n };\n "],"names":["ComponentEnum"],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import { jsxs as
|
|
2
|
-
import { useMemoizedId as
|
|
1
|
+
import { jsxs as I, jsx as o } from "react/jsx-runtime";
|
|
2
|
+
import { useMemoizedId as S } from "../../hooks/useMemoizedId.es.js";
|
|
3
3
|
import { useFocusRing as j } from "@react-aria/focus";
|
|
4
4
|
import { FOCUS_STYLE as v } from "../../utilities/focusStyle.es.js";
|
|
5
5
|
import { merge as p } from "../../utilities/merge.es.js";
|
|
@@ -11,9 +11,9 @@ import { LoadingCircle as A, LoadingCircleSize as B } from "../LoadingCircle/Loa
|
|
|
11
11
|
const K = ({
|
|
12
12
|
id: x,
|
|
13
13
|
value: d,
|
|
14
|
-
required:
|
|
14
|
+
required: g = !1,
|
|
15
15
|
decorator: a,
|
|
16
|
-
placeholder:
|
|
16
|
+
placeholder: b,
|
|
17
17
|
disabled: s = !1,
|
|
18
18
|
onInput: n,
|
|
19
19
|
onBlur: w,
|
|
@@ -28,19 +28,19 @@ const K = ({
|
|
|
28
28
|
onEnterPressed: i,
|
|
29
29
|
...C
|
|
30
30
|
}) => {
|
|
31
|
-
const
|
|
31
|
+
const L = m ? V : "textarea", l = H(null);
|
|
32
32
|
M(() => {
|
|
33
33
|
var t;
|
|
34
34
|
f && ((t = l.current) == null || t.focus());
|
|
35
35
|
}, [f]);
|
|
36
|
-
const
|
|
36
|
+
const N = (t) => {
|
|
37
37
|
t.key === "Enter" && (i == null || i(t));
|
|
38
|
-
},
|
|
38
|
+
}, T = (t) => {
|
|
39
39
|
w && w(t.target.value);
|
|
40
|
-
},
|
|
40
|
+
}, y = (t) => {
|
|
41
41
|
n && n(t.target.value);
|
|
42
|
-
}, { isFocusVisible:
|
|
43
|
-
return /* @__PURE__ */
|
|
42
|
+
}, { isFocusVisible: E, focusProps: F } = j({ isTextInput: !0, within: !0 });
|
|
43
|
+
return /* @__PURE__ */ I("div", { className: "tw-relative", ...F, children: [
|
|
44
44
|
a && /* @__PURE__ */ o(
|
|
45
45
|
"div",
|
|
46
46
|
{
|
|
@@ -50,34 +50,34 @@ const K = ({
|
|
|
50
50
|
}
|
|
51
51
|
),
|
|
52
52
|
/* @__PURE__ */ o(
|
|
53
|
-
|
|
53
|
+
L,
|
|
54
54
|
{
|
|
55
55
|
...m ? { maxRows: h, minRows: c } : { rows: c },
|
|
56
56
|
onClick: () => {
|
|
57
57
|
var t;
|
|
58
58
|
return (t = l.current) == null ? void 0 : t.focus();
|
|
59
59
|
},
|
|
60
|
-
id:
|
|
60
|
+
id: S(x),
|
|
61
61
|
ref: l,
|
|
62
62
|
value: d,
|
|
63
|
-
placeholder:
|
|
64
|
-
required:
|
|
63
|
+
placeholder: b,
|
|
64
|
+
required: g,
|
|
65
65
|
className: p([
|
|
66
66
|
"tw-w-full tw-p-2 tw-border tw-rounded tw-text-s tw-outline-none tw-transition tw-placeholder-black-60",
|
|
67
67
|
!!a && "tw-pl-7 ",
|
|
68
68
|
s ? "tw-border-black-5 tw-bg-black-5 tw-text-black-40" : "tw-text-black tw-border-black-20 hover:tw-border-line-x-strong focus-within:tw-border-line-xx-strong focus-within:hover:tw-border-line-xx-strong",
|
|
69
|
-
|
|
69
|
+
E && v,
|
|
70
70
|
D[e],
|
|
71
71
|
!k && "tw-resize-none",
|
|
72
72
|
e === r.Error && "tw-pr-8"
|
|
73
73
|
]),
|
|
74
74
|
disabled: s,
|
|
75
|
-
onBlur:
|
|
75
|
+
onBlur: T,
|
|
76
76
|
onFocus: (t) => {
|
|
77
77
|
z && t.target.select(), u && u(t);
|
|
78
78
|
},
|
|
79
|
-
onInput:
|
|
80
|
-
onKeyDown:
|
|
79
|
+
onInput: y,
|
|
80
|
+
onKeyDown: N,
|
|
81
81
|
"data-test-id": "textarea",
|
|
82
82
|
...C
|
|
83
83
|
}
|
|
@@ -97,8 +97,8 @@ const K = ({
|
|
|
97
97
|
)
|
|
98
98
|
] });
|
|
99
99
|
};
|
|
100
|
-
K.displayName = "
|
|
100
|
+
K.displayName = "FondueLegacyTextarea";
|
|
101
101
|
export {
|
|
102
|
-
K as
|
|
102
|
+
K as LegacyTextarea
|
|
103
103
|
};
|
|
104
|
-
//# sourceMappingURL=
|
|
104
|
+
//# sourceMappingURL=LegacyTextarea.es.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"LegacyTextarea.es.js","sources":["../../../src/components/LegacyTextarea/LegacyTextarea.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { useFocusRing } from '@react-aria/focus';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { Validation, validationClassMap } from '@utilities/validation';\nimport { LoadingCircle, LoadingCircleSize } from '@components/LoadingCircle';\nimport {\n AriaAttributes,\n FocusEvent,\n FormEvent,\n KeyboardEvent,\n ReactElement,\n ReactNode,\n useEffect,\n useRef,\n} from 'react';\nimport TextareaAutosize from 'react-textarea-autosize';\nimport { IconExclamationMarkTriangle } from '@foundation/Icon/Generated';\n\nexport type TextareaProps = {\n id?: string;\n value?: string;\n required?: boolean;\n decorator?: ReactNode;\n placeholder?: string;\n disabled?: boolean;\n onInput?: (value: string) => void;\n onBlur?: (value: string) => void;\n onFocus?: (e: FocusEvent<HTMLTextAreaElement>) => void;\n validation?: Validation;\n /** When autosize if false, this is used as 'rows' property for standard textarea */\n minRows?: number;\n /** When autosize if false, this property is ignored */\n maxRows?: number;\n autosize?: boolean;\n resizeable?: boolean;\n selectable?: boolean;\n focusOnMount?: boolean;\n onEnterPressed?: (event: KeyboardEvent<HTMLTextAreaElement>) => void;\n} & AriaAttributes;\n\nexport const LegacyTextarea = ({\n id: propId,\n value,\n required = false,\n decorator,\n placeholder,\n disabled = false,\n onInput,\n onBlur,\n validation = Validation.Default,\n minRows,\n maxRows,\n autosize = false,\n resizeable = true,\n onFocus,\n selectable = false,\n focusOnMount,\n onEnterPressed,\n ...props\n}: TextareaProps): ReactElement => {\n const Component = autosize ? TextareaAutosize : 'textarea';\n\n const textareaElement = useRef<HTMLTextAreaElement | null>(null);\n\n useEffect(() => {\n focusOnMount && textareaElement.current?.focus();\n }, [focusOnMount]);\n\n const onKeyDown = (event: KeyboardEvent<HTMLTextAreaElement>) => {\n if (event.key === 'Enter') {\n onEnterPressed?.(event);\n }\n };\n\n const onBlurHandler = (event: FocusEvent<HTMLTextAreaElement>) => {\n if (onBlur) {\n onBlur(event.target.value);\n }\n };\n\n const onInputHandler = (event: FormEvent<HTMLTextAreaElement>) => {\n if (onInput) {\n onInput((event.target as HTMLTextAreaElement).value);\n }\n };\n\n const { isFocusVisible, focusProps } = useFocusRing({ isTextInput: true, within: true });\n const autosizeProps = { maxRows, minRows };\n\n return (\n <div className=\"tw-relative\" {...focusProps}>\n {decorator && (\n <div\n className=\"tw-absolute tw-top-2 tw-left-2 tw-inline-flex tw-items-end tw-text-black-80\"\n data-test-id=\"decorator\"\n >\n {decorator}\n </div>\n )}\n <Component\n {...(autosize ? autosizeProps : { rows: minRows })}\n onClick={() => textareaElement.current?.focus()}\n id={useMemoizedId(propId)}\n ref={textareaElement}\n value={value}\n placeholder={placeholder}\n required={required}\n className={merge([\n 'tw-w-full tw-p-2 tw-border tw-rounded tw-text-s tw-outline-none tw-transition tw-placeholder-black-60',\n !!decorator && 'tw-pl-7 ',\n disabled\n ? 'tw-border-black-5 tw-bg-black-5 tw-text-black-40'\n : 'tw-text-black tw-border-black-20 hover:tw-border-line-x-strong focus-within:tw-border-line-xx-strong focus-within:hover:tw-border-line-xx-strong',\n isFocusVisible && FOCUS_STYLE,\n validationClassMap[validation],\n !resizeable && 'tw-resize-none',\n validation === Validation.Error && 'tw-pr-8',\n ])}\n disabled={disabled}\n onBlur={onBlurHandler}\n onFocus={(e) => {\n if (selectable) {\n e.target.select();\n }\n if (onFocus) {\n onFocus(e);\n }\n }}\n onInput={onInputHandler}\n onKeyDown={onKeyDown}\n data-test-id=\"textarea\"\n {...props}\n />\n {validation === Validation.Loading && (\n <span className=\"tw-absolute tw-top-[-0.55rem] tw-right-[-0.55rem] tw-bg-white tw-rounded-full tw-p-[2px] tw-border tw-border-black-10\">\n <LoadingCircle size={LoadingCircleSize.ExtraSmall} />\n </span>\n )}\n {(validation === Validation.Error || validation === Validation.Warning) && (\n <span\n className={merge([\n 'tw-absolute tw-top-[0.6rem] tw-right-[0.6rem]',\n validation === Validation.Error && 'tw-text-text-negative',\n validation === Validation.Warning && 'tw-text-text-warning',\n ])}\n data-test-id=\"error-state-exclamation-mark-icon\"\n >\n <IconExclamationMarkTriangle />\n </span>\n )}\n </div>\n );\n};\nLegacyTextarea.displayName = 'FondueLegacyTextarea';\n"],"names":["LegacyTextarea","propId","value","required","decorator","placeholder","disabled","onInput","onBlur","validation","Validation","minRows","maxRows","autosize","resizeable","onFocus","selectable","focusOnMount","onEnterPressed","props","Component","TextareaAutosize","textareaElement","useRef","useEffect","_a","onKeyDown","event","onBlurHandler","onInputHandler","isFocusVisible","focusProps","useFocusRing","jsxs","jsx","useMemoizedId","merge","FOCUS_STYLE","validationClassMap","e","LoadingCircle","LoadingCircleSize","IconExclamationMarkTriangle"],"mappings":"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"}
|