@oracle/oraclejet-preact 18.0.10 → 18.0.12

package/cjs/IconButton-6f58deac.js

@@ -0,0 +1,39 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var preact = require('preact');
+var BaseButton = require('./BaseButton-6b9f7463.js');
+var ButtonLabelLayout = require('./ButtonLabelLayout-90b298fd.js');
+var compat = require('preact/compat');
+var useTooltip = require('./useTooltip-81b7b753.js');
+require('preact/hooks');
+var mergeProps = require('./mergeProps-e3da7237.js');
+require('./logger-2b636482.js');
+require('./LayerHost-a8c7f182.js');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+var buttonUtils = require('./buttonUtils-1f339a8e.js');
+
+/**
+ * Icon buttons are buttons that only show an icon and no label. They direct users to initiate or take actions and work with a single tap, click, or keystroke.
+ */
+const IconButton = compat.forwardRef(({ variant = 'outlined', isDisabled = false, isRepeat = false, size = 'md', type: buttonType = 'button', autofocus, onAction, width, tooltip, testId, 'aria-haspopup': ariaHasPopup, 'aria-label': accessibleLabel, 'aria-describedby': ariaDescribedBy, ...props }, ref) => {
+    const { globalEventProps } = buttonUtils.processGlobals(props);
+    const { tooltipContent, tooltipProps } = useTooltip.useTooltip({
+        text: tooltip ? tooltip : accessibleLabel,
+        isDisabled
+    });
+    const elementDetails = {
+        type: 'button',
+        buttonType: buttonType
+    };
+    const ariaProps = ariaDescribedBy ? { 'aria-describedby': ariaDescribedBy } : {};
+    return (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(BaseButton.BaseButton, { ...mergeProps.mergeProps(tooltipProps, globalEventProps, ariaProps), ref: ref, elementDetails: elementDetails, isDisabled: isDisabled, isRepeat: isRepeat, size: size, autofocus: autofocus, variant: variant, width: width, styling: ['min'], onAction: onAction, "aria-label": accessibleLabel ?? tooltip, "aria-haspopup": ariaHasPopup, testId: testId, children: jsxRuntime.jsx(ButtonLabelLayout.ButtonLabelLayout, { display: 'icons', startIcon: props.children, size: size }) }), tooltipContent] }));
+});
+IconButton.displayName = 'IconButton';
+
+exports.IconButton = IconButton;
+//# sourceMappingURL=IconButton-6f58deac.js.map

package/cjs/IconButton-6f58deac.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconButton-6f58deac.js","sources":["../../src/UNSAFE_IconButton/IconButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChild, ComponentProps, Fragment, Ref } from 'preact';\nimport { BaseButton } from '../UNSAFE_BaseButton';\nimport { ButtonLabelLayout } from '../UNSAFE_ButtonLabelLayout';\nimport { forwardRef } from 'preact/compat';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { useTooltip } from '../hooks/UNSAFE_useTooltip';\nimport { TestIdProps } from '../hooks/UNSAFE_useTestId';\nimport type { ButtonIntrinsicProps } from '../utils/UNSAFE_buttonUtils';\nimport { processGlobals } from '../utils/UNSAFE_buttonUtils';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\n\ntype IntrinsicProps = Pick<HTMLAttributesSignalExcluded<HTMLButtonElement>, 'autofocus'>;\ntype WidthInterpolationProps = Pick<DimensionProps, 'width'>;\ntype BaseButtonProps = ComponentProps<typeof BaseButton>;\n\ntype BaseProps = IntrinsicProps &\n  ButtonIntrinsicProps &\n  Pick<BaseButtonProps, 'aria-haspopup'> &\n  WidthInterpolationProps & {\n    /**\n     * Specifies the icon for the button.\n     */\n    children?: ComponentChild;\n\n    /**\n     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * Specifies if repeated events are dispatched for key or pointer held down\n     */\n    isRepeat?: boolean;\n\n    /**\n     * Specifes the button type\n     */\n    type?: 'button' | 'submit';\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the button.\n     */\n    'aria-describedby'?: string;\n\n    /**\n     * Triggered when a button is clicked, whether by keyboard, mouse, or touch events.\n     */\n    onAction?: () => void | null;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"ghost\": \"Ghost buttons are the least prominent variant. Ghost buttons are\n     * useful for performing low-priority tasks, such as manipulating the UI.\",\n     *     \"borderless\"': \"Borderless buttons are a more prominent variant. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n     *  most important actions in the UI.\",\n     *     \"callToAction\"': \"A Call To Action (CTA) button guides the user to take or\n     * complete the action that is the main goal of the page or page section. There\n     * should only be one CTA button on a page at any given time.\",\n     *     \"danger\"': \"A Danger button alerts the user to a dangerous situation.\"\n     */\n    variant?: 'ghost' | 'borderless' | 'outlined' | 'solid' | 'callToAction' | 'danger';\n    /**\n     * The size indicates how large the button is rendered.\n     */\n    size?: 'xs' | 'sm' | 'md' | 'lg';\n  };\n\n/**\n * Note that either an aria-label or tooltip must be specified.\n */\ntype VariationAccessibleLabelProps =\n  | {\n      /**\n       * aria-label - the aria label\n       */\n      'aria-label': string;\n\n      /**\n       * tooltip - overrides the aria-label for the tooltip\n       */\n      tooltip?: string;\n    }\n  | {\n      'aria-label'?: string;\n\n      tooltip: string;\n    };\n/**\n * Icon buttons are buttons that only show an icon and no label. They direct users to initiate or take actions and work with a single tap, click, or keystroke.\n */\nexport const IconButton = forwardRef(\n  (\n    {\n      variant = 'outlined',\n      isDisabled = false,\n      isRepeat = false,\n      size = 'md',\n      type: buttonType = 'button',\n      autofocus,\n      onAction,\n      width,\n      tooltip,\n      testId,\n      'aria-haspopup': ariaHasPopup,\n      'aria-label': accessibleLabel,\n      'aria-describedby': ariaDescribedBy,\n      ...props\n    }: BaseProps & VariationAccessibleLabelProps & TestIdProps,\n    ref?: Ref<HTMLButtonElement>\n  ) => {\n    const { globalEventProps } = processGlobals(props);\n\n    const { tooltipContent, tooltipProps } = useTooltip({\n      text: tooltip ? tooltip : accessibleLabel,\n      isDisabled\n    });\n\n    const elementDetails = {\n      type: 'button' as const,\n      buttonType: buttonType\n    };\n\n    const ariaProps = ariaDescribedBy ? { 'aria-describedby': ariaDescribedBy } : {};\n\n    return (\n      <Fragment>\n        <BaseButton\n          {...mergeProps(tooltipProps, globalEventProps, ariaProps)}\n          ref={ref as Ref<HTMLButtonElement> & Ref<HTMLAnchorElement> & Ref<HTMLSpanElement>}\n          elementDetails={elementDetails}\n          isDisabled={isDisabled}\n          isRepeat={isRepeat}\n          size={size}\n          autofocus={autofocus}\n          variant={variant}\n          width={width}\n          styling={['min']}\n          onAction={onAction}\n          aria-label={accessibleLabel ?? tooltip}\n          aria-haspopup={ariaHasPopup}\n          testId={testId}>\n          <ButtonLabelLayout\n            display={'icons'}\n            startIcon={props.children}\n            size={size}></ButtonLabelLayout>\n        </BaseButton>\n        {tooltipContent}\n      </Fragment>\n    );\n  }\n);\n\nIconButton.displayName = 'IconButton';\n"],"names":["forwardRef","processGlobals","useTooltip","_jsxs","Fragment","_jsx","BaseButton","mergeProps","ButtonLabelLayout"],"mappings":";;;;;;;;;;;;;;;;;;;AAoGA;;AAEG;AACU,MAAA,UAAU,GAAGA,iBAAU,CAClC,CACE,EACE,OAAO,GAAG,UAAU,EACpB,UAAU,GAAG,KAAK,EAClB,QAAQ,GAAG,KAAK,EAChB,IAAI,GAAG,IAAI,EACX,IAAI,EAAE,UAAU,GAAG,QAAQ,EAC3B,SAAS,EACT,QAAQ,EACR,KAAK,EACL,OAAO,EACP,MAAM,EACN,eAAe,EAAE,YAAY,EAC7B,YAAY,EAAE,eAAe,EAC7B,kBAAkB,EAAE,eAAe,EACnC,GAAG,KAAK,EACgD,EAC1D,GAA4B,KAC1B;IACF,MAAM,EAAE,gBAAgB,EAAE,GAAGC,0BAAc,CAAC,KAAK,CAAC,CAAC;AAEnD,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAGC,qBAAU,CAAC;QAClD,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,eAAe;QACzC,UAAU;AACX,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,cAAc,GAAG;AACrB,QAAA,IAAI,EAAE,QAAiB;AACvB,QAAA,UAAU,EAAE,UAAU;KACvB,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG,eAAe,GAAG,EAAE,kBAAkB,EAAE,eAAe,EAAE,GAAG,EAAE,CAAC;AAEjF,IAAA,QACEC,eAAC,CAAAC,eAAQ,eACPC,cAAC,CAAAC,qBAAU,OACLC,qBAAU,CAAC,YAAY,EAAE,gBAAgB,EAAE,SAAS,CAAC,EACzD,GAAG,EAAE,GAA6E,EAClF,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,QAAQ,EAAE,QAAQ,EAClB,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,CAAC,KAAK,CAAC,EAChB,QAAQ,EAAE,QAAQ,EACN,YAAA,EAAA,eAAe,IAAI,OAAO,EAAA,eAAA,EACvB,YAAY,EAC3B,MAAM,EAAE,MAAM,EAAA,QAAA,EACdF,eAACG,mCAAiB,EAAA,EAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,KAAK,CAAC,QAAQ,EACzB,IAAI,EAAE,IAAI,EAAsB,CAAA,EAAA,CACvB,EACZ,cAAc,CAAA,EAAA,CACN,EACX;AACJ,CAAC,EACD;AAEF,UAAU,CAAC,WAAW,GAAG,YAAY;;;;"}

package/cjs/IconMenuButton-384f41be.js

@@ -0,0 +1,58 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var ButtonLabelLayout = require('./ButtonLabelLayout-90b298fd.js');
+var ChevronDown = require('./ChevronDown-9d92edda.js');
+var Menu = require('./Menu-658212ed.js');
+require('./MenuItem-c459d748.js');
+var hooks = require('preact/hooks');
+var preact = require('preact');
+var useTooltip = require('./useTooltip-81b7b753.js');
+var mergeProps = require('./mergeProps-e3da7237.js');
+require('./logger-2b636482.js');
+require('./LayerHost-a8c7f182.js');
+var compat = require('preact/compat');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+
+require('./SelectMenuGroupContext-bbb4f7e0.js');
+require('./UNSAFE_Separator/themes/SeparatorStyles.css.js');
+
+
+require('./UNSAFE_Menu/themes/redwood/MenuSeparatorVariants.css.js');
+var useMenuAction = require('./useMenuAction-191c66a9.js');
+var BaseButton = require('./BaseButton-6b9f7463.js');
+
+/**
+ * A IconMenuButton is a combined action and menu button.
+ */
+const IconMenuButton = compat.forwardRef(({ children, tooltip, accessibleLabel, variant = 'outlined', isDisabled = false, isMenuOpen = false, isIconOnly = false, onToggleMenu, size = 'md', type: buttonType = 'button', testId, width, icon, 'aria-describedby': ariaDescribedBy }, ref) => {
+    const buttonRef = hooks.useRef(null);
+    hooks.useImperativeHandle(ref, () => buttonRef.current, [buttonRef]);
+    const { triggerProps, menuProps } = useMenuAction.useMenuAction({
+        isDisabled: isDisabled,
+        onToggleMenu: onToggleMenu,
+        isMenuOpen: isMenuOpen,
+        anchorRef: buttonRef
+    });
+    const { tooltipContent, tooltipProps } = useTooltip.useTooltip({
+        text: tooltip ? tooltip : accessibleLabel,
+        isDisabled: isMenuOpen || isDisabled
+    });
+    const elementDetails = {
+        type: 'button',
+        buttonType: buttonType
+    };
+    const ariaProps = { 'aria-describedby': ariaDescribedBy };
+    const rootButton = (jsxRuntime.jsx(preact.Fragment, { children: jsxRuntime.jsxs(BaseButton.BaseButton, { ...mergeProps.mergeProps(tooltipProps, triggerProps, ariaProps), styling: isMenuOpen ? ['min', 'active'] : ['min'], elementDetails: elementDetails, isDisabled: isDisabled, variant: variant, width: width, size: size, ref: buttonRef, "aria-label": accessibleLabel ?? tooltip, testId: testId, children: [jsxRuntime.jsx(ButtonLabelLayout.ButtonLabelLayout, { display: 'icons', startIcon: icon, endIcon: isIconOnly ? null : jsxRuntime.jsx(ChevronDown.SvgChevronDown, {}), size: size }), tooltipContent] }) }));
+    /*TODO: Remove this hardcoded offsetValue so we have dropdown offset only set on one single place.
+     Could be done via menu props or having a dropdownMenu component. JET-60595*/
+    return isDisabled ? (rootButton) : (jsxRuntime.jsxs(preact.Fragment, { children: [rootButton, jsxRuntime.jsx(Menu.Menu, { ...menuProps, offsetValue: 4, "aria-label": accessibleLabel ?? tooltip, children: children })] }));
+});
+IconMenuButton.displayName = 'IconMenuButton';
+
+exports.IconMenuButton = IconMenuButton;
+//# sourceMappingURL=IconMenuButton-384f41be.js.map

package/cjs/IconMenuButton-384f41be.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconMenuButton-384f41be.js","sources":["../../src/UNSAFE_IconMenuButton/IconMenuButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ButtonLabelLayout } from '../UNSAFE_ButtonLabelLayout';\n\nimport { MenuButtonDropdownIcon } from '../PRIVATE_ThemedIcons/MenuButtonDropdownIcon';\n\nimport { Menu } from '../UNSAFE_Menu';\nimport { useMenuAction, MenuToggleDetail } from '../hooks/UNSAFE_useMenuAction';\nimport { useTooltip } from '../hooks/UNSAFE_useTooltip';\n\nimport { BaseButton } from '../UNSAFE_BaseButton';\n\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\n\nimport { ComponentChildren, ComponentChild, Fragment } from 'preact';\nimport { forwardRef, ForwardedRef } from 'preact/compat';\nimport { useRef, useImperativeHandle } from 'preact/hooks';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { TestIdProps } from '../hooks/UNSAFE_useTestId';\n\ntype WidthInterpolationProps = Pick<DimensionProps, 'width'>;\n\nexport type BaseProps = WidthInterpolationProps & {\n  /**\n   * children - One or more MenuItems, dividers, or Menu groups\n   */\n  children?: ComponentChildren;\n\n  /**\n   * The icon is the button's icon.  Note that this is not the menu\n   * expand icon shown on the right (or to the left in right to left mode).\n   */\n  icon?: ComponentChild;\n\n  /**\n   * Specifies that the button element should be disabled.\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies if only the icon is shown, and no down chevron.\n   */\n  isIconOnly?: boolean;\n\n  /**\n   * Specifes the button type\n   */\n  type?: 'button' | 'submit';\n\n  /**\n   * The ID of an element (or space separated IDs of multiple elements) that\n   * describes the button.\n   */\n  'aria-describedby'?: string;\n\n  /**\n   * Specifies if the menu is open\n   */\n  isMenuOpen?: boolean;\n\n  /**\n   * Indicates in what states the button has chrome (background and border).\n   *     \"ghost\": \"Ghost buttons are the least prominent variant. Ghost buttons are\n   * useful for performing low-priority tasks, such as manipulating the UI.\",\n   *     \"borderless\"': \"Borderless buttons are a more prominent variant. Borderless\n   * buttons are useful for supplemental actions that require minimal emphasis.\",\n   *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n   * solid buttons. Outlined buttons are useful for secondary actions.\",\n   *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n   *  most important actions in the UI.\",\n   */\n  variant?: 'ghost' | 'borderless' | 'outlined' | 'solid';\n\n  /**\n   * The size indicates how large the button is rendered.\n   */\n  size?: 'xs' | 'sm' | 'md' | 'lg';\n\n  /**\n   * Property that triggers a callback immediately when toggle happens and value of expanded property should be updated\n   */\n  onToggleMenu?: (details: MenuToggleDetail) => void;\n};\n\n/**\n * Note that either an accessibleLabel or tooltip must be specified.\n */\ntype VariationAccessibleLabelProps =\n  | {\n      /**\n       * accessibleLabel - the aria label\n       */\n      accessibleLabel: string;\n\n      /**\n       * tooltip - overrides the accessibleLabel for the tooltip\n       */\n      tooltip?: string;\n    }\n  | {\n      accessibleLabel?: string;\n\n      tooltip: string;\n    };\n\n/**\n * A IconMenuButton is a combined action and menu button.\n */\nexport const IconMenuButton = forwardRef(\n  (\n    {\n      children,\n      tooltip,\n      accessibleLabel,\n      variant = 'outlined',\n      isDisabled = false,\n      isMenuOpen = false,\n      isIconOnly = false,\n      onToggleMenu,\n      size = 'md',\n      type: buttonType = 'button',\n      testId,\n      width,\n      icon,\n      'aria-describedby': ariaDescribedBy\n    }: BaseProps & VariationAccessibleLabelProps & TestIdProps,\n    ref?: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    useImperativeHandle(ref!, () => buttonRef.current!, [buttonRef]);\n\n    const { triggerProps, menuProps } = useMenuAction({\n      isDisabled: isDisabled,\n      onToggleMenu: onToggleMenu,\n      isMenuOpen: isMenuOpen,\n      anchorRef: buttonRef\n    });\n\n    const { tooltipContent, tooltipProps } = useTooltip({\n      text: tooltip ? tooltip : accessibleLabel,\n      isDisabled: isMenuOpen || isDisabled\n    });\n\n    const elementDetails = {\n      type: 'button' as const,\n      buttonType: buttonType\n    };\n\n    const ariaProps = { 'aria-describedby': ariaDescribedBy };\n\n    const rootButton = (\n      <Fragment>\n        <BaseButton\n          {...mergeProps(tooltipProps, triggerProps, ariaProps)}\n          styling={isMenuOpen ? ['min', 'active'] : ['min']}\n          elementDetails={elementDetails}\n          isDisabled={isDisabled}\n          variant={variant}\n          width={width}\n          size={size}\n          ref={buttonRef}\n          aria-label={accessibleLabel ?? tooltip}\n          testId={testId}>\n          <ButtonLabelLayout\n            display={'icons'}\n            startIcon={icon}\n            endIcon={isIconOnly ? null : <MenuButtonDropdownIcon />}\n            size={size}></ButtonLabelLayout>\n          {tooltipContent}\n        </BaseButton>\n      </Fragment>\n    );\n\n    /*TODO: Remove this hardcoded offsetValue so we have dropdown offset only set on one single place.\n     Could be done via menu props or having a dropdownMenu component. JET-60595*/\n    return isDisabled ? (\n      rootButton\n    ) : (\n      <Fragment>\n        {rootButton}\n        <Menu {...menuProps} offsetValue={4} aria-label={accessibleLabel ?? tooltip}>\n          {children}\n        </Menu>\n      </Fragment>\n    );\n  }\n);\n\nIconMenuButton.displayName = 'IconMenuButton';\n"],"names":["forwardRef","useRef","useImperativeHandle","useMenuAction","useTooltip","_jsx","Fragment","_jsxs","BaseButton","mergeProps","ButtonLabelLayout","MenuButtonDropdownIcon","Menu"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8GA;;AAEG;AACU,MAAA,cAAc,GAAGA,iBAAU,CACtC,CACE,EACE,QAAQ,EACR,OAAO,EACP,eAAe,EACf,OAAO,GAAG,UAAU,EACpB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,YAAY,EACZ,IAAI,GAAG,IAAI,EACX,IAAI,EAAE,UAAU,GAAG,QAAQ,EAC3B,MAAM,EACN,KAAK,EACL,IAAI,EACJ,kBAAkB,EAAE,eAAe,EACqB,EAC1D,GAAqC,KACnC;AACF,IAAA,MAAM,SAAS,GAAGC,YAAM,CAAoB,IAAI,CAAC,CAAC;AAClD,IAAAC,yBAAmB,CAAC,GAAI,EAAE,MAAM,SAAS,CAAC,OAAQ,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEjE,IAAA,MAAM,EAAE,YAAY,EAAE,SAAS,EAAE,GAAGC,2BAAa,CAAC;AAChD,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,YAAY,EAAE,YAAY;AAC1B,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,SAAS,EAAE,SAAS;AACrB,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAGC,qBAAU,CAAC;QAClD,IAAI,EAAE,OAAO,GAAG,OAAO,GAAG,eAAe;QACzC,UAAU,EAAE,UAAU,IAAI,UAAU;AACrC,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,cAAc,GAAG;AACrB,QAAA,IAAI,EAAE,QAAiB;AACvB,QAAA,UAAU,EAAE,UAAU;KACvB,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG,EAAE,kBAAkB,EAAE,eAAe,EAAE,CAAC;IAE1D,MAAM,UAAU,IACdC,cAAA,CAACC,eAAQ,EACP,EAAA,QAAA,EAAAC,eAAA,CAACC,qBAAU,EAAA,EAAA,GACLC,qBAAU,CAAC,YAAY,EAAE,YAAY,EAAE,SAAS,CAAC,EACrD,OAAO,EAAE,UAAU,GAAG,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,EACjD,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,SAAS,EAAA,YAAA,EACF,eAAe,IAAI,OAAO,EACtC,MAAM,EAAE,MAAM,aACdJ,cAAC,CAAAK,mCAAiB,IAChB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,IAAI,EACf,OAAO,EAAE,UAAU,GAAG,IAAI,GAAGL,cAAA,CAACM,0BAAsB,EAAG,EAAA,CAAA,EACvD,IAAI,EAAE,IAAI,EAAA,CAAsB,EACjC,cAAc,CAAA,EAAA,CACJ,EACJ,CAAA,CACZ,CAAC;AAEF;AAC6E;AAC7E,IAAA,OAAO,UAAU,IACf,UAAU,KAEVJ,eAAC,CAAAD,eAAQ,eACN,UAAU,EACXD,cAAC,CAAAO,SAAI,EAAK,EAAA,GAAA,SAAS,EAAE,WAAW,EAAE,CAAC,EAAA,YAAA,EAAc,eAAe,IAAI,OAAO,EACxE,QAAA,EAAA,QAAQ,EACJ,CAAA,CAAA,EAAA,CACE,CACZ,CAAC;AACJ,CAAC,EACD;AAEF,cAAc,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/cjs/IconProgressButton-649a5b5b.js

@@ -0,0 +1,49 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var preact = require('preact');
+var BaseButton = require('./BaseButton-6b9f7463.js');
+var ProgressButtonLabelLayout = require('./ProgressButtonLabelLayout-13908869.js');
+var compat = require('preact/compat');
+var useTooltip = require('./useTooltip-81b7b753.js');
+require('preact/hooks');
+var mergeProps = require('./mergeProps-e3da7237.js');
+require('./logger-2b636482.js');
+require('./LayerHost-a8c7f182.js');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+var buttonUtils = require('./buttonUtils-1f339a8e.js');
+var resources_nls_en_bundle = require('./resources/nls/en/bundle.js');
+
+/**
+ * An Icon Progress button is an icon push button that can show progress.
+ */
+const IconProgressButton = compat.forwardRef(({ variant = 'outlined', isLoading = false, isDisabled = false, size = 'md', type: buttonType = 'button', onAction, width, tooltip, testId, ...props }, ref) => {
+    const { globalEventProps } = buttonUtils.processGlobals(props);
+    const isAdjustedLoading = isDisabled ? false : isLoading;
+    const progressStatus = resources_nls_en_bundle["default"].accButtonProgressStatus({
+        label: tooltip
+    });
+    const progressComplete = resources_nls_en_bundle["default"].accButtonProgressComplete({
+        label: tooltip
+    });
+    const elementDetails = {
+        type: 'button',
+        buttonType: buttonType
+    };
+    const tooltipLabel = tooltip;
+    const { tooltipContent, tooltipProps } = useTooltip.useTooltip({
+        text: tooltipLabel,
+        isDisabled
+    });
+    /* For a11y, we use ignore aria-label during loading time */
+    const { 'aria-describedby': adb, ...ttProps } = tooltipProps;
+    return (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(BaseButton.BaseButton, { ...mergeProps.mergeProps(ttProps, globalEventProps), ref: ref, elementDetails: elementDetails, isReadOnly: isAdjustedLoading, isDisabled: isDisabled, size: size, variant: variant, width: width, styling: isAdjustedLoading ? ['min', 'hiddenLabel', 'noHoverActive'] : ['min'], onAction: onAction, "aria-label": tooltip, testId: testId, children: jsxRuntime.jsx(ProgressButtonLabelLayout.ProgressButtonLabelLayout, { display: 'icons', isLoading: isAdjustedLoading, accessibleLoadedLabel: progressComplete, accessibleLoadingLabel: progressStatus, isLoadingContrast: variant === 'callToAction', startIcon: props.children, size: size }) }), tooltipContent] }));
+});
+IconProgressButton.displayName = 'IconProgressButton';
+
+exports.IconProgressButton = IconProgressButton;
+//# sourceMappingURL=IconProgressButton-649a5b5b.js.map

package/cjs/IconProgressButton-649a5b5b.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconProgressButton-649a5b5b.js","sources":["../../src/UNSAFE_IconProgressButton/IconProgressButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChild, Fragment, Ref } from 'preact';\nimport { BaseButton } from '../UNSAFE_BaseButton';\nimport { ProgressButtonLabelLayout } from '../UNSAFE_ProgressButtonLabelLayout';\nimport { forwardRef } from 'preact/compat';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { useTooltip } from '../hooks/UNSAFE_useTooltip';\nimport { TestIdProps } from '../hooks/UNSAFE_useTestId';\nimport type { ButtonIntrinsicProps } from '../utils/UNSAFE_buttonUtils';\nimport { processGlobals } from '../utils/UNSAFE_buttonUtils';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport translations from '#resources/nls/en/bundle';\n\ntype WidthInterpolationProps = Pick<DimensionProps, 'width'>;\n\ntype BaseProps = ButtonIntrinsicProps &\n  WidthInterpolationProps &\n  TestIdProps & {\n    /**\n     * Specifies the icon for the button.\n     */\n    children?: ComponentChild;\n\n    /**\n     * Specifies that a quick indeterminate action is taking place, making the button read-only.\n     */\n    isLoading?: boolean;\n\n    /**\n     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * Specifes the button type\n     */\n    type?: 'button' | 'submit';\n\n    /**\n     * Triggered when a button is clicked, whether by keyboard, mouse, or touch events.\n     */\n    onAction?: () => void | null;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"borderless\"': \"Borderless buttons are a more prominent variant. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n     *  most important actions in the UI.\",\n     *     \"callToAction\"': \"A Call To Action (CTA) button guides the user to take or\n     * complete the action that is the main goal of the page or page section. There\n     * should only be one CTA button on a page at any given time.\",\n     */\n    variant?: 'borderless' | 'outlined' | 'solid' | 'callToAction';\n    /**\n     * The size indicates how large the button is rendered.\n     */\n    size?: 'sm' | 'md' | 'lg';\n\n    /**\n     * tooltip - used for tooltip and aria-label\n     */\n    tooltip: string;\n  };\n\n/**\n * An Icon Progress button is an icon push button that can show progress.\n */\nexport const IconProgressButton = forwardRef(\n  (\n    {\n      variant = 'outlined',\n      isLoading = false,\n      isDisabled = false,\n      size = 'md',\n      type: buttonType = 'button',\n      onAction,\n      width,\n      tooltip,\n      testId,\n      ...props\n    }: BaseProps & TestIdProps,\n    ref?: Ref<HTMLButtonElement>\n  ) => {\n    const { globalEventProps } = processGlobals(props);\n    const isAdjustedLoading = isDisabled ? false : isLoading;\n    const progressStatus = translations.accButtonProgressStatus({\n      label: tooltip\n    });\n    const progressComplete = translations.accButtonProgressComplete({\n      label: tooltip\n    });\n\n    const elementDetails = {\n      type: 'button' as const,\n      buttonType: buttonType\n    };\n\n    const tooltipLabel = tooltip;\n\n    const { tooltipContent, tooltipProps } = useTooltip({\n      text: tooltipLabel,\n      isDisabled\n    });\n\n    /* For a11y, we use ignore aria-label during loading time */\n    const { 'aria-describedby': adb, ...ttProps } = tooltipProps;\n\n    return (\n      <Fragment>\n        <BaseButton\n          {...mergeProps(ttProps, globalEventProps)}\n          ref={ref as Ref<HTMLButtonElement> & Ref<HTMLAnchorElement> & Ref<HTMLSpanElement>}\n          elementDetails={elementDetails}\n          isReadOnly={isAdjustedLoading}\n          isDisabled={isDisabled}\n          size={size}\n          variant={variant}\n          width={width}\n          styling={isAdjustedLoading ? ['min', 'hiddenLabel', 'noHoverActive'] : ['min']}\n          onAction={onAction}\n          aria-label={tooltip}\n          testId={testId}>\n          <ProgressButtonLabelLayout\n            display={'icons'}\n            isLoading={isAdjustedLoading}\n            accessibleLoadedLabel={progressComplete}\n            accessibleLoadingLabel={progressStatus}\n            isLoadingContrast={variant === 'callToAction'}\n            startIcon={props.children}\n            size={size}></ProgressButtonLabelLayout>\n        </BaseButton>\n        {tooltipContent}\n      </Fragment>\n    );\n  }\n);\n\nIconProgressButton.displayName = 'IconProgressButton';\n"],"names":["forwardRef","processGlobals","translations","useTooltip","_jsxs","Fragment","_jsx","BaseButton","mergeProps","ProgressButtonLabelLayout"],"mappings":";;;;;;;;;;;;;;;;;;;;AAyEA;;AAEG;MACU,kBAAkB,GAAGA,iBAAU,CAC1C,CACE,EACE,OAAO,GAAG,UAAU,EACpB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,IAAI,GAAG,IAAI,EACX,IAAI,EAAE,UAAU,GAAG,QAAQ,EAC3B,QAAQ,EACR,KAAK,EACL,OAAO,EACP,MAAM,EACN,GAAG,KAAK,EACgB,EAC1B,GAA4B,KAC1B;IACF,MAAM,EAAE,gBAAgB,EAAE,GAAGC,0BAAc,CAAC,KAAK,CAAC,CAAC;IACnD,MAAM,iBAAiB,GAAG,UAAU,GAAG,KAAK,GAAG,SAAS,CAAC;AACzD,IAAA,MAAM,cAAc,GAAGC,kCAAY,CAAC,uBAAuB,CAAC;AAC1D,QAAA,KAAK,EAAE,OAAO;AACf,KAAA,CAAC,CAAC;AACH,IAAA,MAAM,gBAAgB,GAAGA,kCAAY,CAAC,yBAAyB,CAAC;AAC9D,QAAA,KAAK,EAAE,OAAO;AACf,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,cAAc,GAAG;AACrB,QAAA,IAAI,EAAE,QAAiB;AACvB,QAAA,UAAU,EAAE,UAAU;KACvB,CAAC;IAEF,MAAM,YAAY,GAAG,OAAO,CAAC;AAE7B,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAGC,qBAAU,CAAC;AAClD,QAAA,IAAI,EAAE,YAAY;QAClB,UAAU;AACX,KAAA,CAAC,CAAC;;IAGH,MAAM,EAAE,kBAAkB,EAAE,GAAG,EAAE,GAAG,OAAO,EAAE,GAAG,YAAY,CAAC;IAE7D,QACEC,eAAC,CAAAC,eAAQ,EACP,EAAA,QAAA,EAAA,CAAAC,cAAA,CAACC,qBAAU,EACL,EAAA,GAAAC,qBAAU,CAAC,OAAO,EAAE,gBAAgB,CAAC,EACzC,GAAG,EAAE,GAA6E,EAClF,cAAc,EAAE,cAAc,EAC9B,UAAU,EAAE,iBAAiB,EAC7B,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,iBAAiB,GAAG,CAAC,KAAK,EAAE,aAAa,EAAE,eAAe,CAAC,GAAG,CAAC,KAAK,CAAC,EAC9E,QAAQ,EAAE,QAAQ,EAAA,YAAA,EACN,OAAO,EACnB,MAAM,EAAE,MAAM,EACd,QAAA,EAAAF,cAAA,CAACG,mDAAyB,EAAA,EACxB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,iBAAiB,EAC5B,qBAAqB,EAAE,gBAAgB,EACvC,sBAAsB,EAAE,cAAc,EACtC,iBAAiB,EAAE,OAAO,KAAK,cAAc,EAC7C,SAAS,EAAE,KAAK,CAAC,QAAQ,EACzB,IAAI,EAAE,IAAI,EAA8B,CAAA,EAAA,CAC/B,EACZ,cAAc,CACN,EAAA,CAAA,EACX;AACJ,CAAC,EACD;AAEF,kBAAkB,CAAC,WAAW,GAAG,oBAAoB;;;;"}

package/cjs/IconSwitchButton-cd968a81.js

@@ -0,0 +1,46 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var preact = require('preact');
+var compat = require('preact/compat');
+var hooks = require('preact/hooks');
+var BaseButton = require('./BaseButton-6b9f7463.js');
+var useToggleAction = require('./useToggleAction-e4f15550.js');
+var useTooltip = require('./useTooltip-81b7b753.js');
+var useId = require('./useId-6c0eeb27.js');
+var mergeProps = require('./mergeProps-e3da7237.js');
+require('./logger-2b636482.js');
+require('./LayerHost-a8c7f182.js');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+var toggleButtonUtils = require('./toggleButtonUtils-16aa521b.js');
+var ToggleButtonLabel = require('./ToggleButtonLabel-3a532315.js');
+
+/**
+ * A IconSwitchButton is an icon button that allows users to switch
+ * between states when pressed.  It differs from a toggle button in not
+ * providing any visual indication of the state; instead, switch the
+ * icon to provide the state indication.
+ */
+const IconSwitchButton = compat.forwardRef(({ children, tooltip, size = 'md', isDisabled = false, accessibleLabel, isSelected = false, onToggle, testId, width, 'aria-describedby': ariaDescribedBy }, ref) => {
+    const buttonRef = hooks.useRef(null);
+    hooks.useImperativeHandle(ref, () => buttonRef.current, [buttonRef]);
+    const { triggerProps } = useToggleAction.useToggleAction({
+        isDisabled: isDisabled,
+        onToggle: onToggle
+    });
+    const { tooltipContent, tooltipProps } = useTooltip.useTooltip({
+        text: tooltip ?? accessibleLabel,
+        isDisabled: isDisabled
+    });
+    const styling = toggleButtonUtils.toggleStyling('auto', isSelected, true, false, false, undefined, undefined, true);
+    const ariaProps = { 'aria-describedby': ariaDescribedBy };
+    return (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(BaseButton.BaseButton, { ...mergeProps.mergeProps(tooltipProps, triggerProps, ariaProps), elementDetails: { type: 'button', isSwitch: true }, "aria-checked": isSelected, variant: "ghost", size: size, isDisabled: isDisabled, styling: styling, width: width, ref: buttonRef, "aria-label": accessibleLabel ?? tooltip, testId: testId, children: jsxRuntime.jsx(ToggleButtonLabel.ToggleButtonLabel, { isDisabled: isDisabled, label: accessibleLabel ?? tooltip, isToggle: true, inputName: useId.useId(), inputType: 'switch', onAction: () => onToggle?.({ value: isSelected }), isSelected: isSelected, display: 'icons', startIcon: children, size: size }) }), tooltipContent] }));
+});
+IconSwitchButton.displayName = 'IconSwitchButton';
+
+exports.IconSwitchButton = IconSwitchButton;
+//# sourceMappingURL=IconSwitchButton-cd968a81.js.map

package/cjs/IconSwitchButton-cd968a81.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconSwitchButton-cd968a81.js","sources":["../../src/PRIVATE_IconSwitchButton/IconSwitchButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChild, Fragment } from 'preact';\nimport { forwardRef, ForwardedRef } from 'preact/compat';\nimport { useRef, useImperativeHandle } from 'preact/hooks';\n\nimport { BaseButton } from '#UNSAFE_BaseButton';\nimport { useToggleAction, ToggleDetail } from '#hooks/UNSAFE_useToggleAction';\nimport { useTooltip } from '#hooks/UNSAFE_useTooltip';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport type { DimensionProps } from '#utils/UNSAFE_interpolations/dimensions';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\n\nimport { toggleStyling } from '#utils/UNSAFE_buttonUtils';\nimport { useId } from '#hooks/UNSAFE_useId';\nimport { ToggleButtonLabel } from '#UNSAFE_ToggleButtonLabel';\nimport type { ToggleButtonLabelProps } from '#UNSAFE_ToggleButtonLabel/ToggleButtonLabel';\n\ntype WidthInterpolationProps = Pick<DimensionProps, 'width'>;\n\nexport type IconSwitchButtonProps = WidthInterpolationProps &\n  TestIdProps & {\n    /**\n     * icon - the icon for the button\n     */\n    children?: ComponentChild;\n\n    /**\n     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the button.\n     */\n    'aria-describedby'?: string;\n\n    /**\n     * Specifies if the toggle button is selected\n     */\n    isSelected?: boolean;\n\n    /**\n     * Property that triggers a callback immediately when toggle happens and value of isSelected property should be updated\n     */\n    onToggle?: (details: ToggleDetail) => void;\n\n    /**\n     * The size indicates how large the button is rendered: \"xs\", \"sm\", \"md\" (default), \"lg\".\n     */\n    size?: 'xs' | 'sm' | 'md' | 'lg';\n  };\n\n/**\n * Note that either an accessibleLabel or tooltip must be specified.\n */\ntype VariationAccessibleLabelProps =\n  | {\n      /**\n       * accessibleLabel - the aria label\n       */\n      accessibleLabel: string;\n\n      /**\n       * tooltip - overrides the accessibleLabel for the tooltip\n       */\n      tooltip?: string;\n    }\n  | {\n      accessibleLabel?: string;\n\n      tooltip: string;\n    };\n\n/**\n * A IconSwitchButton is an icon button that allows users to switch\n * between states when pressed.  It differs from a toggle button in not\n * providing any visual indication of the state; instead, switch the\n * icon to provide the state indication.\n */\nexport const IconSwitchButton = forwardRef(\n  (\n    {\n      children,\n      tooltip,\n      size = 'md',\n      isDisabled = false,\n      accessibleLabel,\n      isSelected = false,\n      onToggle,\n      testId,\n      width,\n      'aria-describedby': ariaDescribedBy\n    }: IconSwitchButtonProps & VariationAccessibleLabelProps & TestIdProps,\n    ref?: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    useImperativeHandle(ref!, () => buttonRef.current!, [buttonRef]);\n\n    const { triggerProps } = useToggleAction({\n      isDisabled: isDisabled,\n      onToggle: onToggle\n    });\n\n    const { tooltipContent, tooltipProps } = useTooltip({\n      text: tooltip ?? accessibleLabel,\n      isDisabled: isDisabled\n    });\n\n    const styling = toggleStyling(\n      'auto',\n      isSelected,\n      true,\n      false,\n      false,\n      undefined,\n      undefined,\n      true\n    );\n\n    const ariaProps = { 'aria-describedby': ariaDescribedBy };\n\n    return (\n      <Fragment>\n        <BaseButton\n          {...mergeProps(tooltipProps, triggerProps, ariaProps)}\n          elementDetails={{ type: 'button', isSwitch: true }}\n          aria-checked={isSelected}\n          variant=\"ghost\"\n          size={size}\n          isDisabled={isDisabled}\n          styling={styling}\n          width={width}\n          ref={buttonRef}\n          aria-label={accessibleLabel ?? tooltip}\n          testId={testId}>\n          <ToggleButtonLabel\n            isDisabled={isDisabled}\n            label={accessibleLabel ?? tooltip}\n            isToggle={true}\n            inputName={useId()}\n            inputType={'switch'}\n            onAction={() => onToggle?.({ value: isSelected })}\n            isSelected={isSelected}\n            display={'icons'}\n            startIcon={children}\n            size={size as ToggleButtonLabelProps['size']}\n          />\n        </BaseButton>\n        {tooltipContent}\n      </Fragment>\n    );\n  }\n);\n\nIconSwitchButton.displayName = 'IconSwitchButton';\n"],"names":["forwardRef","useRef","useImperativeHandle","useToggleAction","useTooltip","toggleStyling","_jsxs","Fragment","_jsx","BaseButton","mergeProps","ToggleButtonLabel","useId"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAgFA;;;;;AAKG;AACU,MAAA,gBAAgB,GAAGA,iBAAU,CACxC,CACE,EACE,QAAQ,EACR,OAAO,EACP,IAAI,GAAG,IAAI,EACX,UAAU,GAAG,KAAK,EAClB,eAAe,EACf,UAAU,GAAG,KAAK,EAClB,QAAQ,EACR,MAAM,EACN,KAAK,EACL,kBAAkB,EAAE,eAAe,EACiC,EACtE,GAAqC,KACnC;AACF,IAAA,MAAM,SAAS,GAAGC,YAAM,CAAoB,IAAI,CAAC,CAAC;AAClD,IAAAC,yBAAmB,CAAC,GAAI,EAAE,MAAM,SAAS,CAAC,OAAQ,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEjE,IAAA,MAAM,EAAE,YAAY,EAAE,GAAGC,+BAAe,CAAC;AACvC,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAGC,qBAAU,CAAC;QAClD,IAAI,EAAE,OAAO,IAAI,eAAe;AAChC,QAAA,UAAU,EAAE,UAAU;AACvB,KAAA,CAAC,CAAC;IAEH,MAAM,OAAO,GAAGC,+BAAa,CAC3B,MAAM,EACN,UAAU,EACV,IAAI,EACJ,KAAK,EACL,KAAK,EACL,SAAS,EACT,SAAS,EACT,IAAI,CACL,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG,EAAE,kBAAkB,EAAE,eAAe,EAAE,CAAC;AAE1D,IAAA,QACEC,eAAA,CAACC,eAAQ,EAAA,EAAA,QAAA,EAAA,CACPC,cAAC,CAAAC,qBAAU,EACL,EAAA,GAAAC,qBAAU,CAAC,YAAY,EAAE,YAAY,EAAE,SAAS,CAAC,EACrD,cAAc,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,QAAQ,EAAE,IAAI,EAAE,EAAA,cAAA,EACpC,UAAU,EACxB,OAAO,EAAC,OAAO,EACf,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,GAAG,EAAE,SAAS,EAAA,YAAA,EACF,eAAe,IAAI,OAAO,EACtC,MAAM,EAAE,MAAM,EAAA,QAAA,EACdF,cAAC,CAAAG,mCAAiB,EAChB,EAAA,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,eAAe,IAAI,OAAO,EACjC,QAAQ,EAAE,IAAI,EACd,SAAS,EAAEC,WAAK,EAAE,EAClB,SAAS,EAAE,QAAQ,EACnB,QAAQ,EAAE,MAAM,QAAQ,GAAG,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,EACjD,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,QAAQ,EACnB,IAAI,EAAE,IAAsC,EAC5C,CAAA,EAAA,CACS,EACZ,cAAc,CACN,EAAA,CAAA,EACX;AACJ,CAAC,EACD;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;;;;"}

package/cjs/IconToggleButton-c57a8c11.js

@@ -0,0 +1,45 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+var preact = require('preact');
+var compat = require('preact/compat');
+var hooks = require('preact/hooks');
+var BaseButton = require('./BaseButton-6b9f7463.js');
+var useToggleAction = require('./useToggleAction-e4f15550.js');
+var useTooltip = require('./useTooltip-81b7b753.js');
+var mergeProps = require('./mergeProps-e3da7237.js');
+require('./logger-2b636482.js');
+require('./LayerHost-a8c7f182.js');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+var toggleButtonUtils = require('./toggleButtonUtils-16aa521b.js');
+var buttonUtils = require('./buttonUtils-1f339a8e.js');
+var ToggleButtonLabel = require('./ToggleButtonLabel-3a532315.js');
+
+/**
+ * IconToggleButtons direct users to toggle a state with
+ * a single tap, click, or keystroke.
+ */
+const IconToggleButton = compat.forwardRef(({ children, variant = 'outlined', size = 'md', isDisabled = false, tooltip, accessibleLabel, isSelected = false, onToggle, testId, 'aria-describedby': ariaDescribedBy, width, ...props }, ref) => {
+    const { globalEventProps } = buttonUtils.processGlobals(props);
+    const buttonRef = hooks.useRef(null);
+    hooks.useImperativeHandle(ref, () => buttonRef.current, [buttonRef]);
+    const { triggerProps } = useToggleAction.useToggleAction({
+        isDisabled: isDisabled,
+        onToggle: onToggle
+    });
+    const { tooltipContent, tooltipProps } = useTooltip.useTooltip({
+        text: tooltip ?? accessibleLabel,
+        isDisabled: isDisabled
+    });
+    const styling = toggleButtonUtils.toggleStyling('auto', isSelected, false, false, variant === 'outlined', undefined, undefined, true);
+    const ariaProps = { 'aria-describedby': ariaDescribedBy };
+    return (jsxRuntime.jsxs(preact.Fragment, { children: [jsxRuntime.jsx(BaseButton.BaseButton, { ...mergeProps.mergeProps(tooltipProps, triggerProps, globalEventProps, ariaProps), variant: variant, isDisabled: isDisabled, size: size, width: width, "aria-pressed": isSelected, styling: styling, ref: buttonRef, "aria-label": accessibleLabel ?? tooltip, testId: testId, children: jsxRuntime.jsx(ToggleButtonLabel.ToggleButtonLabel, { onAction: () => onToggle?.({ value: isSelected }), isDisabled: isDisabled, display: 'icons', startIcon: children }) }), tooltipContent] }));
+});
+IconToggleButton.displayName = 'IconToggleButton';
+
+exports.IconToggleButton = IconToggleButton;
+//# sourceMappingURL=IconToggleButton-c57a8c11.js.map

package/cjs/IconToggleButton-c57a8c11.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"IconToggleButton-c57a8c11.js","sources":["../../src/UNSAFE_IconToggleButton/IconToggleButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChild, Fragment } from 'preact';\nimport { forwardRef, ForwardedRef } from 'preact/compat';\nimport { useRef, useImperativeHandle } from 'preact/hooks';\n\nimport { BaseButton } from '#UNSAFE_BaseButton';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { useToggleAction, ToggleDetail } from '#hooks/UNSAFE_useToggleAction';\nimport { useTooltip } from '#hooks/UNSAFE_useTooltip';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport { toggleStyling, processGlobals } from '#utils/UNSAFE_buttonUtils';\nimport { ToggleButtonLabel } from '#UNSAFE_ToggleButtonLabel';\nimport type { ButtonIntrinsicProps } from '#utils/UNSAFE_buttonUtils';\n\ntype WidthProps = Pick<DimensionProps, 'width'>;\n\nexport type IconToggleButtonProps = ButtonIntrinsicProps &\n  WidthProps &\n  TestIdProps & {\n    /**\n     * Specifies the icon for the button.   This should not vary depending on state.\n     */\n    children?: ComponentChild;\n\n    /**\n     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the button.\n     */\n    'aria-describedby'?: string;\n\n    /**\n     * Specifies if the toggle button is selected\n     */\n    isSelected?: boolean;\n\n    /**\n     * Property that triggers a callback immediately when toggle happens and value of isSelected property should be updated\n     */\n    onToggle?: (details: ToggleDetail) => void;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"borderless\"': \"Borderless buttons are a more prominent variation. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     */\n    variant?: 'borderless' | 'outlined';\n\n    /**\n     * The size indicates how large the button is rendered: \"sm\", \"md\" (default), \"lg\".\n     */\n    size?: 'sm' | 'md' | 'lg';\n  };\n\n/**\n * Note that either an accessibleLabel or tooltip must be specified.\n */\ntype VariationAccessibleLabelProps =\n  | {\n      /**\n       * accessibleLabel - the aria label\n       */\n      accessibleLabel: string;\n\n      /**\n       * tooltip - overrides the accessibleLabel for the tooltip\n       */\n      tooltip?: string;\n    }\n  | {\n      accessibleLabel?: string;\n\n      tooltip: string;\n    };\n\n/**\n * IconToggleButtons direct users to toggle a state with\n * a single tap, click, or keystroke.\n */\nexport const IconToggleButton = forwardRef(\n  (\n    {\n      children,\n      variant = 'outlined',\n      size = 'md',\n      isDisabled = false,\n      tooltip,\n      accessibleLabel,\n      isSelected = false,\n      onToggle,\n      testId,\n      'aria-describedby': ariaDescribedBy,\n      width,\n      ...props\n    }: IconToggleButtonProps & VariationAccessibleLabelProps & TestIdProps,\n    ref?: ForwardedRef<HTMLButtonElement>\n  ) => {\n    const { globalEventProps } = processGlobals(props);\n\n    const buttonRef = useRef<HTMLButtonElement>(null);\n    useImperativeHandle(ref!, () => buttonRef.current!, [buttonRef]);\n\n    const { triggerProps } = useToggleAction({\n      isDisabled: isDisabled,\n      onToggle: onToggle\n    });\n\n    const { tooltipContent, tooltipProps } = useTooltip({\n      text: tooltip ?? accessibleLabel,\n      isDisabled: isDisabled\n    });\n\n    const styling = toggleStyling(\n      'auto',\n      isSelected,\n      false,\n      false,\n      variant === 'outlined',\n      undefined,\n      undefined,\n      true\n    );\n\n    const ariaProps = { 'aria-describedby': ariaDescribedBy };\n\n    return (\n      <Fragment>\n        <BaseButton\n          {...mergeProps(tooltipProps, triggerProps, globalEventProps, ariaProps)}\n          variant={variant}\n          isDisabled={isDisabled}\n          size={size}\n          width={width}\n          aria-pressed={isSelected}\n          styling={styling}\n          ref={buttonRef}\n          aria-label={accessibleLabel ?? tooltip}\n          testId={testId}>\n          <ToggleButtonLabel\n            onAction={() => onToggle?.({ value: isSelected })}\n            isDisabled={isDisabled}\n            display={'icons'}\n            startIcon={children}></ToggleButtonLabel>\n        </BaseButton>\n        {tooltipContent}\n      </Fragment>\n    );\n  }\n);\n\nIconToggleButton.displayName = 'IconToggleButton';\n"],"names":["forwardRef","processGlobals","useRef","useImperativeHandle","useToggleAction","useTooltip","toggleStyling","_jsxs","Fragment","_jsx","BaseButton","mergeProps","ToggleButtonLabel"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAwFA;;;AAGG;MACU,gBAAgB,GAAGA,iBAAU,CACxC,CACE,EACE,QAAQ,EACR,OAAO,GAAG,UAAU,EACpB,IAAI,GAAG,IAAI,EACX,UAAU,GAAG,KAAK,EAClB,OAAO,EACP,eAAe,EACf,UAAU,GAAG,KAAK,EAClB,QAAQ,EACR,MAAM,EACN,kBAAkB,EAAE,eAAe,EACnC,KAAK,EACL,GAAG,KAAK,EAC4D,EACtE,GAAqC,KACnC;IACF,MAAM,EAAE,gBAAgB,EAAE,GAAGC,0BAAc,CAAC,KAAK,CAAC,CAAC;AAEnD,IAAA,MAAM,SAAS,GAAGC,YAAM,CAAoB,IAAI,CAAC,CAAC;AAClD,IAAAC,yBAAmB,CAAC,GAAI,EAAE,MAAM,SAAS,CAAC,OAAQ,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;AAEjE,IAAA,MAAM,EAAE,YAAY,EAAE,GAAGC,+BAAe,CAAC;AACvC,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,EAAE,cAAc,EAAE,YAAY,EAAE,GAAGC,qBAAU,CAAC;QAClD,IAAI,EAAE,OAAO,IAAI,eAAe;AAChC,QAAA,UAAU,EAAE,UAAU;AACvB,KAAA,CAAC,CAAC;IAEH,MAAM,OAAO,GAAGC,+BAAa,CAC3B,MAAM,EACN,UAAU,EACV,KAAK,EACL,KAAK,EACL,OAAO,KAAK,UAAU,EACtB,SAAS,EACT,SAAS,EACT,IAAI,CACL,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG,EAAE,kBAAkB,EAAE,eAAe,EAAE,CAAC;AAE1D,IAAA,QACEC,eAAC,CAAAC,eAAQ,eACPC,cAAC,CAAAC,qBAAU,OACLC,qBAAU,CAAC,YAAY,EAAE,YAAY,EAAE,gBAAgB,EAAE,SAAS,CAAC,EACvE,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EAAA,cAAA,EACE,UAAU,EACxB,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE,SAAS,EACF,YAAA,EAAA,eAAe,IAAI,OAAO,EACtC,MAAM,EAAE,MAAM,YACdF,cAAC,CAAAG,mCAAiB,IAChB,QAAQ,EAAE,MAAM,QAAQ,GAAG,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,EACjD,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,QAAQ,EAAsB,CAAA,EAAA,CAChC,EACZ,cAAc,CAAA,EAAA,CACN,EACX;AACJ,CAAC,EACD;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB;;;;"}

package/cjs/InlineUserAssistance-d32aad17.js

@@ -0,0 +1,85 @@
+/* @oracle/oraclejet-preact: undefined */
+'use strict';
+
+var jsxRuntime = require('preact/jsx-runtime');
+require('./logger-2b636482.js');
+require('preact/hooks');
+require('./Flex-e7a85bef.js');
+
+
+require('./UNSAFE_MessageBanner/themes/redwood/MessageBannerVariants.css.js');
+require('preact');
+require('./LayerHost-a8c7f182.js');
+require('preact/compat');
+
+
+require('./hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js');
+require('./tooltipUtils-669c2ae0.js');
+
+require('./IconButton-6f58deac.js');
+
+require('./MessageFormattingUtils-42d84399.js');
+require('./TransitionGroup-b239d98f.js');
+require('./MessagesContext-4e939750.js');
+
+
+
+require('./UNSAFE_ComponentMessage/themes/redwood/ComponentMessageVariants.css.js');
+
+
+require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceVariants.css.js');
+var ComponentMessageContainer = require('./ComponentMessageContainer-ffadd93c.js');
+require('./FormContext-9452bd30.js');
+var useFormContext = require('./useFormContext-4c3091dc.js');
+require('./FormFieldContext-8418dc68.js');
+var useFormFieldContext = require('./useFormFieldContext-20f419ef.js');
+var InlineHelp = require('./InlineHelp-281083ff.js');
+var useTranslationBundle = require('./useTranslationBundle-51f4c22c.js');
+var useComponentTheme = require('./useComponentTheme-082fc8e4.js');
+var UNSAFE_UserAssistance_themes_redwood_UserAssistanceTheme = require('./UNSAFE_UserAssistance/themes/redwood/UserAssistanceTheme.js');
+var classNames = require('./classNames-c14c6ef3.js');
+require('./InputGroupContext-05f2a46f.js');
+var useInputGroupContext = require('./useInputGroupContext-4c10bd57.js');
+var useTestId = require('./useTestId-5e6af45d.js');
+
+function InlineRequired({ align = 'end', hasHelp = false, hasMessages = false }) {
+    const { classes } = useComponentTheme.useComponentTheme(UNSAFE_UserAssistance_themes_redwood_UserAssistanceTheme.UserAssistanceRedwoodTheme, {
+        align,
+        visible: hasHelp || hasMessages ? 'hide' : 'show' // TODO: fix typing so that options autocomplete
+    });
+    const translations = useTranslationBundle.useTranslationBundle('@oracle/oraclejet-preact');
+    const requiredStr = translations.userAssistance_required();
+    return jsxRuntime.jsx("div", { class: classes, children: requiredStr });
+}
+
+// defaults to type='reflow'. If this is within an oj-form-layout, the o-f-l
+// will pass down its type which defaults to 'efficient' (TODO).
+function InlineUserAssistanceContainer({ variant = 'reflow', children, id, testId }) {
+    const { classes, styles: { inlineContainerBaseStyles } } = useComponentTheme.useComponentTheme(UNSAFE_UserAssistance_themes_redwood_UserAssistanceTheme.UserAssistanceRedwoodTheme, {
+        container: variant
+    });
+    const testIdProps = useTestId.useTestId(testId);
+    // we want to suppress the display of messages if it's in a group context
+    const inputGroupContext = useInputGroupContext.useInputGroupContext();
+    if (inputGroupContext !== null)
+        return null;
+    const content = (jsxRuntime.jsx("div", { class: classNames.classNames([classes, inlineContainerBaseStyles]), id: id, ...testIdProps, children: children }));
+    return content;
+}
+
+// This has the precedence rules for the user assistance.
+function InlineUserAssistance({ assistiveText, fieldLabel, helpSourceLink, helpSourceText, id, isRequiredShown, requiredAlignment, messages = [], userAssistanceDensity, testId }) {
+    const { isReadonly: isFormReadonly } = useFormContext.useFormContext();
+    const needsUserAssistanceIfNoContent = userAssistanceDensity === 'efficient' && isFormReadonly === false;
+    const { isFocused } = useFormFieldContext.useFormFieldContext();
+    const uaInlineContent = messages.length > 0 ? (jsxRuntime.jsx(ComponentMessageContainer.ComponentMessageContainer, { fieldLabel: fieldLabel, messages: messages })) : (assistiveText || helpSourceLink) && isFocused ? (jsxRuntime.jsx(InlineHelp.InlineHelp, { assistiveText: assistiveText, sourceLink: helpSourceLink, sourceText: helpSourceText })) : isRequiredShown ? (jsxRuntime.jsx(InlineRequired, { align: requiredAlignment })) : null;
+    // when reflow we do not render unless it has content.
+    // when efficient we render regardless of if it has content.
+    // TODO: Get the userAssistanceDensity value from the FormContext
+    return uaInlineContent || needsUserAssistanceIfNoContent ? (jsxRuntime.jsx(InlineUserAssistanceContainer, { id: id, variant: userAssistanceDensity, testId: testId, children: uaInlineContent })) : null;
+}
+
+exports.InlineRequired = InlineRequired;
+exports.InlineUserAssistance = InlineUserAssistance;
+exports.InlineUserAssistanceContainer = InlineUserAssistanceContainer;
+//# sourceMappingURL=InlineUserAssistance-d32aad17.js.map

package/cjs/InlineUserAssistance-d32aad17.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineUserAssistance-d32aad17.js","sources":["../../src/UNSAFE_UserAssistance/InlineRequired.tsx","../../src/UNSAFE_UserAssistance/InlineUserAssistanceContainer.tsx","../../src/UNSAFE_UserAssistance/InlineUserAssistance.tsx"],"sourcesContent":["import { useTranslationBundle } from '../hooks/UNSAFE_useTranslationBundle';\nimport { BundleType } from '../resources/nls/bundle';\nimport { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { UserAssistanceVariantOptions } from './themes/UserAssistanceStyles.css';\nimport { UserAssistanceRedwoodTheme } from './themes/redwood/UserAssistanceTheme';\n\ntype Props = {\n  align?: 'start' | 'end';\n  hasMessages?: boolean;\n  hasHelp?: boolean;\n};\n\nexport function InlineRequired({ align = 'end', hasHelp = false, hasMessages = false }: Props) {\n  const { classes } = useComponentTheme<UserAssistanceVariantOptions>(UserAssistanceRedwoodTheme, {\n    align,\n    visible: hasHelp || hasMessages ? 'hide' : 'show' // TODO: fix typing so that options autocomplete\n  });\n\n  const translations = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n  const requiredStr = translations.userAssistance_required();\n\n  return <div class={classes}>{requiredStr}</div>;\n}\n","import { ComponentChildren } from 'preact';\nimport { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { UserAssistanceDensityType } from './InlineUserAssistance';\nimport {\n  UserAssistanceStyles,\n  UserAssistanceVariantOptions\n} from './themes/UserAssistanceStyles.css';\nimport { useInputGroupContext } from '../hooks/UNSAFE_useInputGroupContext';\nimport { UserAssistanceRedwoodTheme } from './themes/redwood/UserAssistanceTheme';\nimport { TestIdProps, useTestId } from '#hooks/UNSAFE_useTestId';\n\ntype Props = {\n  id?: string;\n  children?: ComponentChildren;\n  variant?: UserAssistanceDensityType;\n} & TestIdProps;\n\n// defaults to type='reflow'. If this is within an oj-form-layout, the o-f-l\n// will pass down its type which defaults to 'efficient' (TODO).\nexport function InlineUserAssistanceContainer({ variant = 'reflow', children, id, testId }: Props) {\n  const {\n    classes,\n    styles: { inlineContainerBaseStyles }\n  } = useComponentTheme<UserAssistanceVariantOptions, UserAssistanceStyles>(\n    UserAssistanceRedwoodTheme,\n    {\n      container: variant\n    }\n  );\n\n  const testIdProps = useTestId(testId);\n\n  // we want to suppress the display of messages if it's in a group context\n  const inputGroupContext = useInputGroupContext();\n  if (inputGroupContext !== null) return null;\n\n  const content = (\n    <div class={classNames([classes, inlineContainerBaseStyles])} id={id} {...testIdProps}>\n      {children}\n    </div>\n  );\n\n  return content;\n}\n","import { ComponentProps } from 'preact';\nimport { ComponentMessageItem, ComponentMessageContainer } from '../UNSAFE_ComponentMessage';\nimport { useFormContext } from '../hooks/UNSAFE_useFormContext';\nimport { useFormFieldContext } from '../hooks/UNSAFE_useFormFieldContext';\nimport { InlineHelp } from './InlineHelp';\nimport { InlineRequired } from './InlineRequired';\nimport { InlineUserAssistanceContainer } from './InlineUserAssistanceContainer';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\n\nexport type UserAssistanceDensityType = 'reflow' | 'efficient';\n\ntype Props = {\n  assistiveText?: string;\n  fieldLabel?: string;\n  helpSourceLink?: string;\n  helpSourceText?: string;\n  id?: string;\n  isRequiredShown?: boolean;\n  requiredAlignment?: ComponentProps<typeof InlineRequired>['align'];\n  messages?: ComponentMessageItem[];\n  userAssistanceDensity?: UserAssistanceDensityType;\n} & TestIdProps;\n\n// This has the precedence rules for the user assistance.\nexport function InlineUserAssistance({\n  assistiveText,\n  fieldLabel,\n  helpSourceLink,\n  helpSourceText,\n  id,\n  isRequiredShown,\n  requiredAlignment,\n  messages = [],\n  userAssistanceDensity,\n  testId\n}: Props) {\n  const { isReadonly: isFormReadonly } = useFormContext();\n  const needsUserAssistanceIfNoContent =\n    userAssistanceDensity === 'efficient' && isFormReadonly === false;\n  const { isFocused } = useFormFieldContext();\n  const uaInlineContent =\n    messages.length > 0 ? (\n      <ComponentMessageContainer fieldLabel={fieldLabel} messages={messages} />\n    ) : (assistiveText || helpSourceLink) && isFocused ? (\n      <InlineHelp\n        assistiveText={assistiveText}\n        sourceLink={helpSourceLink}\n        sourceText={helpSourceText}\n      />\n    ) : isRequiredShown ? (\n      <InlineRequired align={requiredAlignment} />\n    ) : null;\n\n  // when reflow we do not render unless it has content.\n  // when efficient we render regardless of if it has content.\n  // TODO: Get the userAssistanceDensity value from the FormContext\n  return uaInlineContent || needsUserAssistanceIfNoContent ? (\n    <InlineUserAssistanceContainer id={id} variant={userAssistanceDensity} testId={testId}>\n      {uaInlineContent}\n    </InlineUserAssistanceContainer>\n  ) : null;\n}\n"],"names":["useComponentTheme","UserAssistanceRedwoodTheme","useTranslationBundle","_jsx","useTestId","useInputGroupContext","classNames","useFormContext","useFormFieldContext","ComponentMessageContainer","InlineHelp"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYgB,SAAA,cAAc,CAAC,EAAE,KAAK,GAAG,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,WAAW,GAAG,KAAK,EAAS,EAAA;AAC3F,IAAA,MAAM,EAAE,OAAO,EAAE,GAAGA,mCAAiB,CAA+BC,mFAA0B,EAAE;QAC9F,KAAK;AACL,QAAA,OAAO,EAAE,OAAO,IAAI,WAAW,GAAG,MAAM,GAAG,MAAM;AAClD,KAAA,CAAC,CAAC;AAEH,IAAA,MAAM,YAAY,GAAGC,yCAAoB,CAAa,0BAA0B,CAAC,CAAC;AAClF,IAAA,MAAM,WAAW,GAAG,YAAY,CAAC,uBAAuB,EAAE,CAAC;AAE3D,IAAA,OAAOC,wBAAK,KAAK,EAAE,OAAO,EAAG,QAAA,EAAA,WAAW,GAAO,CAAC;AAClD;;ACJA;AACA;AACgB,SAAA,6BAA6B,CAAC,EAAE,OAAO,GAAG,QAAQ,EAAE,QAAQ,EAAE,EAAE,EAAE,MAAM,EAAS,EAAA;AAC/F,IAAA,MAAM,EACJ,OAAO,EACP,MAAM,EAAE,EAAE,yBAAyB,EAAE,EACtC,GAAGH,mCAAiB,CACnBC,mFAA0B,EAC1B;AACE,QAAA,SAAS,EAAE,OAAO;AACnB,KAAA,CACF,CAAC;AAEF,IAAA,MAAM,WAAW,GAAGG,mBAAS,CAAC,MAAM,CAAC,CAAC;;AAGtC,IAAA,MAAM,iBAAiB,GAAGC,yCAAoB,EAAE,CAAC;IACjD,IAAI,iBAAiB,KAAK,IAAI;AAAE,QAAA,OAAO,IAAI,CAAC;IAE5C,MAAM,OAAO,IACXF,cAAK,CAAA,KAAA,EAAA,EAAA,KAAK,EAAEG,qBAAU,CAAC,CAAC,OAAO,EAAE,yBAAyB,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAA,GAAM,WAAW,EAClF,QAAA,EAAA,QAAQ,EACL,CAAA,CACP,CAAC;AAEF,IAAA,OAAO,OAAO,CAAC;AACjB;;ACrBA;AACM,SAAU,oBAAoB,CAAC,EACnC,aAAa,EACb,UAAU,EACV,cAAc,EACd,cAAc,EACd,EAAE,EACF,eAAe,EACf,iBAAiB,EACjB,QAAQ,GAAG,EAAE,EACb,qBAAqB,EACrB,MAAM,EACA,EAAA;IACN,MAAM,EAAE,UAAU,EAAE,cAAc,EAAE,GAAGC,6BAAc,EAAE,CAAC;IACxD,MAAM,8BAA8B,GAClC,qBAAqB,KAAK,WAAW,IAAI,cAAc,KAAK,KAAK,CAAC;AACpE,IAAA,MAAM,EAAE,SAAS,EAAE,GAAGC,uCAAmB,EAAE,CAAC;AAC5C,IAAA,MAAM,eAAe,GACnB,QAAQ,CAAC,MAAM,GAAG,CAAC,IACjBL,cAAA,CAACM,mDAAyB,EAAA,EAAC,UAAU,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAI,CAAA,IACvE,CAAC,aAAa,IAAI,cAAc,KAAK,SAAS,IAChDN,cAAA,CAACO,qBAAU,EAAA,EACT,aAAa,EAAE,aAAa,EAC5B,UAAU,EAAE,cAAc,EAC1B,UAAU,EAAE,cAAc,EAAA,CAC1B,IACA,eAAe,IACjBP,cAAA,CAAC,cAAc,EAAC,EAAA,KAAK,EAAE,iBAAiB,GAAI,IAC1C,IAAI,CAAC;;;;AAKX,IAAA,OAAO,eAAe,IAAI,8BAA8B,IACtDA,cAAA,CAAC,6BAA6B,EAAA,EAAC,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE,qBAAqB,EAAE,MAAM,EAAE,MAAM,EAAA,QAAA,EAClF,eAAe,EAAA,CACc,IAC9B,IAAI,CAAC;AACX;;;;;;"}