@frontify/fondue 13.9.0 → 14.0.0-beta.0

package/dist/components/FormControl/FormControl.es.js

@@ -1,129 +0,0 @@
-import { jsxs as u, jsx as s } from "react/jsx-runtime";
-import { isValidElement as v, cloneElement as g } from "react";
-import { InputLabel as V } from "../InputLabel/InputLabel.es.js";
-import { merge as d } from "../../utilities/merge.es.js";
-import { Validation as c } from "../../utilities/validation.es.js";
-var p = /* @__PURE__ */ ((t) => (t.Primary = "Primary", t.Positive = "Positive", t.Danger = "Danger", t))(p || {});
-const N = {
-  Primary: c.Default,
-  Positive: c.Success,
-  Danger: c.Error
-}, m = ({
-  text: t,
-  disabled: e,
-  style: i,
-  fullWidth: w = !1,
-  "data-test-id": a = "form-control"
-}) => {
-  let r;
-  switch (!0) {
-    case e:
-      r = "tw-text-text-disabled";
-      break;
-    case i === "Danger":
-      r = "tw-text-text-negative";
-      break;
-    case i === "Positive":
-      r = "tw-text-text-positive";
-      break;
-    default:
-      r = "tw-text-text-weak";
-      break;
-  }
-  return /* @__PURE__ */ s(
-    "span",
-    {
-      "data-test-id": `${a}-helper-text`,
-      className: `tw-text-s tw-font-sans ${w ? "tw-w-full" : ""} ${r}`,
-      children: t
-    }
-  );
-};
-m.displayName = "FondueHelperText";
-var P = /* @__PURE__ */ ((t) => (t.Before = "Before", t.After = "After", t))(P || {}), k = /* @__PURE__ */ ((t) => (t.Horizontal = "Horizontal", t.Vertical = "Vertical", t))(k || {});
-const H = ({
-  label: t,
-  children: e,
-  extra: i,
-  name: w,
-  helper: a,
-  disabled: r,
-  clickable: l,
-  direction: o = "Vertical",
-  style: f = "Primary",
-  "data-test-id": n = "form-control"
-}) => {
-  const x = (a == null ? void 0 : a.position) === "Before";
-  return /* @__PURE__ */ u(
-    "div",
-    {
-      "data-test-id": n,
-      "data-name": w,
-      className: d([
-        "tw-flex tw-items-center tw-gap-2",
-        o === "Horizontal" ? "tw-flex-row" : "tw-w-full tw-flex-col"
-      ]),
-      children: [
-        t != null && t.children || i ? /* @__PURE__ */ u(
-          "div",
-          {
-            className: d([
-              "tw-flex tw-flew-row tw-items-center tw-justify-between",
-              o === "Vertical" && "tw-w-full"
-            ]),
-            children: [
-              t != null && t.children ? /* @__PURE__ */ s(V, { ...t, disabled: r, clickable: l }) : null,
-              i ? /* @__PURE__ */ s(
-                "span",
-                {
-                  "data-test-id": `${n}-extra`,
-                  className: "tw-pl-2 tw-text-black-80 tw-font-sans tw-text-s tw-whitespace-nowrap",
-                  children: i
-                }
-              ) : null
-            ]
-          }
-        ) : null,
-        (a == null ? void 0 : a.text) && x && /* @__PURE__ */ s(
-          m,
-          {
-            style: f,
-            fullWidth: o === "Vertical",
-            text: a.text,
-            disabled: r,
-            "data-test-id": n
-          }
-        ),
-        e ? /* @__PURE__ */ s(
-          "div",
-          {
-            className: o === "Vertical" ? "tw-w-full tw-grid tw-grid-cols-1 tw-gap-5" : "",
-            children: v(e) ? g(e, {
-              id: (t == null ? void 0 : t.htmlFor) ?? e.props.id,
-              disabled: r,
-              validation: N[f]
-            }) : e
-          }
-        ) : null,
-        (a == null ? void 0 : a.text) && !x && /* @__PURE__ */ s(
-          m,
-          {
-            fullWidth: o === "Vertical",
-            text: a.text,
-            disabled: r,
-            style: f,
-            "data-test-id": n
-          }
-        )
-      ]
-    }
-  );
-};
-H.displayName = "FondueFormControl";
-export {
-  H as FormControl,
-  k as FormControlDirection,
-  p as FormControlStyle,
-  P as HelperPosition
-};
-//# sourceMappingURL=FormControl.es.js.map

package/dist/components/FormControl/FormControl.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FormControl.es.js","sources":["../../../src/components/FormControl/FormControl.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, type ReactNode, cloneElement, isValidElement } from 'react';\n\nimport { InputLabel, type InputLabelProps } from '@components/InputLabel/InputLabel';\nimport { merge } from '@utilities/merge';\nimport { Validation } from '@utilities/validation';\n/**\n * @deprecated Please use a custom component instead.\n */\nexport enum FormControlStyle {\n    Primary = 'Primary',\n    Positive = 'Positive',\n    Danger = 'Danger',\n}\n\ntype HelperTextProps = {\n    text: string;\n    style: FormControlStyle;\n    disabled?: boolean;\n    fullWidth?: boolean;\n    'data-test-id'?: string;\n};\n\nconst inputValidation: Record<FormControlStyle, Validation> = {\n    [FormControlStyle.Primary]: Validation.Default,\n    [FormControlStyle.Positive]: Validation.Success,\n    [FormControlStyle.Danger]: Validation.Error,\n};\n\nconst HelperText = ({\n    text,\n    disabled,\n    style,\n    fullWidth = false,\n    'data-test-id': dataTestId = 'form-control',\n}: HelperTextProps): ReactElement => {\n    let textColorClass;\n\n    switch (true) {\n        case disabled:\n            textColorClass = 'tw-text-text-disabled';\n            break;\n        case style === FormControlStyle.Danger:\n            textColorClass = 'tw-text-text-negative';\n            break;\n        case style === FormControlStyle.Positive:\n            textColorClass = 'tw-text-text-positive';\n            break;\n        default:\n            textColorClass = 'tw-text-text-weak';\n            break;\n    }\n\n    return (\n        <span\n            data-test-id={`${dataTestId}-helper-text`}\n            className={`tw-text-s tw-font-sans ${fullWidth ? 'tw-w-full' : ''} ${textColorClass}`}\n        >\n            {text}\n        </span>\n    );\n};\nHelperText.displayName = 'FondueHelperText';\n/**\n * @deprecated Please use a custom component instead.\n */\nexport enum HelperPosition {\n    Before = 'Before',\n    After = 'After',\n}\n/**\n * @deprecated Please use a custom component instead.\n */\nexport enum FormControlDirection {\n    Horizontal = 'Horizontal',\n    Vertical = 'Vertical',\n}\n/**\n * @deprecated Please use a custom component instead.\n */\nexport type FormControlProps = {\n    direction?: FormControlDirection;\n    disabled?: boolean;\n    clickable?: boolean;\n    label?: Omit<InputLabelProps, 'disabled'>;\n    extra?: ReactNode;\n    helper?: Omit<HelperTextProps, 'disabled' | 'style'> & { position?: HelperPosition };\n    style?: FormControlStyle;\n    name?: string;\n    children?: ReactNode;\n    'data-test-id'?: string;\n};\n\n/**\n * @deprecated This component is deprecated and will be removed in the next major version.\n */\nexport const FormControl = ({\n    label,\n    children,\n    extra,\n    name,\n    helper,\n    disabled,\n    clickable,\n    direction = FormControlDirection.Vertical,\n    style = FormControlStyle.Primary,\n    'data-test-id': dataTestId = 'form-control',\n}: FormControlProps): ReactElement => {\n    const isHelperBefore = helper?.position === HelperPosition.Before;\n\n    return (\n        <div\n            data-test-id={dataTestId}\n            data-name={name}\n            className={merge([\n                'tw-flex tw-items-center tw-gap-2',\n                direction === FormControlDirection.Horizontal ? 'tw-flex-row' : 'tw-w-full tw-flex-col',\n            ])}\n        >\n            {label?.children || extra ? (\n                <div\n                    className={merge([\n                        'tw-flex tw-flew-row tw-items-center tw-justify-between',\n                        direction === FormControlDirection.Vertical && 'tw-w-full',\n                    ])}\n                >\n                    {label?.children ? <InputLabel {...label} disabled={disabled} clickable={clickable} /> : null}\n                    {extra ? (\n                        <span\n                            data-test-id={`${dataTestId}-extra`}\n                            className=\"tw-pl-2 tw-text-black-80 tw-font-sans tw-text-s tw-whitespace-nowrap\"\n                        >\n                            {extra}\n                        </span>\n                    ) : null}\n                </div>\n            ) : null}\n            {helper?.text && isHelperBefore && (\n                <HelperText\n                    style={style}\n                    fullWidth={direction === FormControlDirection.Vertical}\n                    text={helper.text}\n                    disabled={disabled}\n                    data-test-id={dataTestId}\n                />\n            )}\n            {children ? (\n                <div\n                    className={\n                        direction === FormControlDirection.Vertical ? 'tw-w-full tw-grid tw-grid-cols-1 tw-gap-5' : ''\n                    }\n                >\n                    {isValidElement(children)\n                        ? cloneElement(children as ReactElement, {\n                              id: label?.htmlFor ?? children.props.id,\n                              disabled,\n                              validation: inputValidation[style],\n                          })\n                        : children}\n                </div>\n            ) : null}\n            {helper?.text && !isHelperBefore && (\n                <HelperText\n                    fullWidth={direction === FormControlDirection.Vertical}\n                    text={helper.text}\n                    disabled={disabled}\n                    style={style}\n                    data-test-id={dataTestId}\n                />\n            )}\n        </div>\n    );\n};\nFormControl.displayName = 'FondueFormControl';\n"],"names":["FormControlStyle","inputValidation","Validation","HelperText","text","disabled","style","fullWidth","dataTestId","textColorClass","jsx","HelperPosition","FormControlDirection","FormControl","label","children","extra","name","helper","clickable","direction","isHelperBefore","jsxs","merge","InputLabel","isValidElement","cloneElement"],"mappings":"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"}

package/dist/components/FrontifyPattern/FrontifyPattern.es.js

@@ -1,26 +0,0 @@
-import { jsx as o } from "react/jsx-runtime";
-import { cloneElement as i } from "react";
-import { patternDesigns as m, PatternDesign as s } from "../../foundation/Pattern/PatternDesigns.es.js";
-import { patternScales as p, PatternScale as f } from "../../foundation/Pattern/PatternScale.es.js";
-import { PatternTheme as l, patternThemes as c } from "../../foundation/Pattern/PatternTheme.es.js";
-import { merge as d } from "../../utilities/merge.es.js";
-const g = ({
-  pattern: t = s.DigitalAssets,
-  scale: e = f.SM,
-  scaleOrigin: r = ["top", "left"],
-  foregroundColor: a = l.Black,
-  "data-test-id": n = "frontify-pattern"
-}) => /* @__PURE__ */ o(
-  "div",
-  {
-    "data-test-id": n,
-    className: d(["tw-w-[260px]", c[a]]),
-    style: { transformOrigin: `${r.join(" ")}`, transform: `scale(${p[e]})` },
-    children: i(m[t])
-  }
-);
-g.displayName = "FondueFrontifyPattern";
-export {
-  g as FrontifyPattern
-};
-//# sourceMappingURL=FrontifyPattern.es.js.map

package/dist/components/FrontifyPattern/FrontifyPattern.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FrontifyPattern.es.js","sources":["../../../src/components/FrontifyPattern/FrontifyPattern.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement, cloneElement } from 'react';\n\nimport { PatternDesign, PatternScale, type PatternScaleOrigin, PatternTheme } from '@foundation/Pattern';\nimport { patternDesigns } from '@foundation/Pattern/PatternDesigns';\nimport { patternScales } from '@foundation/Pattern/PatternScale';\nimport { patternThemes } from '@foundation/Pattern/PatternTheme';\nimport { merge } from '@utilities/merge';\n\n/**\n * @deprecated Please use a custom component instead.\n */\nexport type FrontifyPatternProps = {\n    pattern: PatternDesign;\n    scale?: PatternScale;\n    scaleOrigin?: PatternScaleOrigin;\n    foregroundColor?: PatternTheme;\n    'data-test-id'?: string;\n};\n\n/**\n * @deprecated Please use a custom component instead.\n */\nexport const FrontifyPattern = ({\n    pattern = PatternDesign.DigitalAssets,\n    scale = PatternScale.SM,\n    scaleOrigin = ['top', 'left'],\n    foregroundColor = PatternTheme.Black,\n    'data-test-id': dataTestId = 'frontify-pattern',\n}: FrontifyPatternProps): ReactElement => {\n    return (\n        <div\n            data-test-id={dataTestId}\n            className={merge(['tw-w-[260px]', patternThemes[foregroundColor]])}\n            style={{ transformOrigin: `${scaleOrigin.join(' ')}`, transform: `scale(${patternScales[scale]})` }}\n        >\n            {cloneElement(patternDesigns[pattern])}\n        </div>\n    );\n};\nFrontifyPattern.displayName = 'FondueFrontifyPattern';\n"],"names":["FrontifyPattern","pattern","PatternDesign","scale","PatternScale","scaleOrigin","foregroundColor","PatternTheme","dataTestId","jsx","merge","patternThemes","patternScales","cloneElement","patternDesigns"],"mappings":";;;;;;AAwBO,MAAMA,IAAkB,CAAC;AAAA,EAC5B,SAAAC,IAAUC,EAAc;AAAA,EACxB,OAAAC,IAAQC,EAAa;AAAA,EACrB,aAAAC,IAAc,CAAC,OAAO,MAAM;AAAA,EAC5B,iBAAAC,IAAkBC,EAAa;AAAA,EAC/B,gBAAgBC,IAAa;AACjC,MAEQ,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAcD;AAAA,IACd,WAAWE,EAAM,CAAC,gBAAgBC,EAAcL,CAAe,CAAC,CAAC;AAAA,IACjE,OAAO,EAAE,iBAAiB,GAAGD,EAAY,KAAK,GAAG,CAAC,IAAI,WAAW,SAASO,EAAcT,CAAK,CAAC,IAAA;AAAA,IAE7F,UAAAU,EAAaC,EAAeb,CAAO,CAAC;AAAA,EAAA;AAAA;AAIjDD,EAAgB,cAAc;"}

package/dist/components/LegacyTextarea/LegacyTextarea.es.js

@@ -1,109 +0,0 @@
-import { jsxs as S, jsx as o } from "react/jsx-runtime";
-import { IconExclamationMarkTriangle as j } from "@frontify/fondue-icons";
-import { useFocusRing as v } from "@react-aria/focus";
-import { useRef as D, useEffect as H } from "react";
-import M from "react-textarea-autosize";
-import { LoadingCircle as V, LoadingCircleSize as W } from "../LoadingCircle/LoadingCircle.es.js";
-import { useMemoizedId as A } from "../../hooks/useMemoizedId.es.js";
-import { FOCUS_STYLE as B } from "../../utilities/focusStyle.es.js";
-import { merge as x } from "../../utilities/merge.es.js";
-import { validationClassMap as K, Validation as r } from "../../utilities/validation.es.js";
-const R = ({
-  id: d,
-  value: g,
-  required: b = !1,
-  decorator: a,
-  placeholder: h,
-  disabled: s = !1,
-  onInput: n,
-  onBlur: c,
-  validation: e = r.Default,
-  minRows: w,
-  maxRows: k,
-  autosize: m = !1,
-  resizeable: T = !0,
-  onFocus: u,
-  selectable: z = !1,
-  focusOnMount: f,
-  onEnterPressed: i,
-  ...C
-}) => {
-  const L = m ? M : "textarea", l = D(null);
-  H(() => {
-    if (f) {
-      const t = setTimeout(() => {
-        var p;
-        (p = l.current) == null || p.focus();
-      }, 0);
-      return () => clearTimeout(t);
-    }
-  }, [f]);
-  const N = (t) => {
-    t.key === "Enter" && (i == null || i(t));
-  }, y = (t) => {
-    c && c(t.target.value);
-  }, E = (t) => {
-    n && n(t.target.value);
-  }, { isFocusVisible: I, focusProps: F } = v({ isTextInput: !0, within: !0 });
-  return /* @__PURE__ */ S("div", { className: "tw-relative", ...F, children: [
-    a ? /* @__PURE__ */ o(
-      "div",
-      {
-        className: "tw-absolute tw-top-2 tw-left-2 tw-inline-flex tw-items-end tw-text-black-80",
-        "data-test-id": "decorator",
-        children: a
-      }
-    ) : null,
-    /* @__PURE__ */ o(
-      L,
-      {
-        ...m ? { maxRows: k, minRows: w } : { rows: w },
-        onClick: () => {
-          var t;
-          return (t = l.current) == null ? void 0 : t.focus();
-        },
-        id: A(d),
-        ref: l,
-        value: g,
-        placeholder: h,
-        required: b,
-        className: x([
-          "tw-w-full tw-p-2 tw-border tw-rounded tw-text-s tw-outline-none tw-transition tw-placeholder-black-60",
-          !!a && "tw-pl-7 ",
-          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",
-          I && B,
-          K[e],
-          !T && "tw-resize-none",
-          e === r.Error && "tw-pr-8"
-        ]),
-        disabled: s,
-        onBlur: y,
-        onFocus: (t) => {
-          z && t.target.select(), u && u(t);
-        },
-        onInput: E,
-        onKeyDown: N,
-        "data-test-id": "textarea",
-        ...C
-      }
-    ),
-    e === r.Loading && /* @__PURE__ */ o("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", children: /* @__PURE__ */ o(V, { size: W.ExtraSmall }) }),
-    (e === r.Error || e === r.Warning) && /* @__PURE__ */ o(
-      "span",
-      {
-        className: x([
-          "tw-absolute tw-top-[0.6rem] tw-right-[0.6rem]",
-          e === r.Error && "tw-text-text-negative",
-          e === r.Warning && "tw-text-text-warning"
-        ]),
-        "data-test-id": "error-state-exclamation-mark-icon",
-        children: /* @__PURE__ */ o(j, {})
-      }
-    )
-  ] });
-};
-R.displayName = "FondueLegacyTextarea";
-export {
-  R as LegacyTextarea
-};
-//# sourceMappingURL=LegacyTextarea.es.js.map

package/dist/components/LegacyTextarea/LegacyTextarea.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LegacyTextarea.es.js","sources":["../../../src/components/LegacyTextarea/LegacyTextarea.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { IconExclamationMarkTriangle } from '@frontify/fondue-icons';\nimport { useFocusRing } from '@react-aria/focus';\nimport {\n    type AriaAttributes,\n    type FocusEvent,\n    type FormEvent,\n    type KeyboardEvent,\n    type ReactElement,\n    type ReactNode,\n    useEffect,\n    useRef,\n} from 'react';\nimport TextareaAutosize from 'react-textarea-autosize';\n\nimport { LoadingCircle, LoadingCircleSize } from '@components/LoadingCircle/LoadingCircle';\nimport { useMemoizedId } from '@hooks/useMemoizedId';\nimport { FOCUS_STYLE } from '@utilities/focusStyle';\nimport { merge } from '@utilities/merge';\nimport { Validation, validationClassMap } from '@utilities/validation';\n\n/**\n * @deprecated Please use updated Textarea component from `@frontify/fondue/components` instead.\n */\nexport type LegacyTextareaProps = {\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\n/**\n * @deprecated Please use updated Textarea component from `@frontify/fondue/components` instead.\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}: LegacyTextareaProps): ReactElement => {\n    const Component = autosize ? TextareaAutosize : 'textarea';\n\n    const textareaElement = useRef<HTMLTextAreaElement | null>(null);\n\n    useEffect(() => {\n        if (focusOnMount) {\n            const timeoutId = setTimeout(() => {\n                textareaElement.current?.focus();\n            }, 0);\n            return () => clearTimeout(timeoutId);\n        }\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            ) : null}\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","timeoutId","_a","onKeyDown","event","onBlurHandler","onInputHandler","isFocusVisible","focusProps","useFocusRing","jsxs","jsx","useMemoizedId","merge","FOCUS_STYLE","validationClassMap","e","LoadingCircle","LoadingCircleSize","IconExclamationMarkTriangle"],"mappings":"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"}

package/dist/components/LoadingCircle/LoadingCircle.es.js

@@ -1,33 +0,0 @@
-import { jsx as a } from "react/jsx-runtime";
-import { merge as s } from "../../utilities/merge.es.js";
-var d = /* @__PURE__ */ ((t) => (t.ExtraSmall = "ExtraSmall", t.Small = "Small", t.Medium = "Medium", t.Large = "Large", t))(d || {});
-const l = {
-  Progress: "tw-border-violet-60",
-  Positive: "tw-border-green-60",
-  Danger: "tw-border-red-60"
-}, o = {
-  ExtraSmall: "tw-w-4 tw-h-4",
-  Small: "tw-w-5 tw-h-5",
-  Medium: "tw-w-8 tw-h-8",
-  Large: "tw-w-16 tw-h-16"
-}, w = ({
-  style: t = "Progress",
-  size: r = "Medium",
-  "data-test-id": e = "loading-circle"
-}) => /* @__PURE__ */ a(
-  "div",
-  {
-    "data-test-id": e,
-    className: s([
-      "tw-border-2 tw-border-solid tw-rounded-full tw-border-t-transparent tw-animate-spin",
-      l[t],
-      o[r]
-    ])
-  }
-);
-w.displayName = "FondueLoadingCircle";
-export {
-  w as LoadingCircle,
-  d as LoadingCircleSize
-};
-//# sourceMappingURL=LoadingCircle.es.js.map

package/dist/components/LoadingCircle/LoadingCircle.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LoadingCircle.es.js","sources":["../../../src/components/LoadingCircle/LoadingCircle.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactElement } from 'react';\n\nimport { merge } from '@utilities/merge';\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nenum LoadingCircleStyle {\n    Progress = 'Progress',\n    Positive = 'Positive',\n    Danger = 'Danger',\n}\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nexport enum LoadingCircleSize {\n    ExtraSmall = 'ExtraSmall',\n    Small = 'Small',\n    Medium = 'Medium',\n    Large = 'Large',\n}\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nexport type LoadingCircleProps = {\n    style?: LoadingCircleStyle;\n    size?: LoadingCircleSize;\n    'data-test-id'?: string;\n};\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nconst statusClasses: Record<LoadingCircleStyle, string> = {\n    [LoadingCircleStyle.Progress]: 'tw-border-violet-60',\n    [LoadingCircleStyle.Positive]: 'tw-border-green-60',\n    [LoadingCircleStyle.Danger]: 'tw-border-red-60',\n};\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nconst sizeClasses: Record<LoadingCircleSize, string> = {\n    [LoadingCircleSize.ExtraSmall]: 'tw-w-4 tw-h-4',\n    [LoadingCircleSize.Small]: 'tw-w-5 tw-h-5',\n    [LoadingCircleSize.Medium]: 'tw-w-8 tw-h-8',\n    [LoadingCircleSize.Large]: 'tw-w-16 tw-h-16',\n};\n\n/**\n * @deprecated Please use updated LoadingCircle component from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#loading-circle the migration guide}.\n */\nexport const LoadingCircle = ({\n    style = LoadingCircleStyle.Progress,\n    size = LoadingCircleSize.Medium,\n    'data-test-id': dataTestId = 'loading-circle',\n}: LoadingCircleProps): ReactElement => {\n    return (\n        <div\n            data-test-id={dataTestId}\n            className={merge([\n                'tw-border-2 tw-border-solid tw-rounded-full tw-border-t-transparent tw-animate-spin',\n                statusClasses[style],\n                sizeClasses[size],\n            ])}\n        ></div>\n    );\n};\nLoadingCircle.displayName = 'FondueLoadingCircle';\n"],"names":["LoadingCircleSize","statusClasses","sizeClasses","LoadingCircle","style","size","dataTestId","jsx","merge"],"mappings":";;AAkBO,IAAKA,sBAAAA,OACRA,EAAA,aAAa,cACbA,EAAA,QAAQ,SACRA,EAAA,SAAS,UACTA,EAAA,QAAQ,SAJAA,IAAAA,KAAA,CAAA,CAAA;AAmBZ,MAAMC,IAAoD;AAAA,EACrD,UAA8B;AAAA,EAC9B,UAA8B;AAAA,EAC9B,QAA4B;AACjC,GAKMC,IAAiD;AAAA,EAClD,YAA+B;AAAA,EAC/B,OAA0B;AAAA,EAC1B,QAA2B;AAAA,EAC3B,OAA0B;AAC/B,GAKaC,IAAgB,CAAC;AAAA,EAC1B,OAAAC,IAAQ;AAAA,EACR,MAAAC,IAAO;AAAA,EACP,gBAAgBC,IAAa;AACjC,MAEQ,gBAAAC;AAAA,EAAC;AAAA,EAAA;AAAA,IACG,gBAAcD;AAAA,IACd,WAAWE,EAAM;AAAA,MACb;AAAA,MACAP,EAAcG,CAAK;AAAA,MACnBF,EAAYG,CAAI;AAAA,IAAA,CACnB;AAAA,EAAA;AAAA;AAIbF,EAAc,cAAc;"}

package/dist/components/Menu/Menu.es.js

@@ -1,66 +0,0 @@
-import { jsx as l } from "react/jsx-runtime";
-import { useState as u, useCallback as M, useEffect as a } from "react";
-import { usePopper as y } from "react-popper";
-import { useMenuKeyboardNavigation as A } from "./useMenuKeyboardNavigation.es.js";
-import { useClickOutside as v } from "../../hooks/useClickOutside.es.js";
-import { INSET_BORDER as C } from "../../utilities/borderStyle.es.js";
-import { merge as f } from "../../utilities/merge.es.js";
-const I = "tw-relative tw-bg-base tw-rounded tw-py-2 tw-shadow-mid tw-z-[120000]", _ = f([I, C]), h = ({
-  triggerRef: s,
-  children: c,
-  open: o = !0,
-  offset: b = [0, 8],
-  onClose: n,
-  "data-test-id": E = "menu"
-}) => {
-  const [t, r] = u(o), [e, N] = u(null), [m, w] = u(null), O = M(() => {
-    e && t && (r(!1), n && n());
-  }, [e, t, n]), { dismissibleElementRef: S } = v(O, [
-    e
-  ]), p = A(
-    t,
-    m,
-    "li > a, li > button:not(:disabled)"
-  ), i = y(e, m, {
-    placement: "bottom-start",
-    strategy: "fixed",
-    modifiers: [
-      {
-        name: "flip",
-        enabled: !0
-      },
-      {
-        name: "offset",
-        options: {
-          offset: b
-        }
-      }
-    ]
-  });
-  return a(() => {
-    const d = s == null ? void 0 : s.current;
-    d && N(d);
-  }, [s]), a(() => {
-    r(o);
-  }, [o]), a(() => {
-    t && i.update && i.update();
-  }, [t]), a(() => {
-    p === "CLOSE_MENU" && e && (r(!1), n && n());
-  }, [p, n, e]), /* @__PURE__ */ l(
-    "nav",
-    {
-      className: f([_, t ? "tw-block" : "tw-hidden"]),
-      ref: w,
-      style: e ? i.styles.popper : {},
-      ...e ? i.attributes.popper : {},
-      "data-test-id": E,
-      role: t ? "navigation" : "",
-      children: /* @__PURE__ */ l("ol", { ref: S, className: "tw-list-none", children: c })
-    }
-  );
-};
-h.displayName = "FondueMenu";
-export {
-  h as Menu
-};
-//# sourceMappingURL=Menu.es.js.map

package/dist/components/Menu/Menu.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Menu.es.js","sources":["../../../src/components/Menu/Menu.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { type ReactNode, type RefObject, useCallback, useEffect, useState } from 'react';\nimport { usePopper } from 'react-popper';\n\nimport { useMenuKeyboardNavigation } from '@components/Menu/useMenuKeyboardNavigation';\nimport { useClickOutside } from '@hooks/useClickOutside';\nimport { INSET_BORDER } from '@utilities/borderStyle';\nimport { merge } from '@utilities/merge';\n\ninterface Props {\n    triggerRef?: RefObject<Element>;\n    open?: boolean;\n    children?: ReactNode | ReactNode[];\n    onClose?: () => void;\n    offset?: [number, number];\n    'data-test-id'?: string;\n}\n\n/**\n * @deprecated Use `Dropdown` from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#dropdown the migration guide}.\n */\nexport type MenuProps = Props;\n\nconst CONTAINER_BASE_CLASSES = 'tw-relative tw-bg-base tw-rounded tw-py-2 tw-shadow-mid tw-z-[120000]';\nconst CONTAINER_CLASSES = merge([CONTAINER_BASE_CLASSES, INSET_BORDER]);\n\n/**\n * @deprecated Use `Dropdown` from `@frontify/fondue/components` instead. Also check {@link https://github.com/Frontify/fondue/blob/main/packages/components/MIGRATING.md#dropdown the migration guide}.\n */\nexport const Menu = ({\n    triggerRef,\n    children,\n    open = true,\n    offset = [0, 8],\n    onClose,\n    'data-test-id': dataTestId = 'menu',\n}: MenuProps) => {\n    const [isMenuOpen, setIsMenuOpen] = useState(open);\n    const [menuOpenerRef, setMenuOpenerRef] = useState<HTMLElement | null>(null);\n    const [menuContainerRef, setMenuContainerRef] = useState<HTMLElement | null>(null);\n\n    const handleClickOutside = useCallback(() => {\n        if (menuOpenerRef && isMenuOpen) {\n            setIsMenuOpen(false);\n            if (onClose) {\n                onClose();\n            }\n        }\n    }, [menuOpenerRef, isMenuOpen, onClose]);\n\n    const { dismissibleElementRef } = useClickOutside<HTMLOListElement>(handleClickOutside, [\n        menuOpenerRef as HTMLElement,\n    ]);\n\n    const menuKeyboardNavigationAction = useMenuKeyboardNavigation(\n        isMenuOpen,\n        menuContainerRef,\n        'li > a, li > button:not(:disabled)',\n    );\n\n    const popperInstance = usePopper(menuOpenerRef, menuContainerRef, {\n        placement: 'bottom-start',\n        strategy: 'fixed',\n        modifiers: [\n            {\n                name: 'flip',\n                enabled: true,\n            },\n            {\n                name: 'offset',\n                options: {\n                    offset,\n                },\n            },\n        ],\n    });\n\n    useEffect(() => {\n        const trigger = triggerRef?.current;\n\n        if (trigger) {\n            setMenuOpenerRef(trigger as HTMLElement);\n        }\n    }, [triggerRef]);\n\n    useEffect(() => {\n        setIsMenuOpen(open);\n    }, [open]);\n\n    useEffect(() => {\n        if (isMenuOpen && popperInstance.update) {\n            popperInstance.update();\n        }\n        // eslint-disable-next-line @eslint-react/exhaustive-deps\n    }, [isMenuOpen]);\n\n    useEffect(() => {\n        if (menuKeyboardNavigationAction === 'CLOSE_MENU' && menuOpenerRef) {\n            setIsMenuOpen(false);\n            if (onClose) {\n                onClose();\n            }\n        }\n    }, [menuKeyboardNavigationAction, onClose, menuOpenerRef]);\n\n    return (\n        <nav\n            className={merge([CONTAINER_CLASSES, isMenuOpen ? 'tw-block' : 'tw-hidden'])}\n            ref={setMenuContainerRef}\n            style={menuOpenerRef ? popperInstance.styles.popper : {}}\n            {...(menuOpenerRef ? popperInstance.attributes.popper : {})}\n            data-test-id={dataTestId}\n            role={isMenuOpen ? 'navigation' : ''}\n        >\n            <ol ref={dismissibleElementRef} className=\"tw-list-none\">\n                {children}\n            </ol>\n        </nav>\n    );\n};\nMenu.displayName = 'FondueMenu';\n"],"names":["CONTAINER_BASE_CLASSES","CONTAINER_CLASSES","merge","INSET_BORDER","Menu","triggerRef","children","open","offset","onClose","dataTestId","isMenuOpen","setIsMenuOpen","useState","menuOpenerRef","setMenuOpenerRef","menuContainerRef","setMenuContainerRef","handleClickOutside","useCallback","dismissibleElementRef","useClickOutside","menuKeyboardNavigationAction","useMenuKeyboardNavigation","popperInstance","usePopper","useEffect","trigger","jsx"],"mappings":";;;;;;;AAwBA,MAAMA,IAAyB,yEACzBC,IAAoBC,EAAM,CAACF,GAAwBG,CAAY,CAAC,GAKzDC,IAAO,CAAC;AAAA,EACjB,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,QAAAC,IAAS,CAAC,GAAG,CAAC;AAAA,EACd,SAAAC;AAAA,EACA,gBAAgBC,IAAa;AACjC,MAAiB;AACb,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAASN,CAAI,GAC3C,CAACO,GAAeC,CAAgB,IAAIF,EAA6B,IAAI,GACrE,CAACG,GAAkBC,CAAmB,IAAIJ,EAA6B,IAAI,GAE3EK,IAAqBC,EAAY,MAAM;AACzC,IAAIL,KAAiBH,MACjBC,EAAc,EAAK,GACfH,KACAA,EAAA;AAAA,EAGZ,GAAG,CAACK,GAAeH,GAAYF,CAAO,CAAC,GAEjC,EAAE,uBAAAW,EAAA,IAA0BC,EAAkCH,GAAoB;AAAA,IACpFJ;AAAA,EAAA,CACH,GAEKQ,IAA+BC;AAAA,IACjCZ;AAAA,IACAK;AAAA,IACA;AAAA,EAAA,GAGEQ,IAAiBC,EAAUX,GAAeE,GAAkB;AAAA,IAC9D,WAAW;AAAA,IACX,UAAU;AAAA,IACV,WAAW;AAAA,MACP;AAAA,QACI,MAAM;AAAA,QACN,SAAS;AAAA,MAAA;AAAA,MAEb;AAAA,QACI,MAAM;AAAA,QACN,SAAS;AAAA,UACL,QAAAR;AAAA,QAAA;AAAA,MACJ;AAAA,IACJ;AAAA,EACJ,CACH;AAED,SAAAkB,EAAU,MAAM;AACZ,UAAMC,IAAUtB,KAAA,gBAAAA,EAAY;AAE5B,IAAIsB,KACAZ,EAAiBY,CAAsB;AAAA,EAE/C,GAAG,CAACtB,CAAU,CAAC,GAEfqB,EAAU,MAAM;AACZ,IAAAd,EAAcL,CAAI;AAAA,EACtB,GAAG,CAACA,CAAI,CAAC,GAETmB,EAAU,MAAM;AACZ,IAAIf,KAAca,EAAe,UAC7BA,EAAe,OAAA;AAAA,EAGvB,GAAG,CAACb,CAAU,CAAC,GAEfe,EAAU,MAAM;AACZ,IAAIJ,MAAiC,gBAAgBR,MACjDF,EAAc,EAAK,GACfH,KACAA,EAAA;AAAA,EAGZ,GAAG,CAACa,GAA8Bb,GAASK,CAAa,CAAC,GAGrD,gBAAAc;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,WAAW1B,EAAM,CAACD,GAAmBU,IAAa,aAAa,WAAW,CAAC;AAAA,MAC3E,KAAKM;AAAA,MACL,OAAOH,IAAgBU,EAAe,OAAO,SAAS,CAAA;AAAA,MACrD,GAAIV,IAAgBU,EAAe,WAAW,SAAS,CAAA;AAAA,MACxD,gBAAcd;AAAA,MACd,MAAMC,IAAa,eAAe;AAAA,MAElC,4BAAC,MAAA,EAAG,KAAKS,GAAuB,WAAU,gBACrC,UAAAd,EAAA,CACL;AAAA,IAAA;AAAA,EAAA;AAGZ;AACAF,EAAK,cAAc;"}

package/dist/components/Menu/useMenuKeyboardNavigation.es.js

@@ -1,32 +0,0 @@
-import { useState as a, useCallback as k, useEffect as c } from "react";
-const E = (r, i, f = "li > button:not(:disabled)") => {
-  const [s, n] = a(0), [o, l] = a(), [h, u] = a(""), y = k(
-    (t) => {
-      if (!o || !["Tab", "ArrowDown", "ArrowUp", "Escape"].includes(t.key))
-        return;
-      const e = t.key === "Tab" && !t.shiftKey, b = t.key === "Tab" && t.shiftKey, d = t.key === "Escape", m = e || t.key === "ArrowDown", w = b || t.key === "ArrowUp";
-      if (b && s <= 0 || e && s >= o.length - 1 || d) {
-        u("CLOSE_MENU");
-        return;
-      }
-      m ? n(Math.min(s + 1, o.length - 1)) : w && n(Math.max(s - 1, 0)), t.preventDefault();
-    },
-    [o, s]
-  );
-  return c(() => {
-    if (!r || !i)
-      return;
-    const t = i.querySelectorAll(f);
-    for (const e of t)
-      e.onkeydown = y;
-    !o && t.length > 0 && l(t);
-  }, [r, i, o, y, f]), c(() => {
-    o && o[s] && o[s].focus();
-  }, [s, o]), c(() => {
-    r || (l(void 0), u("")), n(0);
-  }, [r]), h;
-};
-export {
-  E as useMenuKeyboardNavigation
-};
-//# sourceMappingURL=useMenuKeyboardNavigation.es.js.map

package/dist/components/Menu/useMenuKeyboardNavigation.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useMenuKeyboardNavigation.es.js","sources":["../../../src/components/Menu/useMenuKeyboardNavigation.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { useCallback, useEffect, useState } from 'react';\n\n/**\n * @deprecated Please use custom keyboard navigation instead.\n */\nexport const useMenuKeyboardNavigation = (\n    isMenuOpened: boolean,\n    menuContainerRef: HTMLElement | null,\n    focusableElementsSelector = 'li > button:not(:disabled)',\n) => {\n    const [currentItemIndex, setCurrentItemIndex] = useState(0);\n    const [itemsElements, setItemsElements] = useState<NodeList>();\n    const [menuKeyboardNavigationAction, setMenuKeyboardNavigationAction] = useState('');\n\n    const handleKeyDown = useCallback(\n        (event: KeyboardEvent) => {\n            if (!itemsElements || !['Tab', 'ArrowDown', 'ArrowUp', 'Escape'].includes(event.key)) {\n                return;\n            }\n\n            const isTab = event.key === 'Tab' && !event.shiftKey;\n            const isShiftTab = event.key === 'Tab' && event.shiftKey;\n            const isEsc = event.key === 'Escape';\n            const shouldMoveDown = isTab || event.key === 'ArrowDown';\n            const shouldMoveUp = isShiftTab || event.key === 'ArrowUp';\n\n            if (\n                (isShiftTab && currentItemIndex <= 0) ||\n                (isTab && currentItemIndex >= itemsElements.length - 1) ||\n                isEsc\n            ) {\n                setMenuKeyboardNavigationAction('CLOSE_MENU');\n                return;\n            }\n\n            if (shouldMoveDown) {\n                setCurrentItemIndex(Math.min(currentItemIndex + 1, itemsElements.length - 1));\n            } else if (shouldMoveUp) {\n                setCurrentItemIndex(Math.max(currentItemIndex - 1, 0));\n            }\n\n            event.preventDefault();\n        },\n        [itemsElements, currentItemIndex],\n    );\n\n    useEffect(() => {\n        if (!isMenuOpened || !menuContainerRef) {\n            return;\n        }\n\n        const focusableItems = menuContainerRef.querySelectorAll(focusableElementsSelector);\n        for (const item of focusableItems) {\n            (item as HTMLButtonElement | HTMLAnchorElement).onkeydown = handleKeyDown;\n        }\n\n        if (!itemsElements && focusableItems.length > 0) {\n            // eslint-disable-next-line @eslint-react/set-state-in-effect\n            setItemsElements(focusableItems);\n        }\n    }, [isMenuOpened, menuContainerRef, itemsElements, handleKeyDown, focusableElementsSelector]);\n\n    useEffect(() => {\n        if (!itemsElements) {\n            return;\n        }\n\n        if (itemsElements[currentItemIndex]) {\n            (itemsElements[currentItemIndex] as HTMLButtonElement | HTMLAnchorElement).focus();\n        }\n    }, [currentItemIndex, itemsElements]);\n\n    useEffect(() => {\n        if (!isMenuOpened) {\n            // eslint-disable-next-line @eslint-react/set-state-in-effect\n            setItemsElements(undefined);\n            setMenuKeyboardNavigationAction('');\n        }\n\n        setCurrentItemIndex(0);\n    }, [isMenuOpened]);\n\n    return menuKeyboardNavigationAction;\n};\n"],"names":["useMenuKeyboardNavigation","isMenuOpened","menuContainerRef","focusableElementsSelector","currentItemIndex","setCurrentItemIndex","useState","itemsElements","setItemsElements","menuKeyboardNavigationAction","setMenuKeyboardNavigationAction","handleKeyDown","useCallback","event","isTab","isShiftTab","isEsc","shouldMoveDown","shouldMoveUp","useEffect","focusableItems","item"],"mappings":";AAOO,MAAMA,IAA4B,CACrCC,GACAC,GACAC,IAA4B,iCAC3B;AACD,QAAM,CAACC,GAAkBC,CAAmB,IAAIC,EAAS,CAAC,GACpD,CAACC,GAAeC,CAAgB,IAAIF,EAAA,GACpC,CAACG,GAA8BC,CAA+B,IAAIJ,EAAS,EAAE,GAE7EK,IAAgBC;AAAA,IAClB,CAACC,MAAyB;AACtB,UAAI,CAACN,KAAiB,CAAC,CAAC,OAAO,aAAa,WAAW,QAAQ,EAAE,SAASM,EAAM,GAAG;AAC/E;AAGJ,YAAMC,IAAQD,EAAM,QAAQ,SAAS,CAACA,EAAM,UACtCE,IAAaF,EAAM,QAAQ,SAASA,EAAM,UAC1CG,IAAQH,EAAM,QAAQ,UACtBI,IAAiBH,KAASD,EAAM,QAAQ,aACxCK,IAAeH,KAAcF,EAAM,QAAQ;AAEjD,UACKE,KAAcX,KAAoB,KAClCU,KAASV,KAAoBG,EAAc,SAAS,KACrDS,GACF;AACE,QAAAN,EAAgC,YAAY;AAC5C;AAAA,MACJ;AAEA,MAAIO,IACAZ,EAAoB,KAAK,IAAID,IAAmB,GAAGG,EAAc,SAAS,CAAC,CAAC,IACrEW,KACPb,EAAoB,KAAK,IAAID,IAAmB,GAAG,CAAC,CAAC,GAGzDS,EAAM,eAAA;AAAA,IACV;AAAA,IACA,CAACN,GAAeH,CAAgB;AAAA,EAAA;AAGpC,SAAAe,EAAU,MAAM;AACZ,QAAI,CAAClB,KAAgB,CAACC;AAClB;AAGJ,UAAMkB,IAAiBlB,EAAiB,iBAAiBC,CAAyB;AAClF,eAAWkB,KAAQD;AACd,MAAAC,EAA+C,YAAYV;AAGhE,IAAI,CAACJ,KAAiBa,EAAe,SAAS,KAE1CZ,EAAiBY,CAAc;AAAA,EAEvC,GAAG,CAACnB,GAAcC,GAAkBK,GAAeI,GAAeR,CAAyB,CAAC,GAE5FgB,EAAU,MAAM;AACZ,IAAKZ,KAIDA,EAAcH,CAAgB,KAC7BG,EAAcH,CAAgB,EAA4C,MAAA;AAAA,EAEnF,GAAG,CAACA,GAAkBG,CAAa,CAAC,GAEpCY,EAAU,MAAM;AACZ,IAAKlB,MAEDO,EAAiB,MAAS,GAC1BE,EAAgC,EAAE,IAGtCL,EAAoB,CAAC;AAAA,EACzB,GAAG,CAACJ,CAAY,CAAC,GAEVQ;AACX;"}

package/dist/components/MenuItem/MenuItem.es.js

@@ -1,147 +0,0 @@
-import { jsx as t, jsxs as p, Fragment as k } from "react/jsx-runtime";
-import { IconCheckMark as H, IconCaretRight as W } from "@frontify/fondue-icons";
-import { useFocusRing as z } from "@react-aria/focus";
-import { MenuItemContent as O } from "./MenuItemContent.es.js";
-import { getItemElementType as V } from "../../utilities/elements.es.js";
-import { FOCUS_STYLE_NO_OFFSET as D } from "../../utilities/focusStyle.es.js";
-import { merge as r } from "../../utilities/merge.es.js";
-import { MenuItemContentSize as n, SelectionIndicatorIcon as i, MenuItemStyle as e } from "./types.es.js";
-const X = {
-  [n.XSmall]: "tw-px-5 tw-py-2 tw-min-h-[36px]",
-  [n.Small]: "tw-px-5 tw-py-2.5 tw-min-h-[36px]",
-  [n.Large]: "tw-px-5 tw-py-3 tw-min-h-[60px]"
-}, $ = {
-  [e.Primary]: {
-    Default: "tw-text-text-x-weak",
-    Active: "tw-text-text",
-    Disabled: "tw-text-text-disabled"
-  },
-  [e.Danger]: {
-    Default: "tw-text-red-60",
-    Active: "tw-text-red-70",
-    Disabled: "tw-text-text-disabled"
-  },
-  [e.Warning]: {
-    Default: "tw-text-text-warning",
-    Active: "tw-text-yellow-90",
-    Disabled: "tw-text-text-disabled"
-  }
-}, K = {
-  [e.Primary]: "hover:tw-text-text",
-  [e.Danger]: "hover:tw-text-text-negative",
-  [e.Warning]: "hover:tw-text-text-warning"
-}, _ = "tw-cursor-pointer tw-flex tw-items-center tw-justify-between tw-transition-colors tw-gap-2", U = "hover:tw-bg-box-neutral-hover hover:tw-text-box-neutral-inverse-hover", d = r(["tw-w-full tw-text-left tw-py-2 tw-px-5 tw-rounded", U]), Y = "tw-bg-box-selected", q = ({
-  title: A,
-  decorator: N,
-  switchComponent: R,
-  subtitle: M,
-  size: o = n.Small,
-  style: u = e.Primary,
-  disabled: m = !1,
-  active: s = !1,
-  checked: T = !1,
-  selectionIndicator: F = i.Check,
-  children: a,
-  link: S,
-  onBlur: f,
-  onClick: l,
-  onFocus: g,
-  onMouseEnter: b,
-  onMouseOut: I,
-  onMouseOver: h,
-  onMouseLeave: C,
-  "data-test-id": w = "menu-item",
-  type: L
-}) => {
-  const E = o === n.XSmall ? 16 : 20, P = {
-    [i.CaretRight]: /* @__PURE__ */ t(W, { "data-test-id": `${w}-caret`, size: E }),
-    [i.Check]: s && /* @__PURE__ */ t(H, { "data-test-id": `${w}-active`, size: E }),
-    [i.None]: null
-  }[F], { isFocusVisible: v, focusProps: y } = z();
-  let x = "Default";
-  m ? x = "Disabled" : s && (x = "Active");
-  const j = $[u][x], c = V(S, l);
-  return /* @__PURE__ */ p(k, { children: [
-    a ? /* @__PURE__ */ p(
-      "li",
-      {
-        "data-test-id": w,
-        "data-type": L,
-        role: "menuitem",
-        className: r([
-          "tw-text-sm tw-leading-4 tw-text-text-weak",
-          _,
-          T ? Y : ""
-        ]),
-        children: [
-          c === "a" && /* @__PURE__ */ t(
-            "a",
-            {
-              href: S,
-              className: r([d, v && D]),
-              onBlur: f,
-              onClick: l,
-              onFocus: g,
-              onMouseEnter: b,
-              onMouseLeave: C,
-              onMouseOut: I,
-              onMouseOver: h,
-              ...y,
-              children: a
-            }
-          ),
-          c === "button" && /* @__PURE__ */ t(
-            "button",
-            {
-              type: "button",
-              disabled: m,
-              className: r([d, v && D]),
-              onBlur: f,
-              onClick: l,
-              onFocus: g,
-              onMouseEnter: b,
-              onMouseLeave: C,
-              onMouseOut: I,
-              onMouseOver: h,
-              ...y,
-              children: a
-            }
-          ),
-          c === "span" && /* @__PURE__ */ t("span", { className: d, children: a })
-        ]
-      }
-    ) : null,
-    !a && /* @__PURE__ */ p(
-      "div",
-      {
-        className: r([
-          _,
-          K[u],
-          X[o],
-          m && "tw-bg-box-disabled tw-pointer-events-none",
-          s && "tw-font-medium",
-          j
-        ]),
-        children: [
-          /* @__PURE__ */ t(
-            O,
-            {
-              title: A,
-              decorator: N,
-              subtitle: o === n.Large ? M : void 0,
-              size: o,
-              switchComponent: R
-            }
-          ),
-          /* @__PURE__ */ t("div", { className: "tw-flex-none", children: P })
-        ]
-      }
-    )
-  ] });
-};
-q.displayName = "FondueMenuItem";
-export {
-  q as MenuItem,
-  $ as menuItemTextColorRecord
-};
-//# sourceMappingURL=MenuItem.es.js.map