@oracle/oraclejet-preact 21.0.0 → 21.0.1

package/amd/{ColorInputText-55b31f03.js.map → ColorInputText-3ac0f956.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ColorInputText-55b31f03.js","sources":["../../src/UNSAFE_ColorInputText/ColorInputTextPickerDropdown.tsx","../../src/UNSAFE_ColorInputText/ColorInputText.tsx","../../src/UNSAFE_ColorInputText/useColorInputText.ts"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { ComponentProps } from 'preact';\nimport { useCallback, useState } from 'preact/hooks';\nimport { BundleType } from '../resources/nls/bundle';\nimport { ColorPicker } from '#UNSAFE_ColorPicker';\nimport { type CloseDetail as DropdownCloseDetail } from '#UNSAFE_Dropdown';\nimport { FormFieldContext } from '../hooks/UNSAFE_useFormFieldContext';\nimport { InlineUserAssistance } from '../UNSAFE_UserAssistance';\nimport {\n  dropdownStyles,\n  userAssistanceStyles\n} from './themes/ColorInputTextPickerDropdownStyles.css';\nimport { PositionData } from '../UNSAFE_Floating';\nimport { StickyPositioningDropdown } from '#PRIVATE_FormControls';\nimport { SectionedContent } from '#PRIVATE_FormControls';\nimport { type CloseDetail as SheetCloseDetail, Sheet } from '#UNSAFE_Sheet';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { type SizeOptions } from '#UNSAFE_Floating/Floating';\nimport { ColorInputTextPublicProps as ColorInputTextProps } from './ColorInputText.types';\nimport { isPhone } from '#utils/UNSAFE_clientUtils';\n\ntype StickyPositioningDropdownProps = ComponentProps<typeof StickyPositioningDropdown>;\ntype ColorPickerProps = ComponentProps<typeof ColorPicker>;\ntype PickedPropsFromColorPicker = Pick<ColorPickerProps, 'value' | 'onCommit'>;\ntype PickedPropsFromDropdown = Pick<StickyPositioningDropdownProps, 'anchorRef' | 'isOpen'>;\ntype CloseDetail = SheetCloseDetail | DropdownCloseDetail;\ntype PickedPropsFromColorInputText = Pick<\n  ColorInputTextProps,\n  | 'swatchSize'\n  | 'palette'\n  | 'assistiveText'\n  | 'helpSourceLink'\n  | 'helpSourceText'\n  | 'isDisabled'\n  | 'isReadonly'\n  | 'label'\n  | 'messages'\n  | 'testId'\n  | 'userAssistanceDensity'\n>;\n\nconst DROPDOWN_SIZE_OPTIONS: SizeOptions = {\n  isMaxWidthAdjusted: false,\n  isMaxHeightAdjusted: true\n};\n\ntype Props = PickedPropsFromColorPicker &\n  PickedPropsFromColorInputText &\n  PickedPropsFromDropdown & {\n    /**\n     * The id of the dialog controlled by the color input.\n     */\n    id?: string;\n\n    /**\n     * Called when the dropdown or sheet is supposed to be closed.\n     */\n    onClose?: (detail: CloseDetail) => void;\n  };\n\n/**\n * Component that renders ColorPicker either inside a dropdown or sheet; in mobile,\n * it renders inside a sheet. Additionally, when a dropdown is being shown beneath\n * the component, we also show any user assistance text or messages below the picker\n * because otherwise that information would be obscured from view. When a sheet is being\n * shown, it will always display UA and messages at the bottom of the sheet.\n */\nconst ColorInputTextPickerDropdown = ({\n  anchorRef,\n  assistiveText,\n  swatchSize,\n  palette,\n  helpSourceLink,\n  helpSourceText,\n  id,\n  isDisabled,\n  isOpen,\n  isReadonly,\n  label,\n  onClose,\n  onCommit,\n  messages,\n  testId,\n  userAssistanceDensity,\n  value\n}: Props) => {\n  // If the dropdown opens above the component, we don't want to show UA or messages.\n  const [isDropdownAbove, setDropdownAbove] = useState(false);\n  const [prevIsOpen, setPrevIsOpen] = useState(isOpen);\n  const handleDropdownPosition = useCallback<\n    NonNullable<StickyPositioningDropdownProps['onPosition']>\n  >((data: PositionData) => {\n    setDropdownAbove(data.placement.startsWith('top'));\n  }, []);\n  // Reset the flag when the dropdown is closed.\n  if (prevIsOpen !== isOpen) {\n    setPrevIsOpen(isOpen);\n    if (!isOpen) {\n      setDropdownAbove(false);\n    }\n  }\n\n  // On mobile phones, the dropdown becomes a sheet.\n  const shouldShowSheet = isPhone();\n\n  const { colorPicker_label } = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n  const colorPickerAriaLabel = colorPicker_label();\n\n  const colorPickerMainContent = (\n    <ColorPicker\n      height={!shouldShowSheet ? 'auto' : undefined}\n      onCommit={onCommit}\n      // for sheet, we want the width to grow to the width of the sheet, otherwise it will use the theme default.\n      maxWidth={shouldShowSheet ? '100%' : undefined}\n      width=\"100%\"\n      swatchSize={swatchSize}\n      palette={palette}\n      testId={testId}\n      value={value}\n    />\n  );\n\n  const inlineUserAssistanceFooter =\n    isOpen &&\n    (!isDropdownAbove || shouldShowSheet) &&\n    !isDisabled &&\n    !isReadonly &&\n    (assistiveText || helpSourceLink || (messages && messages.length > 0)) &&\n    (userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow') ? (\n      <FormFieldContext.Provider value={{ isFocused: true }}>\n        <div class={userAssistanceStyles}>\n          <InlineUserAssistance\n            assistiveText={assistiveText}\n            fieldLabel={label}\n            helpSourceLink={helpSourceLink}\n            helpSourceText={helpSourceText}\n            messages={messages}\n            userAssistanceDensity={userAssistanceDensity}\n          />\n        </div>\n      </FormFieldContext.Provider>\n    ) : undefined;\n\n  const contentTestId = testId ? testId + (shouldShowSheet ? '_sheet' : '_dropdown') : undefined;\n\n  // The same content is displayed either in a dropdown or sheet: color picker and inline UA.\n  // Add styling to the dropdown to enforce a fixed width.\n  const dropdownContent = (\n    <div class={dropdownStyles}>\n      <SectionedContent\n        id={id}\n        paddingBlockEnd=\"3.5x\"\n        paddingBlockStart=\"3.5x\"\n        paddingInlineEnd=\"3.5x\"\n        paddingInlineStart=\"3.5x\"\n        aria-label={colorPickerAriaLabel}\n        footer={inlineUserAssistanceFooter}\n        hasFocusTrap={true}\n        main={colorPickerMainContent}\n        role=\"dialog\"\n        testId={contentTestId}\n      />\n    </div>\n  );\n\n  const dropdown = shouldShowSheet ? (\n    <Sheet isOpen={isOpen} onClose={onClose}>\n      <SectionedContent\n        aria-label={colorPickerAriaLabel}\n        id={id}\n        footer={inlineUserAssistanceFooter}\n        hasFocusTrap={true}\n        main={colorPickerMainContent}\n        role=\"dialog\"\n        testId={contentTestId}\n      />\n    </Sheet>\n  ) : (\n    <StickyPositioningDropdown\n      anchorRef={anchorRef}\n      isOpen={isOpen}\n      onClose={onClose}\n      onPosition={handleDropdownPosition}\n      sizeOptions={DROPDOWN_SIZE_OPTIONS}>\n      {dropdownContent}\n    </StickyPositioningDropdown>\n  );\n\n  return dropdown;\n};\n\nexport { ColorInputTextPickerDropdown, type CloseDetail };\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { Ref } from 'preact';\nimport { forwardRef, ElementRef } from 'preact/compat';\nimport { useCallback, useRef } from 'preact/hooks';\nimport { type BundleType } from '../resources/nls/bundle';\nimport { isValidColorValue, type ColorValue } from '#utils/UNSAFE_color';\nimport { ColorInputTextPickerDropdown } from './ColorInputTextPickerDropdown';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { useId } from '#hooks/UNSAFE_useId';\nimport { ValueUpdateDetail } from '#utils/UNSAFE_valueUpdateDetail';\nimport { ColorSwatch } from '#UNSAFE_ColorSwatch';\nimport { useColorInputText } from './useColorInputText';\nimport { useClearIcon } from '../hooks/UNSAFE_useClearIcon';\nimport { FocusableHandle } from '../hooks/UNSAFE_useFocusableTextField';\nimport { useHover } from '../hooks/UNSAFE_useHover';\nimport { useCurrentValueReducer } from '../hooks/UNSAFE_useCurrentValueReducer';\nimport { SelectableHandle } from '#hooks/UNSAFE_useSelectableTextField';\nimport { ColorInputTextPublicProps as Props } from './ColorInputText.types';\nimport { defaultTextAlignForVariant, isEmbeddedVariant } from '#utils/PRIVATE_formControlUtils';\nimport { EmbeddedInputBase, InputBase, useInputBase } from '#PRIVATE_InputBase';\nimport { ReadonlyTextFieldInput, TextFieldInput } from '../UNSAFE_TextField';\nimport { isMobile, isPhone } from '#utils/UNSAFE_clientUtils';\nimport { ClearIcon } from '../PRIVATE_ClearIcon/ClearIcon';\nimport { useFormContext } from '#hooks/UNSAFE_useFormContext';\nimport { TabbableModeContext } from '#hooks/UNSAFE_useTabbableMode';\n\ntype SwatchHandle = ElementRef<typeof ColorSwatch>;\n\ntype FocusSelectHandle = FocusableHandle & SelectableHandle;\n\nconst nonTabbableMode = { isTabbable: false };\n\nconst valuesAreDifferent = (v1?: string, v2?: string) => v1 !== v2;\n\nconst getValidColorValue = (value?: string): ColorValue | undefined => {\n  return value && isValidColorValue(value) ? (value as ColorValue) : undefined;\n};\n\n/**\n * ColorInputText is a form field that allows users to select or input a color value,\n * using a color picker or by entering freeform color text.\n */\nexport const ColorInputText = forwardRef(\n  (\n    {\n      'aria-describedby': ariaDescribedBy,\n      swatchSize,\n      palette,\n      value,\n      isDisabled: propIsDisabled,\n      isReadonly: propIsReadonly,\n      labelEdge: propLabelEdge,\n      labelStartWidth: propLabelStartWidth,\n      isRequiredShown = false,\n      isRequired = false,\n      placeholder,\n      hasClearIcon,\n      columnSpan,\n      textAlign: propTextAlign,\n      messages,\n      assistiveText,\n      helpSourceLink,\n      helpSourceText,\n      label,\n      onCommit,\n      onInput,\n      testId,\n      variant,\n      userAssistanceDensity: propUserAssistanceDensity\n    }: Props,\n    ref?: Ref<FocusSelectHandle>\n  ) => {\n    const {\n      closePicker,\n      colorIconActionHandler,\n      dropdownCloseHandler,\n      containerDropdownProps,\n      focusLauncherOrRestoreAfterClose,\n      iconRef,\n      isOpen,\n      colorRef: enabledElementRef\n    } = useColorInputText({ isPickerSheet: isPhone() });\n\n    const mainFieldRef = useRef<HTMLDivElement>(null);\n    const colorPickerDialogId = useId();\n    const { inputColor_selectColor } = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n    const colorIconAriaLabel = inputColor_selectColor();\n    const readonlyElementRef = useRef<HTMLDivElement>(null);\n    const { isFormLayout, isReadonly: formIsReadonly } = useFormContext();\n\n    const { currentCommitValue, dispatch } = useCurrentValueReducer({ value });\n    const onInputAndDispatch = useCallback(\n      (detail: ValueUpdateDetail<string>) => {\n        // Should dispatch happen first? This will queue up a re-render, ordering should not cause issues (this is async)\n        dispatch({ type: 'input', payload: detail.value });\n        onInput?.(detail);\n      },\n      [dispatch, onInput]\n    );\n    const onCommitAndDispatch = useCallback(\n      (detail: ValueUpdateDetail<string>) => {\n        // Should dispatch happen first? This will queue up a re-render, ordering should not cause issues (this is async)\n        dispatch({ type: 'commit', payload: detail.value });\n        onCommit?.(detail);\n      },\n      [dispatch, onCommit]\n    );\n\n    const base = useInputBase<HTMLInputElement, HTMLDivElement, string | undefined>({\n      assistiveText,\n      ariaDescribedBy,\n      columnSpan,\n      contentVariant: 'input',\n      enabledElementRef,\n      helpSourceLink,\n      helpSourceText,\n      isDisabled: propIsDisabled,\n      isFocusedOverride: isOpen ? true : undefined,\n      isReadonly: propIsReadonly,\n      isRequiredShown,\n      isSelectable: true,\n      label,\n      labelEdge: propLabelEdge,\n      labelStartWidth: propLabelStartWidth,\n      mainFieldRef,\n      messages,\n      readonlyElementRef,\n      textAlign: propTextAlign,\n      userAssistanceDensity: propUserAssistanceDensity,\n      value,\n      variant\n    });\n\n    const {\n      isDisabled,\n      isReadonly,\n      labelEdge,\n      textAlign = defaultTextAlignForVariant(variant)\n    } = base;\n    const hasPalette = !!palette;\n    const canOpenPicker = hasPalette && !isDisabled && !isReadonly;\n    const isMixedReadonly =\n      isReadonly && propIsReadonly === true && isFormLayout === true && formIsReadonly !== true;\n    const shouldDisableSwatchPointerEvents = !canOpenPicker && !isReadonly;\n    const pickerValue = getValidColorValue(value);\n    const swatchValue = getValidColorValue(value);\n    const colorIconTestId = testId ? testId + '_colorIcon' : undefined;\n    // Used when no palette is available. The swatch is only a color preview, so keep it\n    // out of the tab order and accessibility tree.\n    const decorativeSwatch = (\n      <TabbableModeContext.Provider value={nonTabbableMode}>\n        <ColorSwatch\n          size=\"xs\"\n          isDisabled={isDisabled || isReadonly}\n          isTooltipDisabled={true}\n          testId={colorIconTestId}\n          value={swatchValue}\n        />\n      </TabbableModeContext.Provider>\n    );\n    // Used for mixed readonly form layouts, where readonly ColorInputText still shows a\n    // swatch cue. The readonly textbox owns the tab stop; the swatch remains non-tabbable.\n    const mixedReadonlyDecorativeSwatch = (\n      <TabbableModeContext.Provider value={nonTabbableMode}>\n        <ColorSwatch\n          size=\"xs\"\n          isDisabled={isDisabled}\n          isButton={true}\n          isReadonly={!isDisabled && isReadonly}\n          isTooltipDisabled={!isReadonly || !swatchValue}\n          testId={colorIconTestId}\n          value={swatchValue}\n        />\n      </TabbableModeContext.Provider>\n    );\n    const swatch = isMixedReadonly ? (\n      mixedReadonlyDecorativeSwatch\n    ) : !hasPalette ? (\n      decorativeSwatch\n    ) : (\n      // Used when a palette exists. It acts as the picker launcher only when enabled;\n      // otherwise it renders as a disabled visual swatch.\n      <ColorSwatch\n        size=\"xs\"\n        aria-expanded={canOpenPicker ? isOpen : undefined}\n        aria-haspopup={canOpenPicker ? 'dialog' : undefined}\n        aria-label={canOpenPicker ? colorIconAriaLabel : undefined}\n        buttonBehavior=\"launcher\"\n        isDisabled={!canOpenPicker}\n        isTooltipDisabled={!canOpenPicker}\n        isButton={true}\n        ref={canOpenPicker ? (iconRef as Ref<SwatchHandle>) : undefined}\n        testId={colorIconTestId}\n        value={swatchValue}\n        onToggle={canOpenPicker ? colorIconActionHandler : undefined}\n      />\n    );\n\n    const startContent = (\n      <div\n        aria-hidden={!canOpenPicker ? true : undefined}\n        style={shouldDisableSwatchPointerEvents ? { pointerEvents: 'none' } : undefined}>\n        {swatch}\n      </div>\n    );\n\n    const { hoverProps, isHover } = useHover({ isDisabled: isReadonly || isDisabled || false });\n\n    const onClickClearIcon = useCallback(() => {\n      // Clicking the clear icon should put the focus on the input field\n      enabledElementRef.current?.focus();\n      // Clear is controlled by the parent. Emit the request and let the next prop update\n      // drive the visible textbox and swatch state.\n      if (value === undefined) return;\n      onInput?.({ previousValue: value, value: undefined });\n    }, [enabledElementRef, onInput, value]);\n\n    const onColorPickerCommit = useCallback(\n      (detail: ValueUpdateDetail<ColorValue>) => {\n        focusLauncherOrRestoreAfterClose();\n        closePicker();\n\n        if (valuesAreDifferent(value, detail.value)) {\n          const updateDetail = { previousValue: value, value: detail.value };\n          dispatch({ type: 'commit', payload: detail.value });\n          onInput?.(updateDetail);\n          onCommit?.(updateDetail);\n        }\n      },\n      [closePicker, dispatch, focusLauncherOrRestoreAfterClose, onCommit, onInput, value]\n    );\n\n    const maybeClearIcon = useClearIcon({\n      clearIcon: (\n        <ClearIcon onClick={onClickClearIcon} testId={testId ? `${testId}_clearicon` : undefined} />\n      ),\n      display: hasClearIcon,\n      hasValue: base.formFieldContext.hasValue,\n      isFocused: base.isFocused,\n      isEnabled: !isReadonly && !isDisabled,\n      isHover\n    });\n\n    const hasInsideLabel = label !== undefined && labelEdge === 'inside';\n    const hasRenderedStartContent = !isReadonly || isMixedReadonly;\n    const readonlyTextFieldInput = (\n      <ReadonlyTextFieldInput\n        aria-describedby={base.inputProps['aria-describedby']}\n        aria-label={base.ariaLabel}\n        aria-labelledby={base.labelProps.id}\n        as=\"div\"\n        elementRef={readonlyElementRef}\n        formVariant={variant}\n        onBlur={base.inputProps.onBlur}\n        onFocus={base.inputProps.onFocus}\n        startContentToTextPadding={hasRenderedStartContent ? 'compact' : undefined}\n        textAlign={textAlign}\n        value={value}\n        hasEmptyLabel={label === '' && labelEdge === 'none'}\n        hasInsideLabel={hasInsideLabel}\n      />\n    );\n    const readonlyMainContent = readonlyTextFieldInput;\n\n    const isEmbedded = isEmbeddedVariant(variant);\n    const preserveDefaultStartPadding = isEmbedded && startContent !== undefined;\n    const preserveDefaultEndPadding = isEmbedded && maybeClearIcon !== undefined;\n\n    const mainContent = (\n      <TextFieldInput\n        aria-autocomplete={canOpenPicker ? 'none' : undefined}\n        aria-controls={canOpenPicker && isOpen ? colorPickerDialogId : undefined}\n        aria-labelledby={base.labelProps.id}\n        aria-label={base.ariaLabel}\n        currentCommitValue={currentCommitValue}\n        hasEmptyLabel={label === '' && labelEdge === 'none'}\n        hasEndContent={!!maybeClearIcon}\n        hasInsideLabel={hasInsideLabel}\n        hasStartContent={!!startContent}\n        inputRef={enabledElementRef}\n        isRequired={isRequired}\n        placeholder={placeholder}\n        preserveDefaultEndPadding={preserveDefaultEndPadding}\n        preserveDefaultStartPadding={preserveDefaultStartPadding}\n        role={canOpenPicker ? 'combobox' : undefined}\n        startContentToTextPadding={hasRenderedStartContent ? 'compact' : undefined}\n        textAlign={textAlign}\n        type={isMobile() ? 'text' : undefined}\n        value={value}\n        {...base.inputProps}\n        aria-expanded={canOpenPicker ? isOpen : undefined}\n        aria-haspopup={canOpenPicker ? 'dialog' : undefined}\n        onCommit={onCommitAndDispatch}\n        onInput={onInputAndDispatch}\n        onKeyDown={canOpenPicker ? containerDropdownProps['onKeyDown'] : undefined}\n      />\n    );\n\n    const inputBaseProps = {\n      ref,\n      base,\n      endContent: maybeClearIcon,\n      hasZeroStartMargin: true,\n      insideLabelStartPadding:\n        hasInsideLabel && hasRenderedStartContent ? ('compact' as const) : undefined,\n      mainContent,\n      readonlyMainContent,\n      readonlyStartContent: isMixedReadonly ? startContent : undefined,\n      startContent,\n      testId,\n      ...hoverProps\n    };\n\n    return (\n      <>\n        {isEmbedded ? (\n          <EmbeddedInputBase\n            {...inputBaseProps}\n            endContentVisualOffset={maybeClearIcon ? 'buttonSm' : undefined}\n            startContentVisualOffset={startContent ? 'buttonSm' : undefined}\n          />\n        ) : (\n          <InputBase {...inputBaseProps} />\n        )}\n\n        {isOpen && canOpenPicker && (\n          <ColorInputTextPickerDropdown\n            anchorRef={mainFieldRef}\n            assistiveText={assistiveText}\n            helpSourceLink={helpSourceLink}\n            helpSourceText={helpSourceText}\n            id={colorPickerDialogId}\n            isDisabled={isDisabled}\n            isReadonly={isReadonly}\n            isOpen={isOpen}\n            label={label}\n            onClose={dropdownCloseHandler}\n            onCommit={onColorPickerCommit}\n            messages={messages}\n            testId={testId ? testId + '_colorPicker' : undefined}\n            userAssistanceDensity={base.userAssistanceDensity}\n            value={pickerValue}\n            palette={palette!}\n            swatchSize={swatchSize}\n          />\n        )}\n      </>\n    );\n  }\n);\n\nColorInputText.displayName = 'ColorInputText';\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport type { ComponentProps, RefObject } from 'preact';\nimport { useCallback, useEffect, useRef, useState } from 'preact/hooks';\nimport { ElementRef } from 'preact/compat';\nimport { ColorSwatch } from '#UNSAFE_ColorSwatch';\nimport { CloseDetail, ColorInputTextPickerDropdown } from './ColorInputTextPickerDropdown';\nimport { useDownToggle } from '#hooks/UNSAFE_useDownToggle';\n\ntype SwatchHandle = ElementRef<typeof ColorSwatch>;\ntype PickerLauncher = 'input' | 'swatch';\n\ntype ColorSwatchProps = ComponentProps<typeof ColorSwatch>;\ntype DropdownProps = ComponentProps<typeof ColorInputTextPickerDropdown>;\ntype Props = {\n  isPickerSheet?: boolean;\n};\n\n/**\n * Hook that provides popup and focus management for ColorInputText.\n * The component's value is controlled by its parent and is not stored here.\n */\nconst useColorInputText = ({ isPickerSheet = false }: Props = {}) => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const iconRef: RefObject<SwatchHandle> = useRef<SwatchHandle>(null);\n  const colorRef: RefObject<HTMLInputElement> = useRef<HTMLInputElement>(null);\n  const launcherRef = useRef<PickerLauncher>('swatch');\n\n  // Keep track of whether the dropdown was just dismissed from an outside mousedown event.\n  const outsideMousedownRef = useRef<boolean>(false);\n  const outsideMousedownTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>();\n  const shouldRestoreFocusOnCloseRef = useRef<boolean>(false);\n\n  const focusSwatch = useCallback(() => {\n    iconRef.current?.focus();\n  }, []);\n\n  const focusLauncher = useCallback(() => {\n    if (launcherRef.current === 'input') {\n      colorRef.current?.focus();\n    } else {\n      focusSwatch();\n    }\n  }, [focusSwatch]);\n\n  const closePicker = useCallback(() => {\n    setIsOpen(false);\n  }, []);\n\n  const restoreLauncherFocusAfterClose = useCallback(() => {\n    shouldRestoreFocusOnCloseRef.current = true;\n  }, []);\n\n  const focusLauncherOrRestoreAfterClose = useCallback(() => {\n    if (isPickerSheet) {\n      restoreLauncherFocusAfterClose();\n    } else {\n      focusLauncher();\n    }\n  }, [focusLauncher, isPickerSheet, restoreLauncherFocusAfterClose]);\n\n  // Respond to onAction event from the swatch icon button. Toggles the color picker dropdown.\n  const colorIconActionHandler = useCallback<NonNullable<ColorSwatchProps['onToggle']>>(() => {\n    // Only toggle the value of isOpen if we didn't just dismiss the dropdown.\n    if (!outsideMousedownRef.current) {\n      launcherRef.current = 'swatch';\n      focusSwatch();\n      setIsOpen((prevIsOpen) => !prevIsOpen);\n    }\n    outsideMousedownRef.current = false;\n  }, [focusSwatch]);\n\n  const dropdownCloseHandler = useCallback<NonNullable<DropdownProps['onClose']>>(\n    (detail: CloseDetail) => {\n      // Keep track of when the dropdown is closed via outside mousedown, including when the swatch icon\n      // is clicked. We need this in order to toggle visibility of the picker and dropdown.\n      if (detail.reason === 'outsideMousedown') {\n        outsideMousedownRef.current = true;\n        clearTimeout(outsideMousedownTimerRef.current);\n\n        // Clear the flag after a short delay to ensure the dropdown can be opened again.\n        outsideMousedownTimerRef.current = setTimeout(() => {\n          outsideMousedownRef.current = false;\n        }, 200);\n      } else {\n        focusLauncherOrRestoreAfterClose();\n      }\n      closePicker();\n    },\n    [closePicker, focusLauncherOrRestoreAfterClose]\n  );\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(outsideMousedownTimerRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!isOpen && shouldRestoreFocusOnCloseRef.current) {\n      shouldRestoreFocusOnCloseRef.current = false;\n      focusLauncher();\n    }\n  }, [focusLauncher, isOpen]);\n\n  // The Redwood UX design calls for the dropdown to open when the down arrow is pressed.\n  // Handle opening the dropdown when the down arrow is pressed in the text edit field.\n  const colorPickerDownHandler = useCallback(() => {\n    launcherRef.current = 'input';\n    setIsOpen(true);\n  }, []);\n\n  const { triggerProps: containerDropdownProps } = useDownToggle({\n    isOpen,\n    onToggle: colorPickerDownHandler\n  });\n\n  return {\n    closePicker,\n    colorIconActionHandler,\n    containerDropdownProps,\n    dropdownCloseHandler,\n    focusLauncherOrRestoreAfterClose,\n    focusSwatch,\n    iconRef,\n    isOpen,\n    colorRef\n  };\n};\n\nexport { useColorInputText };\n"],"names":["DROPDOWN_SIZE_OPTIONS","isMaxWidthAdjusted","isMaxHeightAdjusted","ColorInputTextPickerDropdown","anchorRef","assistiveText","swatchSize","palette","helpSourceLink","helpSourceText","id","isDisabled","isOpen","isReadonly","label","onClose","onCommit","messages","testId","userAssistanceDensity","value","isDropdownAbove","setDropdownAbove","useState","prevIsOpen","setPrevIsOpen","handleDropdownPosition","useCallback","data","placement","startsWith","shouldShowSheet","isPhone","colorPicker_label","useTranslationBundle","colorPickerAriaLabel","colorPickerMainContent","_jsx","ColorPicker","height","undefined","maxWidth","width","inlineUserAssistanceFooter","length","FormFieldContext","Provider","isFocused","children","jsx","class","userAssistanceStyles","InlineUserAssistance","fieldLabel","contentTestId","dropdownContent","dropdownStyles","SectionedContent","paddingBlockEnd","paddingBlockStart","paddingInlineEnd","paddingInlineStart","footer","hasFocusTrap","main","role","Sheet","StickyPositioningDropdown","onPosition","sizeOptions","nonTabbableMode","isTabbable","getValidColorValue","isValidColorValue","ColorInputText","forwardRef","ariaDescribedBy","propIsDisabled","propIsReadonly","labelEdge","propLabelEdge","labelStartWidth","propLabelStartWidth","isRequiredShown","isRequired","placeholder","hasClearIcon","columnSpan","textAlign","propTextAlign","onInput","variant","propUserAssistanceDensity","ref","closePicker","colorIconActionHandler","dropdownCloseHandler","containerDropdownProps","focusLauncherOrRestoreAfterClose","iconRef","colorRef","enabledElementRef","isPickerSheet","setIsOpen","useRef","launcherRef","outsideMousedownRef","outsideMousedownTimerRef","shouldRestoreFocusOnCloseRef","focusSwatch","current","focus","focusLauncher","restoreLauncherFocusAfterClose","detail","reason","clearTimeout","setTimeout","useEffect","colorPickerDownHandler","triggerProps","useDownToggle","onToggle","useColorInputText","mainFieldRef","colorPickerDialogId","useId","inputColor_selectColor","colorIconAriaLabel","readonlyElementRef","isFormLayout","formIsReadonly","useFormContext","currentCommitValue","dispatch","useCurrentValueReducer","onInputAndDispatch","type","payload","onCommitAndDispatch","base","useInputBase","contentVariant","isFocusedOverride","isSelectable","defaultTextAlignForVariant","hasPalette","canOpenPicker","isMixedReadonly","shouldDisableSwatchPointerEvents","pickerValue","swatchValue","colorIconTestId","decorativeSwatch","TabbableModeContext","ColorSwatch","size","isTooltipDisabled","mixedReadonlyDecorativeSwatch","isButton","swatch","buttonBehavior","startContent","style","pointerEvents","hoverProps","isHover","useHover","onClickClearIcon","previousValue","onColorPickerCommit","v1","v2","updateDetail","maybeClearIcon","useClearIcon","clearIcon","ClearIcon","onClick","display","hasValue","formFieldContext","isEnabled","hasInsideLabel","hasRenderedStartContent","readonlyMainContent","ReadonlyTextFieldInput","inputProps","ariaLabel","labelProps","as","elementRef","formVariant","onBlur","onFocus","startContentToTextPadding","hasEmptyLabel","isEmbedded","isEmbeddedVariant","preserveDefaultStartPadding","preserveDefaultEndPadding","inputBaseProps","endContent","hasZeroStartMargin","insideLabelStartPadding","mainContent","TextFieldInput","hasEndContent","hasStartContent","inputRef","isMobile","onKeyDown","readonlyStartContent","_jsxs","_Fragment","EmbeddedInputBase","endContentVisualOffset","startContentVisualOffset","InputBase","displayName"],"mappings":"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"}
+{"version":3,"file":"ColorInputText-3ac0f956.js","sources":["../../src/UNSAFE_ColorInputText/ColorInputTextPickerDropdown.tsx","../../src/UNSAFE_ColorInputText/ColorInputText.tsx","../../src/UNSAFE_ColorInputText/useColorInputText.ts"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport { ComponentProps } from 'preact';\nimport { useCallback, useState } from 'preact/hooks';\nimport { BundleType } from '../resources/nls/bundle';\nimport { ColorPicker } from '#UNSAFE_ColorPicker';\nimport { type CloseDetail as DropdownCloseDetail } from '#UNSAFE_Dropdown';\nimport { FormFieldContext } from '../hooks/UNSAFE_useFormFieldContext';\nimport { InlineUserAssistance } from '../UNSAFE_UserAssistance';\nimport {\n  dropdownStyles,\n  userAssistanceStyles\n} from './themes/ColorInputTextPickerDropdownStyles.css';\nimport { PositionData } from '../UNSAFE_Floating';\nimport { StickyPositioningDropdown } from '#PRIVATE_FormControls';\nimport { SectionedContent } from '#PRIVATE_FormControls';\nimport { type CloseDetail as SheetCloseDetail, Sheet } from '#UNSAFE_Sheet';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { type SizeOptions } from '#UNSAFE_Floating/Floating';\nimport { ColorInputTextPublicProps as ColorInputTextProps } from './ColorInputText.types';\nimport { isPhone } from '#utils/UNSAFE_clientUtils';\n\ntype StickyPositioningDropdownProps = ComponentProps<typeof StickyPositioningDropdown>;\ntype ColorPickerProps = ComponentProps<typeof ColorPicker>;\ntype PickedPropsFromColorPicker = Pick<ColorPickerProps, 'value' | 'onCommit'>;\ntype PickedPropsFromDropdown = Pick<StickyPositioningDropdownProps, 'anchorRef' | 'isOpen'>;\ntype CloseDetail = SheetCloseDetail | DropdownCloseDetail;\ntype PickedPropsFromColorInputText = Pick<\n  ColorInputTextProps,\n  | 'swatchSize'\n  | 'palette'\n  | 'assistiveText'\n  | 'helpSourceLink'\n  | 'helpSourceText'\n  | 'isDisabled'\n  | 'isReadonly'\n  | 'label'\n  | 'messages'\n  | 'testId'\n  | 'userAssistanceDensity'\n>;\n\nconst DROPDOWN_SIZE_OPTIONS: SizeOptions = {\n  isMaxWidthAdjusted: false,\n  isMaxHeightAdjusted: true\n};\n\ntype Props = PickedPropsFromColorPicker &\n  PickedPropsFromColorInputText &\n  PickedPropsFromDropdown & {\n    /**\n     * The id of the dialog controlled by the color input.\n     */\n    id?: string;\n\n    /**\n     * Called when the dropdown or sheet is supposed to be closed.\n     */\n    onClose?: (detail: CloseDetail) => void;\n  };\n\n/**\n * Component that renders ColorPicker either inside a dropdown or sheet; in mobile,\n * it renders inside a sheet. Additionally, when a dropdown is being shown beneath\n * the component, we also show any user assistance text or messages below the picker\n * because otherwise that information would be obscured from view. When a sheet is being\n * shown, it will always display UA and messages at the bottom of the sheet.\n */\nconst ColorInputTextPickerDropdown = ({\n  anchorRef,\n  assistiveText,\n  swatchSize,\n  palette,\n  helpSourceLink,\n  helpSourceText,\n  id,\n  isDisabled,\n  isOpen,\n  isReadonly,\n  label,\n  onClose,\n  onCommit,\n  messages,\n  testId,\n  userAssistanceDensity,\n  value\n}: Props) => {\n  // If the dropdown opens above the component, we don't want to show UA or messages.\n  const [isDropdownAbove, setDropdownAbove] = useState(false);\n  const [prevIsOpen, setPrevIsOpen] = useState(isOpen);\n  const handleDropdownPosition = useCallback<\n    NonNullable<StickyPositioningDropdownProps['onPosition']>\n  >((data: PositionData) => {\n    setDropdownAbove(data.placement.startsWith('top'));\n  }, []);\n  // Reset the flag when the dropdown is closed.\n  if (prevIsOpen !== isOpen) {\n    setPrevIsOpen(isOpen);\n    if (!isOpen) {\n      setDropdownAbove(false);\n    }\n  }\n\n  // On mobile phones, the dropdown becomes a sheet.\n  const shouldShowSheet = isPhone();\n\n  const { colorPicker_label } = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n  const colorPickerAriaLabel = colorPicker_label();\n\n  const colorPickerMainContent = (\n    <ColorPicker\n      height={!shouldShowSheet ? 'auto' : undefined}\n      onCommit={onCommit}\n      // for sheet, we want the width to grow to the width of the sheet, otherwise it will use the theme default.\n      maxWidth={shouldShowSheet ? '100%' : undefined}\n      width=\"100%\"\n      swatchSize={swatchSize}\n      palette={palette}\n      testId={testId}\n      value={value}\n    />\n  );\n\n  const inlineUserAssistanceFooter =\n    isOpen &&\n    (!isDropdownAbove || shouldShowSheet) &&\n    !isDisabled &&\n    !isReadonly &&\n    (assistiveText || helpSourceLink || (messages && messages.length > 0)) &&\n    (userAssistanceDensity === 'efficient' || userAssistanceDensity === 'reflow') ? (\n      <FormFieldContext.Provider value={{ isFocused: true }}>\n        <div class={userAssistanceStyles}>\n          <InlineUserAssistance\n            assistiveText={assistiveText}\n            fieldLabel={label}\n            helpSourceLink={helpSourceLink}\n            helpSourceText={helpSourceText}\n            messages={messages}\n            userAssistanceDensity={userAssistanceDensity}\n          />\n        </div>\n      </FormFieldContext.Provider>\n    ) : undefined;\n\n  const contentTestId = testId ? testId + (shouldShowSheet ? '_sheet' : '_dropdown') : undefined;\n\n  // The same content is displayed either in a dropdown or sheet: color picker and inline UA.\n  // Add styling to the dropdown to enforce a fixed width.\n  const dropdownContent = (\n    <div class={dropdownStyles}>\n      <SectionedContent\n        id={id}\n        paddingBlockEnd=\"3.5x\"\n        paddingBlockStart=\"3.5x\"\n        paddingInlineEnd=\"3.5x\"\n        paddingInlineStart=\"3.5x\"\n        aria-label={colorPickerAriaLabel}\n        footer={inlineUserAssistanceFooter}\n        hasFocusTrap={true}\n        main={colorPickerMainContent}\n        role=\"dialog\"\n        testId={contentTestId}\n      />\n    </div>\n  );\n\n  const dropdown = shouldShowSheet ? (\n    <Sheet isOpen={isOpen} onClose={onClose}>\n      <SectionedContent\n        aria-label={colorPickerAriaLabel}\n        id={id}\n        footer={inlineUserAssistanceFooter}\n        hasFocusTrap={true}\n        main={colorPickerMainContent}\n        role=\"dialog\"\n        testId={contentTestId}\n      />\n    </Sheet>\n  ) : (\n    <StickyPositioningDropdown\n      anchorRef={anchorRef}\n      isOpen={isOpen}\n      onClose={onClose}\n      onPosition={handleDropdownPosition}\n      sizeOptions={DROPDOWN_SIZE_OPTIONS}>\n      {dropdownContent}\n    </StickyPositioningDropdown>\n  );\n\n  return dropdown;\n};\n\nexport { ColorInputTextPickerDropdown, type CloseDetail };\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { Ref } from 'preact';\nimport { forwardRef, ElementRef } from 'preact/compat';\nimport { useCallback, useRef } from 'preact/hooks';\nimport { type BundleType } from '../resources/nls/bundle';\nimport { isValidColorValue, type ColorValue } from '#utils/UNSAFE_color';\nimport { ColorInputTextPickerDropdown } from './ColorInputTextPickerDropdown';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { useId } from '#hooks/UNSAFE_useId';\nimport { ValueUpdateDetail } from '#utils/UNSAFE_valueUpdateDetail';\nimport { ColorSwatch } from '#UNSAFE_ColorSwatch';\nimport { useColorInputText } from './useColorInputText';\nimport { useClearIcon } from '../hooks/UNSAFE_useClearIcon';\nimport { FocusableHandle } from '../hooks/UNSAFE_useFocusableTextField';\nimport { useHover } from '../hooks/UNSAFE_useHover';\nimport { useCurrentValueReducer } from '../hooks/UNSAFE_useCurrentValueReducer';\nimport { SelectableHandle } from '#hooks/UNSAFE_useSelectableTextField';\nimport { ColorInputTextPublicProps as Props } from './ColorInputText.types';\nimport { defaultTextAlignForVariant, isEmbeddedVariant } from '#utils/PRIVATE_formControlUtils';\nimport { EmbeddedInputBase, InputBase, useInputBase } from '#PRIVATE_InputBase';\nimport { ReadonlyTextFieldInput, TextFieldInput } from '../UNSAFE_TextField';\nimport { isMobile, isPhone } from '#utils/UNSAFE_clientUtils';\nimport { ClearIcon } from '../PRIVATE_ClearIcon/ClearIcon';\nimport { useFormContext } from '#hooks/UNSAFE_useFormContext';\nimport { TabbableModeContext } from '#hooks/UNSAFE_useTabbableMode';\n\ntype SwatchHandle = ElementRef<typeof ColorSwatch>;\n\ntype FocusSelectHandle = FocusableHandle & SelectableHandle;\n\nconst nonTabbableMode = { isTabbable: false };\n\nconst valuesAreDifferent = (v1?: string, v2?: string) => v1 !== v2;\n\nconst getValidColorValue = (value?: string): ColorValue | undefined => {\n  return value && isValidColorValue(value) ? (value as ColorValue) : undefined;\n};\n\n/**\n * ColorInputText is a form field that allows users to select or input a color value,\n * using a color picker or by entering freeform color text.\n */\nexport const ColorInputText = forwardRef(\n  (\n    {\n      'aria-describedby': ariaDescribedBy,\n      swatchSize,\n      palette,\n      value,\n      isDisabled: propIsDisabled,\n      isReadonly: propIsReadonly,\n      labelEdge: propLabelEdge,\n      labelStartWidth: propLabelStartWidth,\n      isRequiredShown = false,\n      isRequired = false,\n      placeholder,\n      hasClearIcon,\n      columnSpan,\n      textAlign: propTextAlign,\n      messages,\n      assistiveText,\n      helpSourceLink,\n      helpSourceText,\n      label,\n      onCommit,\n      onInput,\n      testId,\n      variant,\n      userAssistanceDensity: propUserAssistanceDensity\n    }: Props,\n    ref?: Ref<FocusSelectHandle>\n  ) => {\n    const {\n      closePicker,\n      colorIconActionHandler,\n      dropdownCloseHandler,\n      containerDropdownProps,\n      focusLauncherOrRestoreAfterClose,\n      iconRef,\n      isOpen,\n      colorRef: enabledElementRef\n    } = useColorInputText({ isPickerSheet: isPhone() });\n\n    const mainFieldRef = useRef<HTMLDivElement>(null);\n    const colorPickerDialogId = useId();\n    const { inputColor_selectColor } = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n    const colorIconAriaLabel = inputColor_selectColor();\n    const readonlyElementRef = useRef<HTMLDivElement>(null);\n    const { isFormLayout, isReadonly: formIsReadonly } = useFormContext();\n\n    const { currentCommitValue, dispatch } = useCurrentValueReducer({ value });\n    const onInputAndDispatch = useCallback(\n      (detail: ValueUpdateDetail<string>) => {\n        // Should dispatch happen first? This will queue up a re-render, ordering should not cause issues (this is async)\n        dispatch({ type: 'input', payload: detail.value });\n        onInput?.(detail);\n      },\n      [dispatch, onInput]\n    );\n    const onCommitAndDispatch = useCallback(\n      (detail: ValueUpdateDetail<string>) => {\n        // Should dispatch happen first? This will queue up a re-render, ordering should not cause issues (this is async)\n        dispatch({ type: 'commit', payload: detail.value });\n        onCommit?.(detail);\n      },\n      [dispatch, onCommit]\n    );\n\n    const base = useInputBase<HTMLInputElement, HTMLDivElement, string | undefined>({\n      assistiveText,\n      ariaDescribedBy,\n      columnSpan,\n      contentVariant: 'input',\n      enabledElementRef,\n      helpSourceLink,\n      helpSourceText,\n      isDisabled: propIsDisabled,\n      isFocusedOverride: isOpen ? true : undefined,\n      isReadonly: propIsReadonly,\n      isRequiredShown,\n      isSelectable: true,\n      label,\n      labelEdge: propLabelEdge,\n      labelStartWidth: propLabelStartWidth,\n      mainFieldRef,\n      messages,\n      readonlyElementRef,\n      textAlign: propTextAlign,\n      userAssistanceDensity: propUserAssistanceDensity,\n      value,\n      variant\n    });\n\n    const {\n      isDisabled,\n      isReadonly,\n      labelEdge,\n      textAlign = defaultTextAlignForVariant(variant)\n    } = base;\n    const hasPalette = !!palette;\n    const canOpenPicker = hasPalette && !isDisabled && !isReadonly;\n    const isMixedReadonly =\n      isReadonly && propIsReadonly === true && isFormLayout === true && formIsReadonly !== true;\n    const shouldDisableSwatchPointerEvents = !canOpenPicker && !isReadonly;\n    const pickerValue = getValidColorValue(value);\n    const swatchValue = getValidColorValue(value);\n    const colorIconTestId = testId ? testId + '_colorIcon' : undefined;\n    // Used when no palette is available. The swatch is only a color preview, so keep it\n    // out of the tab order and accessibility tree.\n    const decorativeSwatch = (\n      <TabbableModeContext.Provider value={nonTabbableMode}>\n        <ColorSwatch\n          size=\"xs\"\n          isDisabled={isDisabled || isReadonly}\n          isTooltipDisabled={true}\n          testId={colorIconTestId}\n          value={swatchValue}\n        />\n      </TabbableModeContext.Provider>\n    );\n    // Used for mixed readonly form layouts, where readonly ColorInputText still shows a\n    // swatch cue. The readonly textbox owns the tab stop; the swatch remains non-tabbable.\n    const mixedReadonlyDecorativeSwatch = (\n      <TabbableModeContext.Provider value={nonTabbableMode}>\n        <ColorSwatch\n          size=\"xs\"\n          isDisabled={isDisabled}\n          isButton={true}\n          isReadonly={!isDisabled && isReadonly}\n          isTooltipDisabled={!isReadonly || !swatchValue}\n          testId={colorIconTestId}\n          value={swatchValue}\n        />\n      </TabbableModeContext.Provider>\n    );\n    const swatch = isMixedReadonly ? (\n      mixedReadonlyDecorativeSwatch\n    ) : !hasPalette ? (\n      decorativeSwatch\n    ) : (\n      // Used when a palette exists. It acts as the picker launcher only when enabled;\n      // otherwise it renders as a disabled visual swatch.\n      <ColorSwatch\n        size=\"xs\"\n        aria-expanded={canOpenPicker ? isOpen : undefined}\n        aria-haspopup={canOpenPicker ? 'dialog' : undefined}\n        aria-label={canOpenPicker ? colorIconAriaLabel : undefined}\n        buttonBehavior=\"launcher\"\n        isDisabled={!canOpenPicker}\n        isTooltipDisabled={!canOpenPicker}\n        isButton={true}\n        ref={canOpenPicker ? (iconRef as Ref<SwatchHandle>) : undefined}\n        testId={colorIconTestId}\n        value={swatchValue}\n        onToggle={canOpenPicker ? colorIconActionHandler : undefined}\n      />\n    );\n\n    const startContent = (\n      <div\n        aria-hidden={!canOpenPicker ? true : undefined}\n        style={shouldDisableSwatchPointerEvents ? { pointerEvents: 'none' } : undefined}>\n        {swatch}\n      </div>\n    );\n\n    const { hoverProps, isHover } = useHover({ isDisabled: isReadonly || isDisabled || false });\n\n    const onClickClearIcon = useCallback(() => {\n      // Clicking the clear icon should put the focus on the input field\n      enabledElementRef.current?.focus();\n      // Clear is controlled by the parent. Emit the request and let the next prop update\n      // drive the visible textbox and swatch state.\n      if (value === undefined) return;\n      onInput?.({ previousValue: value, value: undefined });\n    }, [enabledElementRef, onInput, value]);\n\n    const onColorPickerCommit = useCallback(\n      (detail: ValueUpdateDetail<ColorValue>) => {\n        focusLauncherOrRestoreAfterClose();\n        closePicker();\n\n        if (valuesAreDifferent(value, detail.value)) {\n          const updateDetail = { previousValue: value, value: detail.value };\n          dispatch({ type: 'commit', payload: detail.value });\n          onInput?.(updateDetail);\n          onCommit?.(updateDetail);\n        }\n      },\n      [closePicker, dispatch, focusLauncherOrRestoreAfterClose, onCommit, onInput, value]\n    );\n\n    const maybeClearIcon = useClearIcon({\n      clearIcon: (\n        <ClearIcon onClick={onClickClearIcon} testId={testId ? `${testId}_clearicon` : undefined} />\n      ),\n      display: hasClearIcon,\n      hasValue: base.formFieldContext.hasValue,\n      isFocused: base.isFocused,\n      isEnabled: !isReadonly && !isDisabled,\n      isHover\n    });\n\n    const hasInsideLabel = label !== undefined && labelEdge === 'inside';\n    const hasRenderedStartContent = !isReadonly || isMixedReadonly;\n    const readonlyTextFieldInput = (\n      <ReadonlyTextFieldInput\n        aria-describedby={base.inputProps['aria-describedby']}\n        aria-label={base.ariaLabel}\n        aria-labelledby={base.labelProps.id}\n        as=\"div\"\n        elementRef={readonlyElementRef}\n        formVariant={variant}\n        onBlur={base.inputProps.onBlur}\n        onFocus={base.inputProps.onFocus}\n        startContentToTextPadding={hasRenderedStartContent ? 'compact' : undefined}\n        textAlign={textAlign}\n        value={value}\n        hasEmptyLabel={label === '' && labelEdge === 'none'}\n        hasInsideLabel={hasInsideLabel}\n      />\n    );\n    const readonlyMainContent = readonlyTextFieldInput;\n\n    const isEmbedded = isEmbeddedVariant(variant);\n    const preserveDefaultStartPadding = isEmbedded && startContent !== undefined;\n    const preserveDefaultEndPadding = isEmbedded && maybeClearIcon !== undefined;\n\n    const mainContent = (\n      <TextFieldInput\n        aria-autocomplete={canOpenPicker ? 'none' : undefined}\n        aria-controls={canOpenPicker && isOpen ? colorPickerDialogId : undefined}\n        aria-labelledby={base.labelProps.id}\n        aria-label={base.ariaLabel}\n        currentCommitValue={currentCommitValue}\n        hasEmptyLabel={label === '' && labelEdge === 'none'}\n        hasEndContent={!!maybeClearIcon}\n        hasInsideLabel={hasInsideLabel}\n        hasStartContent={!!startContent}\n        inputRef={enabledElementRef}\n        isRequired={isRequired}\n        placeholder={placeholder}\n        preserveDefaultEndPadding={preserveDefaultEndPadding}\n        preserveDefaultStartPadding={preserveDefaultStartPadding}\n        role={canOpenPicker ? 'combobox' : undefined}\n        startContentToTextPadding={hasRenderedStartContent ? 'compact' : undefined}\n        textAlign={textAlign}\n        type={isMobile() ? 'text' : undefined}\n        value={value}\n        {...base.inputProps}\n        aria-expanded={canOpenPicker ? isOpen : undefined}\n        aria-haspopup={canOpenPicker ? 'dialog' : undefined}\n        onCommit={onCommitAndDispatch}\n        onInput={onInputAndDispatch}\n        onKeyDown={canOpenPicker ? containerDropdownProps['onKeyDown'] : undefined}\n      />\n    );\n\n    const inputBaseProps = {\n      ref,\n      base,\n      endContent: maybeClearIcon,\n      hasZeroStartMargin: true,\n      insideLabelStartPadding:\n        hasInsideLabel && hasRenderedStartContent ? ('compact' as const) : undefined,\n      mainContent,\n      readonlyMainContent,\n      readonlyStartContent: isMixedReadonly ? startContent : undefined,\n      startContent,\n      testId,\n      ...hoverProps\n    };\n\n    return (\n      <>\n        {isEmbedded ? (\n          <EmbeddedInputBase\n            {...inputBaseProps}\n            endContentVisualOffset={maybeClearIcon ? 'buttonSm' : undefined}\n            startContentVisualOffset={startContent ? 'buttonSm' : undefined}\n          />\n        ) : (\n          <InputBase {...inputBaseProps} />\n        )}\n\n        {isOpen && canOpenPicker && (\n          <ColorInputTextPickerDropdown\n            anchorRef={mainFieldRef}\n            assistiveText={assistiveText}\n            helpSourceLink={helpSourceLink}\n            helpSourceText={helpSourceText}\n            id={colorPickerDialogId}\n            isDisabled={isDisabled}\n            isReadonly={isReadonly}\n            isOpen={isOpen}\n            label={label}\n            onClose={dropdownCloseHandler}\n            onCommit={onColorPickerCommit}\n            messages={messages}\n            testId={testId ? testId + '_colorPicker' : undefined}\n            userAssistanceDensity={base.userAssistanceDensity}\n            value={pickerValue}\n            palette={palette!}\n            swatchSize={swatchSize}\n          />\n        )}\n      </>\n    );\n  }\n);\n\nColorInputText.displayName = 'ColorInputText';\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\n\nimport type { ComponentProps, RefObject } from 'preact';\nimport { useCallback, useEffect, useRef, useState } from 'preact/hooks';\nimport { ElementRef } from 'preact/compat';\nimport { ColorSwatch } from '#UNSAFE_ColorSwatch';\nimport { CloseDetail, ColorInputTextPickerDropdown } from './ColorInputTextPickerDropdown';\nimport { useDownToggle } from '#hooks/UNSAFE_useDownToggle';\n\ntype SwatchHandle = ElementRef<typeof ColorSwatch>;\ntype PickerLauncher = 'input' | 'swatch';\n\ntype ColorSwatchProps = ComponentProps<typeof ColorSwatch>;\ntype DropdownProps = ComponentProps<typeof ColorInputTextPickerDropdown>;\ntype Props = {\n  isPickerSheet?: boolean;\n};\n\n/**\n * Hook that provides popup and focus management for ColorInputText.\n * The component's value is controlled by its parent and is not stored here.\n */\nconst useColorInputText = ({ isPickerSheet = false }: Props = {}) => {\n  const [isOpen, setIsOpen] = useState<boolean>(false);\n  const iconRef: RefObject<SwatchHandle> = useRef<SwatchHandle>(null);\n  const colorRef: RefObject<HTMLInputElement> = useRef<HTMLInputElement>(null);\n  const launcherRef = useRef<PickerLauncher>('swatch');\n\n  // Keep track of whether the dropdown was just dismissed from an outside mousedown event.\n  const outsideMousedownRef = useRef<boolean>(false);\n  const outsideMousedownTimerRef = useRef<ReturnType<typeof setTimeout> | undefined>();\n  const shouldRestoreFocusOnCloseRef = useRef<boolean>(false);\n\n  const focusSwatch = useCallback(() => {\n    iconRef.current?.focus();\n  }, []);\n\n  const focusLauncher = useCallback(() => {\n    if (launcherRef.current === 'input') {\n      colorRef.current?.focus();\n    } else {\n      focusSwatch();\n    }\n  }, [focusSwatch]);\n\n  const closePicker = useCallback(() => {\n    setIsOpen(false);\n  }, []);\n\n  const restoreLauncherFocusAfterClose = useCallback(() => {\n    shouldRestoreFocusOnCloseRef.current = true;\n  }, []);\n\n  const focusLauncherOrRestoreAfterClose = useCallback(() => {\n    if (isPickerSheet) {\n      restoreLauncherFocusAfterClose();\n    } else {\n      focusLauncher();\n    }\n  }, [focusLauncher, isPickerSheet, restoreLauncherFocusAfterClose]);\n\n  // Respond to onAction event from the swatch icon button. Toggles the color picker dropdown.\n  const colorIconActionHandler = useCallback<NonNullable<ColorSwatchProps['onToggle']>>(() => {\n    // Only toggle the value of isOpen if we didn't just dismiss the dropdown.\n    if (!outsideMousedownRef.current) {\n      launcherRef.current = 'swatch';\n      focusSwatch();\n      setIsOpen((prevIsOpen) => !prevIsOpen);\n    }\n    outsideMousedownRef.current = false;\n  }, [focusSwatch]);\n\n  const dropdownCloseHandler = useCallback<NonNullable<DropdownProps['onClose']>>(\n    (detail: CloseDetail) => {\n      // Keep track of when the dropdown is closed via outside mousedown, including when the swatch icon\n      // is clicked. We need this in order to toggle visibility of the picker and dropdown.\n      if (detail.reason === 'outsideMousedown') {\n        outsideMousedownRef.current = true;\n        clearTimeout(outsideMousedownTimerRef.current);\n\n        // Clear the flag after a short delay to ensure the dropdown can be opened again.\n        outsideMousedownTimerRef.current = setTimeout(() => {\n          outsideMousedownRef.current = false;\n        }, 200);\n      } else {\n        focusLauncherOrRestoreAfterClose();\n      }\n      closePicker();\n    },\n    [closePicker, focusLauncherOrRestoreAfterClose]\n  );\n\n  useEffect(() => {\n    return () => {\n      clearTimeout(outsideMousedownTimerRef.current);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (!isOpen && shouldRestoreFocusOnCloseRef.current) {\n      shouldRestoreFocusOnCloseRef.current = false;\n      focusLauncher();\n    }\n  }, [focusLauncher, isOpen]);\n\n  // The Redwood UX design calls for the dropdown to open when the down arrow is pressed.\n  // Handle opening the dropdown when the down arrow is pressed in the text edit field.\n  const colorPickerDownHandler = useCallback(() => {\n    launcherRef.current = 'input';\n    setIsOpen(true);\n  }, []);\n\n  const { triggerProps: containerDropdownProps } = useDownToggle({\n    isOpen,\n    onToggle: colorPickerDownHandler\n  });\n\n  return {\n    closePicker,\n    colorIconActionHandler,\n    containerDropdownProps,\n    dropdownCloseHandler,\n    focusLauncherOrRestoreAfterClose,\n    focusSwatch,\n    iconRef,\n    isOpen,\n    colorRef\n  };\n};\n\nexport { useColorInputText };\n"],"names":["DROPDOWN_SIZE_OPTIONS","isMaxWidthAdjusted","isMaxHeightAdjusted","ColorInputTextPickerDropdown","anchorRef","assistiveText","swatchSize","palette","helpSourceLink","helpSourceText","id","isDisabled","isOpen","isReadonly","label","onClose","onCommit","messages","testId","userAssistanceDensity","value","isDropdownAbove","setDropdownAbove","useState","prevIsOpen","setPrevIsOpen","handleDropdownPosition","useCallback","data","placement","startsWith","shouldShowSheet","isPhone","colorPicker_label","useTranslationBundle","colorPickerAriaLabel","colorPickerMainContent","_jsx","ColorPicker","height","undefined","maxWidth","width","inlineUserAssistanceFooter","length","FormFieldContext","Provider","isFocused","children","jsx","class","userAssistanceStyles","InlineUserAssistance","fieldLabel","contentTestId","dropdownContent","dropdownStyles","SectionedContent","paddingBlockEnd","paddingBlockStart","paddingInlineEnd","paddingInlineStart","footer","hasFocusTrap","main","role","Sheet","StickyPositioningDropdown","onPosition","sizeOptions","nonTabbableMode","isTabbable","getValidColorValue","isValidColorValue","ColorInputText","forwardRef","ariaDescribedBy","propIsDisabled","propIsReadonly","labelEdge","propLabelEdge","labelStartWidth","propLabelStartWidth","isRequiredShown","isRequired","placeholder","hasClearIcon","columnSpan","textAlign","propTextAlign","onInput","variant","propUserAssistanceDensity","ref","closePicker","colorIconActionHandler","dropdownCloseHandler","containerDropdownProps","focusLauncherOrRestoreAfterClose","iconRef","colorRef","enabledElementRef","isPickerSheet","setIsOpen","useRef","launcherRef","outsideMousedownRef","outsideMousedownTimerRef","shouldRestoreFocusOnCloseRef","focusSwatch","current","focus","focusLauncher","restoreLauncherFocusAfterClose","detail","reason","clearTimeout","setTimeout","useEffect","colorPickerDownHandler","triggerProps","useDownToggle","onToggle","useColorInputText","mainFieldRef","colorPickerDialogId","useId","inputColor_selectColor","colorIconAriaLabel","readonlyElementRef","isFormLayout","formIsReadonly","useFormContext","currentCommitValue","dispatch","useCurrentValueReducer","onInputAndDispatch","type","payload","onCommitAndDispatch","base","useInputBase","contentVariant","isFocusedOverride","isSelectable","defaultTextAlignForVariant","hasPalette","canOpenPicker","isMixedReadonly","shouldDisableSwatchPointerEvents","pickerValue","swatchValue","colorIconTestId","decorativeSwatch","TabbableModeContext","ColorSwatch","size","isTooltipDisabled","mixedReadonlyDecorativeSwatch","isButton","swatch","buttonBehavior","startContent","style","pointerEvents","hoverProps","isHover","useHover","onClickClearIcon","previousValue","onColorPickerCommit","v1","v2","updateDetail","maybeClearIcon","useClearIcon","clearIcon","ClearIcon","onClick","display","hasValue","formFieldContext","isEnabled","hasInsideLabel","hasRenderedStartContent","readonlyMainContent","ReadonlyTextFieldInput","inputProps","ariaLabel","labelProps","as","elementRef","formVariant","onBlur","onFocus","startContentToTextPadding","hasEmptyLabel","isEmbedded","isEmbeddedVariant","preserveDefaultStartPadding","preserveDefaultEndPadding","inputBaseProps","endContent","hasZeroStartMargin","insideLabelStartPadding","mainContent","TextFieldInput","hasEndContent","hasStartContent","inputRef","isMobile","onKeyDown","readonlyStartContent","_jsxs","_Fragment","EmbeddedInputBase","endContentVisualOffset","startContentVisualOffset","InputBase","displayName"],"mappings":"g3FAgDA,MAAMA,GAAqC,CACzCC,oBAAoB,EACpBC,qBAAqB,GAwBjBC,GAA+B,EACnCC,YACAC,gBACAC,aACAC,UACAC,iBACAC,iBACAC,KACAC,aACAC,SACAC,aACAC,QACAC,UACAC,WACAC,WACAC,SACAC,wBACAC,YAGA,MAAOC,EAAiBC,GAAoBC,EAAQA,UAAC,IAC9CC,EAAYC,GAAiBF,EAAQA,SAACX,GACvCc,EAAyBC,eAE5BC,IACDN,EAAiBM,EAAKC,UAAUC,WAAW,OAAO,GACjD,IAECN,IAAeZ,IACjBa,EAAcb,GACTA,GACHU,GAAiB,IAKrB,MAAMS,EAAkBC,EAAAA,WAElBC,kBAAEA,GAAsBC,EAAoBA,qBAAa,4BACzDC,EAAuBF,IAEvBG,EACJC,MAACC,EAAAA,YACC,CAAAC,OAASR,OAA2BS,EAAT,OAC3BxB,SAAUA,EAEVyB,SAAUV,EAAkB,YAASS,EACrCE,MAAM,OACNpC,WAAYA,EACZC,QAASA,EACTW,OAAQA,EACRE,MAAOA,IAILuB,GACJ/B,GACES,IAAmBU,GACpBpB,GACAE,KACAR,GAAiBG,GAAmBS,GAAYA,EAAS2B,OAAS,IACxC,cAA1BzB,GAAmE,WAA1BA,OAatCqB,EAZFH,MAACQ,EAAAA,iBAAiBC,SAAQ,CAAC1B,MAAO,CAAE2B,WAAW,GAAMC,SACnDX,EAAKY,IAAA,MAAA,CAAAC,MAAOC,gCACVd,EAAAA,IAACe,EAAAA,qBACC,CAAA/C,cAAeA,EACfgD,WAAYvC,EACZN,eAAgBA,EAChBC,eAAgBA,EAChBQ,SAAUA,EACVE,sBAAuBA,QAM3BmC,EAAgBpC,EAASA,GAAUa,EAAkB,SAAW,kBAAeS,EAI/Ee,EACJlB,EAAAA,IAAK,MAAA,CAAAa,MAAOM,EAAcA,eAAAR,SACxBX,EAAAA,IAACoB,EAAAA,iBACC,CAAA/C,GAAIA,EACJgD,gBAAgB,OAChBC,kBAAkB,OAClBC,iBAAiB,OACjBC,mBAAmB,OACP,aAAA1B,EACZ2B,OAAQnB,EACRoB,cAAc,EACdC,KAAM5B,EACN6B,KAAK,SACL/C,OAAQoC,MA4Bd,OAvBiBvB,EACfM,EAAAA,IAAC6B,EAAKA,MAAA,CAACtD,OAAQA,EAAQG,QAASA,EAAOiC,SACrCX,EAAAA,IAACoB,EAAAA,+BACatB,EACZzB,GAAIA,EACJoD,OAAQnB,EACRoB,cAAc,EACdC,KAAM5B,EACN6B,KAAK,SACL/C,OAAQoC,MAIZjB,EAAAA,IAAC8B,EAAyBA,0BACxB,CAAA/D,UAAWA,EACXQ,OAAQA,EACRG,QAASA,EACTqD,WAAY1C,EACZ2C,YAAarE,YACZuD,GAIU,EC/JXe,GAAkB,CAAEC,YAAY,GAIhCC,GAAsBpD,GACnBA,GAASqD,EAAiBA,kBAACrD,GAAUA,OAAuBoB,EAOxDkC,GAAiBC,EAAUA,YACtC,EAEI,mBAAoBC,EACpBtE,aACAC,UACAa,QACAT,WAAYkE,EACZhE,WAAYiE,EACZC,UAAWC,EACXC,gBAAiBC,EACjBC,mBAAkB,EAClBC,cAAa,EACbC,cACAC,eACAC,aACAC,UAAWC,EACXxE,WACAZ,gBACAG,iBACAC,iBACAK,QACAE,WACA0E,UACAxE,SACAyE,UACAxE,sBAAuByE,GAEzBC,KAEA,MAAMC,YACJA,EAAWC,uBACXA,EAAsBC,qBACtBA,EAAoBC,uBACpBA,EAAsBC,iCACtBA,EAAgCC,QAChCA,EAAOvF,OACPA,EACAwF,SAAUC,GC1DU,GAAGC,iBAAgB,GAAiB,CAAA,KAC5D,MAAO1F,EAAQ2F,GAAahF,EAAQA,UAAU,GACxC4E,EAAmCK,SAAqB,MACxDJ,EAAwCI,SAAyB,MACjEC,EAAcD,SAAuB,UAGrCE,EAAsBF,UAAgB,GACtCG,EAA2BH,EAAAA,SAC3BI,EAA+BJ,UAAgB,GAE/CK,EAAclF,EAAAA,aAAY,KAC9BwE,EAAQW,SAASC,OAAO,GACvB,IAEGC,EAAgBrF,EAAAA,aAAY,KACJ,UAAxB8E,EAAYK,QACdV,EAASU,SAASC,QAElBF,GACD,GACA,CAACA,IAEEf,EAAcnE,EAAAA,aAAY,KAC9B4E,GAAU,EAAM,GACf,IAEGU,EAAiCtF,EAAAA,aAAY,KACjDiF,EAA6BE,SAAU,CAAI,GAC1C,IAEGZ,EAAmCvE,EAAAA,aAAY,KAC/C2E,EACFW,IAEAD,GACD,GACA,CAACA,EAAeV,EAAeW,IAG5BlB,EAAyBpE,EAAAA,aAAuD,KAE/E+E,EAAoBI,UACvBL,EAAYK,QAAU,SACtBD,IACAN,GAAW/E,IAAgBA,KAE7BkF,EAAoBI,SAAU,CAAK,GAClC,CAACD,IAEEb,EAAuBrE,eAC1BuF,IAGuB,qBAAlBA,EAAOC,QACTT,EAAoBI,SAAU,EAC9BM,aAAaT,EAAyBG,SAGtCH,EAAyBG,QAAUO,YAAW,KAC5CX,EAAoBI,SAAU,CAAK,GAClC,MAEHZ,IAEFJ,GAAa,GAEf,CAACA,EAAaI,IAGhBoB,EAAAA,WAAU,IACD,KACLF,aAAaT,EAAyBG,QAAQ,GAE/C,IAEHQ,EAAAA,WAAU,MACH1G,GAAUgG,EAA6BE,UAC1CF,EAA6BE,SAAU,EACvCE,IACD,GACA,CAACA,EAAepG,IAInB,MAAM2G,EAAyB5F,EAAAA,aAAY,KACzC8E,EAAYK,QAAU,QACtBP,GAAU,EAAK,GACd,KAEKiB,aAAcvB,GAA2BwB,gBAAc,CAC7D7G,SACA8G,SAAUH,IAGZ,MAAO,CACLzB,cACAC,yBACAE,yBACAD,uBACAE,mCACAW,cACAV,UACAvF,SACAwF,WACD,ED9CKuB,CAAkB,CAAErB,cAAetE,EAAAA,YAEjC4F,EAAepB,SAAuB,MACtCqB,EAAsBC,EAAAA,SACtBC,uBAAEA,GAA2B7F,EAAoBA,qBAAa,4BAC9D8F,EAAqBD,IACrBE,EAAqBzB,SAAuB,OAC5C0B,aAAEA,EAAcrH,WAAYsH,GAAmBC,GAAcA,kBAE7DC,mBAAEA,EAAkBC,SAAEA,GAAaC,EAAAA,uBAAuB,CAAEnH,UAC5DoH,GAAqB7G,eACxBuF,IAECoB,EAAS,CAAEG,KAAM,QAASC,QAASxB,EAAO9F,QAC1CsE,IAAUwB,EAAO,GAEnB,CAACoB,EAAU5C,IAEPiD,GAAsBhH,eACzBuF,IAECoB,EAAS,CAAEG,KAAM,SAAUC,QAASxB,EAAO9F,QAC3CJ,IAAWkG,EAAO,GAEpB,CAACoB,EAAUtH,IAGP4H,GAAOC,GAAAA,aAAmE,CAC9ExI,gBACAuE,kBACAW,aACAuD,eAAgB,QAChBzC,oBACA7F,iBACAC,iBACAE,WAAYkE,EACZkE,oBAAmBnI,QAAgB4B,EACnC3B,WAAYiE,EACZK,kBACA6D,cAAc,EACdlI,QACAiE,UAAWC,EACXC,gBAAiBC,EACjB0C,eACA3G,WACAgH,qBACAzC,UAAWC,EACXtE,sBAAuByE,EACvBxE,QACAuE,aAGIhF,WACJA,GAAUE,WACVA,GAAUkE,UACVA,GAASS,UACTA,GAAYyD,6BAA2BtD,IACrCiD,GACEM,KAAe3I,EACf4I,GAAgBD,KAAevI,KAAeE,GAC9CuI,GACJvI,KAAiC,IAAnBiE,IAA4C,IAAjBoD,IAA4C,IAAnBC,EAC9DkB,IAAoCF,KAAkBtI,GACtDyI,GAAc9E,GAAmBpD,GACjCmI,GAAc/E,GAAmBpD,GACjCoI,GAAkBtI,EAASA,EAAS,kBAAesB,EAGnDiH,GACJpH,EAAAA,IAACqH,EAAmBA,oBAAC5G,SAAQ,CAAC1B,MAAOkD,GACnCtB,SAAAX,MAACsH,EAAAA,YACC,CAAAC,KAAK,KACLjJ,WAAYA,IAAcE,GAC1BgJ,mBAAmB,EACnB3I,OAAQsI,GACRpI,MAAOmI,OAMPO,GACJzH,EAAAA,IAACqH,EAAAA,oBAAoB5G,SAAQ,CAAC1B,MAAOkD,GAAetB,SAClDX,MAACsH,EAAWA,YAAA,CACVC,KAAK,KACLjJ,WAAYA,GACZoJ,UAAU,EACVlJ,YAAaF,IAAcE,GAC3BgJ,mBAAoBhJ,KAAe0I,GACnCrI,OAAQsI,GACRpI,MAAOmI,OAIPS,GAASZ,GAAe,GAEzBF,GAKH7G,MAACsH,EAAAA,YACC,CAAAC,KAAK,KAAI,gBACMT,GAAgBvI,OAAS4B,EACzB,gBAAA2G,GAAgB,cAAW3G,eAC9B2G,GAAgBnB,OAAqBxF,EACjDyH,eAAe,WACftJ,YAAawI,GACbU,mBAAoBV,GACpBY,UAAU,EACVlE,IAAKsD,GAAiBhD,OAAgC3D,EACtDtB,OAAQsI,GACRpI,MAAOmI,GACP7B,SAAUyB,GAAgBpD,OAAyBvD,IAjBxC,GAqBT0H,GACJ7H,EAAAA,IAAA,MAAA,CAAA,eACgB8G,SAAuB3G,EACrC2H,MAAOd,GAAmC,CAAEe,cAAe,aAAW5H,EAASQ,SAC9EgH,MAICK,WAAEA,GAAUC,QAAEA,IAAYC,EAAQA,SAAC,CAAE5J,WAAYE,IAAcF,KAAc,IAE7E6J,GAAmB7I,EAAAA,aAAY,KAEnC0E,EAAkBS,SAASC,aAGbvE,IAAVpB,GACJsE,IAAU,CAAE+E,cAAerJ,EAAOA,WAAOoB,GAAY,GACpD,CAAC6D,EAAmBX,EAAStE,IAE1BsJ,GAAsB/I,eACzBuF,IAIC,GAHAhB,IACAJ,IA5LoB6E,EA8LGvJ,EA9LUwJ,EA8LH1D,EAAO9F,MA9LYuJ,IAAOC,EA8LX,CAC3C,MAAMC,EAAe,CAAEJ,cAAerJ,EAAOA,MAAO8F,EAAO9F,OAC3DkH,EAAS,CAAEG,KAAM,SAAUC,QAASxB,EAAO9F,QAC3CsE,IAAUmF,GACV7J,IAAW6J,EACZ,CAnMkB,IAACF,EAAaC,CAmMhC,GAEH,CAAC9E,EAAawC,EAAUpC,EAAkClF,EAAU0E,EAAStE,IAGzE0J,GAAiBC,EAAAA,aAAa,CAClCC,UACE3I,EAAAA,IAAC4I,GAAAA,WAAUC,QAASV,GAAkBtJ,OAAQA,EAAS,GAAGA,mBAAqBsB,IAEjF2I,QAAS7F,EACT8F,SAAUxC,GAAKyC,iBAAiBD,SAChCrI,UAAW6F,GAAK7F,UAChBuI,WAAYzK,KAAeF,GAC3B2J,aAGIiB,QAA2B/I,IAAV1B,GAAqC,WAAdiE,GACxCyG,IAA2B3K,IAAcuI,GAkBzCqC,GAhBJpJ,MAACqJ,GAAAA,uBAAsB,CAAA,mBACH9C,GAAK+C,WAAW,oBACtB,aAAA/C,GAAKgD,UAAS,kBACThD,GAAKiD,WAAWnL,GACjCoL,GAAG,MACHC,WAAY9D,EACZ+D,YAAarG,EACbsG,OAAQrD,GAAK+C,WAAWM,OACxBC,QAAStD,GAAK+C,WAAWO,QACzBC,0BAA2BX,GAA0B,eAAYhJ,EACjEgD,UAAWA,GACXpE,MAAOA,EACPgL,cAAyB,KAAVtL,GAA8B,SAAdiE,GAC/BwG,eAAgBA,KAKdc,GAAaC,oBAAkB3G,GAC/B4G,GAA8BF,SAA+B7J,IAAjB0H,GAC5CsC,GAA4BH,SAAiC7J,IAAnBsI,GAgC1C2B,GAAiB,CACrB5G,MACA+C,QACA8D,WAAY5B,GACZ6B,oBAAoB,EACpBC,wBACErB,IAAkBC,GAA2B,eAAsBhJ,EACrEqK,YApCAxK,MAACyK,kBAAc,CAAA,oBACM3D,GAAgB,YAAS3G,kBAC7B2G,IAAiBvI,EAASiH,OAAsBrF,EAC9C,kBAAAoG,GAAKiD,WAAWnL,GACrB,aAAAkI,GAAKgD,UACjBvD,mBAAoBA,EACpB+D,cAAyB,KAAVtL,GAA8B,SAAdiE,GAC/BgI,gBAAiBjC,GACjBS,eAAgBA,GAChByB,kBAAmB9C,GACnB+C,SAAU5G,EACVjB,WAAYA,EACZC,YAAaA,EACbmH,0BAA2BA,GAC3BD,4BAA6BA,GAC7BtI,KAAMkF,GAAgB,gBAAa3G,EACnC2J,0BAA2BX,GAA0B,eAAYhJ,EACjEgD,UAAWA,GACXiD,KAAMyE,EAAAA,WAAa,YAAS1K,EAC5BpB,MAAOA,KACHwH,GAAK+C,WACM,gBAAAxC,GAAgBvI,OAAS4B,EAAS,gBAClC2G,GAAgB,cAAW3G,EAC1CxB,SAAU2H,GACVjD,QAAS8C,GACT2E,UAAWhE,GAAgBlD,EAAkC,eAAIzD,IAYnEiJ,uBACA2B,qBAAsBhE,GAAkBc,QAAe1H,EACvD0H,gBACAhJ,YACGmJ,IAGL,OACEgD,EAAAA,KAAAC,EAAAA,SAAA,CAAAtK,SAAA,CACGqJ,GACChK,EAAAA,IAACkL,GAAiBA,kBAAA,IACZd,GACJe,uBAAwB1C,GAAiB,gBAAatI,EACtDiL,yBAA0BvD,GAAe,gBAAa1H,IAGxDH,EAAAY,IAACyK,aAAS,IAAKjB,KAGhB7L,GAAUuI,IACT9G,EAAAA,IAAClC,GACC,CAAAC,UAAWwH,EACXvH,cAAeA,EACfG,eAAgBA,EAChBC,eAAgBA,EAChBC,GAAImH,EACJlH,WAAYA,GACZE,WAAYA,GACZD,OAAQA,EACRE,MAAOA,EACPC,QAASiF,EACThF,SAAU0J,GACVzJ,SAAUA,EACVC,OAAQA,EAASA,EAAS,oBAAiBsB,EAC3CrB,sBAAuByH,GAAKzH,sBAC5BC,MAAOkI,GACP/I,QAASA,EACTD,WAAYA,MAIlB,IAINoE,GAAeiJ,YAAc"}

package/amd/ColorPickerVariants.styles.css

@@ -1,4 +1,4 @@
-.ColorPickerVariants_multiVariantStyles__qkn10z0 {
+.ColorPickerVariants_multiVariantStyles__1derire0 {
   max-height: var(--maxHeight__1urfhqt3);
   width: var(--width__1urfhqt0);
   background-color: var(--oj-current-bg-color);

package/amd/ColorPickerVariants.styles2.css

@@ -1,4 +1,4 @@
-.ColorPickerVariants_multiVariantStyles__1derire0 {
+.ColorPickerVariants_multiVariantStyles__qkn10z0 {
   max-height: var(--maxHeight__1urfhqt3);
   width: var(--width__1urfhqt0);
   background-color: var(--oj-current-bg-color);

package/amd/ColorSwatchVariants.styles.css

@@ -1,4 +1,4 @@
-.ColorSwatchVariants_multiVariantStyles_compound_6__4c2pvbk {
+.ColorSwatchVariants_multiVariantStyles_compound_6__1r95vphk {
   background-color: transparent;
   cursor: default;
 }

package/amd/ColorSwatchVariants.styles2.css

@@ -1,4 +1,4 @@
-.ColorSwatchVariants_multiVariantStyles_compound_6__1r95vphk {
+.ColorSwatchVariants_multiVariantStyles_compound_6__4c2pvbk {
   background-color: transparent;
   cursor: default;
 }

package/amd/ContainerDiagram-5e392270.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './BaseDiagram-7845a7ae'], (function(a,e,i){"use strict";a.ContainerDiagram=function(a){return e.jsx(i.BaseDiagram,{...a,normalizeLinks:!1})}}));
+//# sourceMappingURL=ContainerDiagram-5e392270.js.map

package/amd/{ContainerDiagram-521f402a.js.map → ContainerDiagram-5e392270.js.map}

@@ -1 +1 @@
-{"version":3,"file":"ContainerDiagram-521f402a.js","sources":["../../src/UNSAFE_ContainerDiagram/ContainerDiagram.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport type { ContainerDiagramProps } from './diagram.types';\nimport {\n  DiagramLayoutOutput,\n  DiagramLinkData,\n  DiagramNodeData\n} from '#PRIVATE_BaseDiagram/diagram.types';\nimport { BaseDiagram } from '#PRIVATE_BaseDiagram';\n\n/**\n * Container Diagrams are used to display a set of nested nodes and the links between them.\n */\nexport function ContainerDiagram<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1, D1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n>(props: ContainerDiagramProps<K1, K2, D1, D2, L>) {\n  return <BaseDiagram {...props} normalizeLinks={false} />;\n}\n"],"names":["props","_jsx","BaseDiagram","normalizeLinks"],"mappings":"kHAkBM,SAMJA,GACA,OAAOC,EAAAA,IAACC,EAAAA,YAAgB,IAAAF,EAAOG,gBAAgB,GACjD"}
+{"version":3,"file":"ContainerDiagram-5e392270.js","sources":["../../src/UNSAFE_ContainerDiagram/ContainerDiagram.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport type { ContainerDiagramProps } from './diagram.types';\nimport {\n  DiagramLayoutOutput,\n  DiagramLinkData,\n  DiagramNodeData\n} from '#PRIVATE_BaseDiagram/diagram.types';\nimport { BaseDiagram } from '#PRIVATE_BaseDiagram';\n\n/**\n * Container Diagrams are used to display a set of nested nodes and the links between them.\n */\nexport function ContainerDiagram<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1, D1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n>(props: ContainerDiagramProps<K1, K2, D1, D2, L>) {\n  return <BaseDiagram {...props} normalizeLinks={false} />;\n}\n"],"names":["props","_jsx","BaseDiagram","normalizeLinks"],"mappings":"kHAkBM,SAMJA,GACA,OAAOC,EAAAA,IAACC,EAAAA,YAAgB,IAAAF,EAAOG,gBAAgB,GACjD"}

package/amd/ConveyorBeltVariants.styles.css

@@ -1,21 +1,21 @@
-.ConveyorBeltVariants_multiVariantStyles_orientation_horizontal__1j16ept0 {
+.ConveyorBeltVariants_multiVariantStyles_orientation_horizontal__1mqb5jc0 {
   --displayVar__1u3kg3i1: flex;
 }
-.ConveyorBeltVariants_multiVariantStyles_orientation_vertical__1j16ept1 {
+.ConveyorBeltVariants_multiVariantStyles_orientation_vertical__1mqb5jc1 {
   --displayVar__1u3kg3i1: inline-flex;
   flex-direction: column;
 }
-.ConveyorBeltVariants_multiVariantStyles_content_horizontal__1j16ept2 {
+.ConveyorBeltVariants_multiVariantStyles_content_horizontal__1mqb5jc2 {
   height: 100%;
 }
-.ConveyorBeltVariants_multiVariantStyles_content_vertical__1j16ept3 {
+.ConveyorBeltVariants_multiVariantStyles_content_vertical__1mqb5jc3 {
   height: auto;
 }
-.ConveyorBeltVariants_multiVariantStyles_overflow_horizontal__1j16ept4 {
+.ConveyorBeltVariants_multiVariantStyles_overflow_horizontal__1mqb5jc4 {
   overflow-x: scroll;
   overflow-y: hidden;
 }
-.ConveyorBeltVariants_multiVariantStyles_overflow_vertical__1j16ept5 {
+.ConveyorBeltVariants_multiVariantStyles_overflow_vertical__1mqb5jc5 {
   overflow-x: hidden;
   overflow-y: scroll;
 }

package/amd/ConveyorBeltVariants.styles2.css

@@ -1,21 +1,21 @@
-.ConveyorBeltVariants_multiVariantStyles_orientation_horizontal__1mqb5jc0 {
+.ConveyorBeltVariants_multiVariantStyles_orientation_horizontal__1j16ept0 {
   --displayVar__1u3kg3i1: flex;
 }
-.ConveyorBeltVariants_multiVariantStyles_orientation_vertical__1mqb5jc1 {
+.ConveyorBeltVariants_multiVariantStyles_orientation_vertical__1j16ept1 {
   --displayVar__1u3kg3i1: inline-flex;
   flex-direction: column;
 }
-.ConveyorBeltVariants_multiVariantStyles_content_horizontal__1mqb5jc2 {
+.ConveyorBeltVariants_multiVariantStyles_content_horizontal__1j16ept2 {
   height: 100%;
 }
-.ConveyorBeltVariants_multiVariantStyles_content_vertical__1mqb5jc3 {
+.ConveyorBeltVariants_multiVariantStyles_content_vertical__1j16ept3 {
   height: auto;
 }
-.ConveyorBeltVariants_multiVariantStyles_overflow_horizontal__1mqb5jc4 {
+.ConveyorBeltVariants_multiVariantStyles_overflow_horizontal__1j16ept4 {
   overflow-x: scroll;
   overflow-y: hidden;
 }
-.ConveyorBeltVariants_multiVariantStyles_overflow_vertical__1mqb5jc5 {
+.ConveyorBeltVariants_multiVariantStyles_overflow_vertical__1j16ept5 {
   overflow-x: hidden;
   overflow-y: scroll;
 }

package/amd/{Diagram-b73d20a3.js → Diagram-3ef5b038.js}

@@ -1,2 +1,2 @@
-define(['exports', 'preact/jsx-runtime', './BaseDiagram-295ed9cc'], (function(e,n,s){"use strict";e.Diagram=function(e){const{selectedIds:d,highlightedIds:t,onSelectionChange:i,onItemFocus:o,onItemHover:a,nodeRenderer:l,...r}=e,c=d&&{nodes:d.nodes,links:d.links},k=t&&{nodes:t.nodes,links:t.links},g=i?e=>{i({nodes:{ids:e.nodes?.ids??[],data:e.nodes?.data??[]},links:{ids:e.links?.ids??[],data:e.links?.data??[]}})}:void 0,m=a?e=>{e&&(!e||"node"!==e.type&&"link"!==e.type)||a(e)}:void 0,h=o?e=>{e&&(!e||"node"!==e.type&&"link"!==e.type)||o(e)}:void 0;return n.jsx(s.BaseDiagram,{...r,selectedIds:c,highlightedIds:k,onSelectionChange:g,onItemFocus:h,onItemHover:m,nodeRenderer:e=>l({data:e.data,state:e.state}),normalizeLinks:!0})}}));
-//# sourceMappingURL=Diagram-b73d20a3.js.map
+define(['exports', 'preact/jsx-runtime', './BaseDiagram-7845a7ae'], (function(e,n,s){"use strict";e.Diagram=function(e){const{selectedIds:d,highlightedIds:t,onSelectionChange:i,onItemFocus:o,onItemHover:a,nodeRenderer:l,...r}=e,c=d&&{nodes:d.nodes,links:d.links},k=t&&{nodes:t.nodes,links:t.links},g=i?e=>{i({nodes:{ids:e.nodes?.ids??[],data:e.nodes?.data??[]},links:{ids:e.links?.ids??[],data:e.links?.data??[]}})}:void 0,m=a?e=>{e&&(!e||"node"!==e.type&&"link"!==e.type)||a(e)}:void 0,h=o?e=>{e&&(!e||"node"!==e.type&&"link"!==e.type)||o(e)}:void 0;return n.jsx(s.BaseDiagram,{...r,selectedIds:c,highlightedIds:k,onSelectionChange:g,onItemFocus:h,onItemHover:m,nodeRenderer:e=>l({data:e.data,state:e.state}),normalizeLinks:!0})}}));
+//# sourceMappingURL=Diagram-3ef5b038.js.map

package/amd/{Diagram-b73d20a3.js.map → Diagram-3ef5b038.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Diagram-b73d20a3.js","sources":["../../src/UNSAFE_Diagram/Diagram.tsx"],"sourcesContent":["import {\n  DiagramProps,\n  DiagramLayoutOutput,\n  DiagramLinkData,\n  DiagramNodeData,\n  State\n} from './diagram.types';\nimport {\n  SelectedItemDetail,\n  ItemHoverDetail,\n  ItemFocusDetail,\n  CommonDiagramProps\n} from '#PRIVATE_BaseDiagram/diagram.types';\nimport { BaseDiagram } from '#PRIVATE_BaseDiagram';\nimport { ComponentChildren } from 'preact';\n\n// Re-alias or restrict as needed; you might not need to define new types\nexport type FlatDiagramProps<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n> = DiagramProps<K1, K2, D1, D2, L>;\n\n/**\n * Diagrams are used to display a set of nodes and the links between them.\n */\nexport function Diagram<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n>(props: FlatDiagramProps<K1, K2, D1, D2, L>) {\n  // Adapt or map only as needed. For a flat diagram:\n  const {\n    selectedIds,\n    highlightedIds,\n    onSelectionChange,\n    onItemFocus,\n    onItemHover,\n    nodeRenderer,\n    ...rest // all other props\n  } = props;\n\n  // Map selectedIds/highlightedIds to match BaseDiagram's prop signature\n  const mappedSelectedIds = selectedIds && {\n    nodes: selectedIds.nodes,\n    links: selectedIds.links\n    // NO promotedLinks for flat diagrams\n  };\n  const mappedHighlightedIds = highlightedIds && {\n    nodes: highlightedIds.nodes,\n    links: highlightedIds.links\n    // NO promotedLinks for flat diagrams\n  };\n\n  // Map event handlers to match BaseDiagram's more complex handler signatures, if needed\n  const mappedOnSelectionChange = onSelectionChange\n    ? (detail: SelectedItemDetail<K1, K2, D1, D2>) => {\n        // BaseDiagram's detail = { nodes: {id, data}, links: {id, data}, promotedLinks: {id[]} }\n        // FlatDiagram expects { nodes: K1[], links: K2[], nodeData: D1[], linkData: D2[] }\n        onSelectionChange({\n          nodes: {\n            ids: detail.nodes?.ids ?? [],\n            data: detail.nodes?.data ?? []\n          },\n          links: {\n            ids: detail.links?.ids ?? [],\n            data: detail.links?.data ?? []\n          }\n        });\n      }\n    : undefined;\n\n  const mappedOnItemHover = onItemHover\n    ? (detail: ItemHoverDetail<K1, K2, D1, D2>) => {\n        // Ignore promotedLink case for FlatDiagram\n        if (!detail || (detail && (detail.type === 'node' || detail.type === 'link'))) {\n          onItemHover(detail);\n        }\n      }\n    : undefined;\n\n  const mappedOnItemFocus = onItemFocus\n    ? (detail: ItemFocusDetail<K1, K2, D1, D2>) => {\n        // Ignore promotedLink case for FlatDiagram\n        if (!detail || (detail && (detail.type === 'node' || detail.type === 'link'))) {\n          onItemFocus(detail);\n        }\n      }\n    : undefined;\n\n  const baseDiagramNodeRenderer = (ctx: { data: D1; state: State; expander: ComponentChildren }) =>\n    nodeRenderer({\n      data: ctx.data,\n      state: ctx.state\n      // expander is ignored by flat nodeRenderer\n    });\n\n  return (\n    <BaseDiagram<K1, K2, D1, D2, L>\n      {...(rest as Omit<\n        CommonDiagramProps<K1, K2, D1, D2, L>,\n        | 'selectedIds'\n        | 'highlightedIds'\n        | 'onSelectionChange'\n        | 'onItemHover'\n        | 'onItemFocus'\n        | 'expanded'\n        | 'onExpandedChange'\n        | 'nodeRenderer'\n      >)}\n      selectedIds={mappedSelectedIds}\n      highlightedIds={mappedHighlightedIds}\n      onSelectionChange={mappedOnSelectionChange}\n      onItemFocus={mappedOnItemFocus}\n      onItemHover={mappedOnItemHover}\n      nodeRenderer={baseDiagramNodeRenderer}\n      normalizeLinks={true}\n    />\n  );\n}\n"],"names":["props","selectedIds","highlightedIds","onSelectionChange","onItemFocus","onItemHover","nodeRenderer","rest","mappedSelectedIds","nodes","links","mappedHighlightedIds","mappedOnSelectionChange","detail","ids","data","undefined","mappedOnItemHover","type","mappedOnItemFocus","_jsx","jsx","BaseDiagram","ctx","state","normalizeLinks"],"mappings":"yGA4BM,SAMJA,GAEA,MAAMC,YACJA,EAAWC,eACXA,EAAcC,kBACdA,EAAiBC,YACjBA,EAAWC,YACXA,EAAWC,aACXA,KACGC,GACDP,EAGEQ,EAAoBP,GAAe,CACvCQ,MAAOR,EAAYQ,MACnBC,MAAOT,EAAYS,OAGfC,EAAuBT,GAAkB,CAC7CO,MAAOP,EAAeO,MACtBC,MAAOR,EAAeQ,OAKlBE,EAA0BT,EAC3BU,IAGCV,EAAkB,CAChBM,MAAO,CACLK,IAAKD,EAAOJ,OAAOK,KAAO,GAC1BC,KAAMF,EAAOJ,OAAOM,MAAQ,IAE9BL,MAAO,CACLI,IAAKD,EAAOH,OAAOI,KAAO,GAC1BC,KAAMF,EAAOH,OAAOK,MAAQ,KAE9B,OAEJC,EAEEC,EAAoBZ,EACrBQ,IAEMA,KAAWA,GAA2B,SAAhBA,EAAOK,MAAmC,SAAhBL,EAAOK,OAC1Db,EAAYQ,EACb,OAEHG,EAEEG,EAAoBf,EACrBS,IAEMA,KAAWA,GAA2B,SAAhBA,EAAOK,MAAmC,SAAhBL,EAAOK,OAC1Dd,EAAYS,EACb,OAEHG,EASJ,OACEI,EAAAC,IAACC,EAAWA,YAAA,IACLf,EAWLN,YAAaO,EACbN,eAAgBS,EAChBR,kBAAmBS,EACnBR,YAAae,EACbd,YAAaY,EACbX,aAzB6BiB,GAC/BjB,EAAa,CACXS,KAAMQ,EAAIR,KACVS,MAAOD,EAAIC,QAuBXC,gBAAgB,GAGtB"}
+{"version":3,"file":"Diagram-3ef5b038.js","sources":["../../src/UNSAFE_Diagram/Diagram.tsx"],"sourcesContent":["import {\n  DiagramProps,\n  DiagramLayoutOutput,\n  DiagramLinkData,\n  DiagramNodeData,\n  State\n} from './diagram.types';\nimport {\n  SelectedItemDetail,\n  ItemHoverDetail,\n  ItemFocusDetail,\n  CommonDiagramProps\n} from '#PRIVATE_BaseDiagram/diagram.types';\nimport { BaseDiagram } from '#PRIVATE_BaseDiagram';\nimport { ComponentChildren } from 'preact';\n\n// Re-alias or restrict as needed; you might not need to define new types\nexport type FlatDiagramProps<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n> = DiagramProps<K1, K2, D1, D2, L>;\n\n/**\n * Diagrams are used to display a set of nodes and the links between them.\n */\nexport function Diagram<\n  K1 extends string | number,\n  K2 extends string | number,\n  D1 extends DiagramNodeData<K1>,\n  D2 extends DiagramLinkData<K2, K1>,\n  L extends DiagramLayoutOutput<K1, K2>\n>(props: FlatDiagramProps<K1, K2, D1, D2, L>) {\n  // Adapt or map only as needed. For a flat diagram:\n  const {\n    selectedIds,\n    highlightedIds,\n    onSelectionChange,\n    onItemFocus,\n    onItemHover,\n    nodeRenderer,\n    ...rest // all other props\n  } = props;\n\n  // Map selectedIds/highlightedIds to match BaseDiagram's prop signature\n  const mappedSelectedIds = selectedIds && {\n    nodes: selectedIds.nodes,\n    links: selectedIds.links\n    // NO promotedLinks for flat diagrams\n  };\n  const mappedHighlightedIds = highlightedIds && {\n    nodes: highlightedIds.nodes,\n    links: highlightedIds.links\n    // NO promotedLinks for flat diagrams\n  };\n\n  // Map event handlers to match BaseDiagram's more complex handler signatures, if needed\n  const mappedOnSelectionChange = onSelectionChange\n    ? (detail: SelectedItemDetail<K1, K2, D1, D2>) => {\n        // BaseDiagram's detail = { nodes: {id, data}, links: {id, data}, promotedLinks: {id[]} }\n        // FlatDiagram expects { nodes: K1[], links: K2[], nodeData: D1[], linkData: D2[] }\n        onSelectionChange({\n          nodes: {\n            ids: detail.nodes?.ids ?? [],\n            data: detail.nodes?.data ?? []\n          },\n          links: {\n            ids: detail.links?.ids ?? [],\n            data: detail.links?.data ?? []\n          }\n        });\n      }\n    : undefined;\n\n  const mappedOnItemHover = onItemHover\n    ? (detail: ItemHoverDetail<K1, K2, D1, D2>) => {\n        // Ignore promotedLink case for FlatDiagram\n        if (!detail || (detail && (detail.type === 'node' || detail.type === 'link'))) {\n          onItemHover(detail);\n        }\n      }\n    : undefined;\n\n  const mappedOnItemFocus = onItemFocus\n    ? (detail: ItemFocusDetail<K1, K2, D1, D2>) => {\n        // Ignore promotedLink case for FlatDiagram\n        if (!detail || (detail && (detail.type === 'node' || detail.type === 'link'))) {\n          onItemFocus(detail);\n        }\n      }\n    : undefined;\n\n  const baseDiagramNodeRenderer = (ctx: { data: D1; state: State; expander: ComponentChildren }) =>\n    nodeRenderer({\n      data: ctx.data,\n      state: ctx.state\n      // expander is ignored by flat nodeRenderer\n    });\n\n  return (\n    <BaseDiagram<K1, K2, D1, D2, L>\n      {...(rest as Omit<\n        CommonDiagramProps<K1, K2, D1, D2, L>,\n        | 'selectedIds'\n        | 'highlightedIds'\n        | 'onSelectionChange'\n        | 'onItemHover'\n        | 'onItemFocus'\n        | 'expanded'\n        | 'onExpandedChange'\n        | 'nodeRenderer'\n      >)}\n      selectedIds={mappedSelectedIds}\n      highlightedIds={mappedHighlightedIds}\n      onSelectionChange={mappedOnSelectionChange}\n      onItemFocus={mappedOnItemFocus}\n      onItemHover={mappedOnItemHover}\n      nodeRenderer={baseDiagramNodeRenderer}\n      normalizeLinks={true}\n    />\n  );\n}\n"],"names":["props","selectedIds","highlightedIds","onSelectionChange","onItemFocus","onItemHover","nodeRenderer","rest","mappedSelectedIds","nodes","links","mappedHighlightedIds","mappedOnSelectionChange","detail","ids","data","undefined","mappedOnItemHover","type","mappedOnItemFocus","_jsx","jsx","BaseDiagram","ctx","state","normalizeLinks"],"mappings":"yGA4BM,SAMJA,GAEA,MAAMC,YACJA,EAAWC,eACXA,EAAcC,kBACdA,EAAiBC,YACjBA,EAAWC,YACXA,EAAWC,aACXA,KACGC,GACDP,EAGEQ,EAAoBP,GAAe,CACvCQ,MAAOR,EAAYQ,MACnBC,MAAOT,EAAYS,OAGfC,EAAuBT,GAAkB,CAC7CO,MAAOP,EAAeO,MACtBC,MAAOR,EAAeQ,OAKlBE,EAA0BT,EAC3BU,IAGCV,EAAkB,CAChBM,MAAO,CACLK,IAAKD,EAAOJ,OAAOK,KAAO,GAC1BC,KAAMF,EAAOJ,OAAOM,MAAQ,IAE9BL,MAAO,CACLI,IAAKD,EAAOH,OAAOI,KAAO,GAC1BC,KAAMF,EAAOH,OAAOK,MAAQ,KAE9B,OAEJC,EAEEC,EAAoBZ,EACrBQ,IAEMA,KAAWA,GAA2B,SAAhBA,EAAOK,MAAmC,SAAhBL,EAAOK,OAC1Db,EAAYQ,EACb,OAEHG,EAEEG,EAAoBf,EACrBS,IAEMA,KAAWA,GAA2B,SAAhBA,EAAOK,MAAmC,SAAhBL,EAAOK,OAC1Dd,EAAYS,EACb,OAEHG,EASJ,OACEI,EAAAC,IAACC,EAAWA,YAAA,IACLf,EAWLN,YAAaO,EACbN,eAAgBS,EAChBR,kBAAmBS,EACnBR,YAAae,EACbd,YAAaY,EACbX,aAzB6BiB,GAC/BjB,EAAa,CACXS,KAAMQ,EAAIR,KACVS,MAAOD,EAAIC,QAuBXC,gBAAgB,GAGtB"}

package/amd/DiagramStyles.styles2.css

@@ -1,42 +1,48 @@
-.DiagramStyles_outerStyles__1ep4hfg0 {
+.DiagramStyles_outerStyles__18tpn7n0 {
   position: relative;
   overflow: hidden;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
 }
-.DiagramStyles_outerStyles__1ep4hfg0:focus-visible {
+.DiagramStyles_outerStyles__18tpn7n0:focus-visible {
   outline-width: 0px;
 }
-.DiagramStyles_layerStyles__1ep4hfg1 {
+.DiagramStyles_layerStyles__18tpn7n1 {
   display: inline-block;
   pointer-events: none;
   position: absolute;
   top: 0;
   left: 0;
 }
-.DiagramStyles_nodeStyles__1ep4hfg2 {
+.DiagramStyles_nodeStyles__18tpn7n2 {
   position: absolute;
   pointer-events: auto;
 }
-.DiagramStyles_linkStyles__1ep4hfg3 {
+.DiagramStyles_linkStyles__18tpn7n3 {
   pointer-events: auto;
 }
-.DiagramStyles_labelStyle__1ep4hfg4 {
+.DiagramStyles_labelStyle__18tpn7n4 {
   position: absolute;
 }
-.DiagramStyles_labelBorderStyle__1ep4hfg5 {
+.DiagramStyles_buttonStyle__18tpn7n5 {
+  position: absolute;
+}
+.DiagramStyles_labelBorderStyle__18tpn7n6 {
   border-style: solid;
 }
-.DiagramStyles_dimmedItemStyle__1ep4hfg6 {
+.DiagramStyles_childContentStyle__18tpn7n7 {
+  position: absolute;
+}
+.DiagramStyles_dimmedItemStyle__18tpn7n8 {
   opacity: var(--oj-c-dimmed-opacity);
 }
-.DiagramStyles_panZoomStyles__1ep4hfg7 {
+.DiagramStyles_panZoomStyles__18tpn7n9 {
   transform-origin: top left;
   position: relative;
   pointer-events: none;
 }
-.DiagramStyles_dimensionStyle__1ep4hfg8 {
+.DiagramStyles_dimensionStyle__18tpn7na {
   width: 100%;
   height: calc(140 * var(--oj-c-size-units, 0.25rem));
 }

package/amd/DiagramStyles.styles3.css

@@ -1,48 +1,42 @@
-.DiagramStyles_outerStyles__18tpn7n0 {
+.DiagramStyles_outerStyles__1ep4hfg0 {
   position: relative;
   overflow: hidden;
   -webkit-user-select: none;
      -moz-user-select: none;
           user-select: none;
 }
-.DiagramStyles_outerStyles__18tpn7n0:focus-visible {
+.DiagramStyles_outerStyles__1ep4hfg0:focus-visible {
   outline-width: 0px;
 }
-.DiagramStyles_layerStyles__18tpn7n1 {
+.DiagramStyles_layerStyles__1ep4hfg1 {
   display: inline-block;
   pointer-events: none;
   position: absolute;
   top: 0;
   left: 0;
 }
-.DiagramStyles_nodeStyles__18tpn7n2 {
+.DiagramStyles_nodeStyles__1ep4hfg2 {
   position: absolute;
   pointer-events: auto;
 }
-.DiagramStyles_linkStyles__18tpn7n3 {
+.DiagramStyles_linkStyles__1ep4hfg3 {
   pointer-events: auto;
 }
-.DiagramStyles_labelStyle__18tpn7n4 {
+.DiagramStyles_labelStyle__1ep4hfg4 {
   position: absolute;
 }
-.DiagramStyles_buttonStyle__18tpn7n5 {
-  position: absolute;
-}
-.DiagramStyles_labelBorderStyle__18tpn7n6 {
+.DiagramStyles_labelBorderStyle__1ep4hfg5 {
   border-style: solid;
 }
-.DiagramStyles_childContentStyle__18tpn7n7 {
-  position: absolute;
-}
-.DiagramStyles_dimmedItemStyle__18tpn7n8 {
+.DiagramStyles_dimmedItemStyle__1ep4hfg6 {
   opacity: var(--oj-c-dimmed-opacity);
 }
-.DiagramStyles_panZoomStyles__18tpn7n9 {
+.DiagramStyles_panZoomStyles__1ep4hfg7 {
   transform-origin: top left;
   position: relative;
   pointer-events: none;
 }
-.DiagramStyles_dimensionStyle__18tpn7na {
+.DiagramStyles_dimensionStyle__1ep4hfg8 {
   width: 100%;
   height: calc(140 * var(--oj-c-size-units, 0.25rem));
 }

package/amd/DrawerPopupVariants.styles.css

@@ -1,26 +1,26 @@
-.DrawerPopupVariants_multiVariantStyles_placement_left__ajbar40 {
+.DrawerPopupVariants_multiVariantStyles_placement_left__idav9r0 {
   box-shadow: 0.3rem 0 1.5rem rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   top: 0;
   bottom: 0;
   left: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_placement_right__ajbar41 {
+.DrawerPopupVariants_multiVariantStyles_placement_right__idav9r1 {
   box-shadow: -0.3rem 0 1.5rem rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   top: 0;
   bottom: 0;
   right: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_placement_bottom__ajbar42 {
+.DrawerPopupVariants_multiVariantStyles_placement_bottom__idav9r2 {
   box-shadow: 0 -0.3rem 0.3rem 0 rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   bottom: 0;
   left: 0;
   right: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_overlay__ajbar45 {
+.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_overlay__idav9r5 {
   max-width: 90vw;
   min-width: 320px;
 }
-.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_fullOverlay__ajbar46 {
+.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_fullOverlay__idav9r6 {
   width: 100%;
   max-width: 100%;
 }

package/amd/DrawerPopupVariants.styles2.css

@@ -1,26 +1,26 @@
-.DrawerPopupVariants_multiVariantStyles_placement_left__idav9r0 {
+.DrawerPopupVariants_multiVariantStyles_placement_left__ajbar40 {
   box-shadow: 0.3rem 0 1.5rem rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   top: 0;
   bottom: 0;
   left: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_placement_right__idav9r1 {
+.DrawerPopupVariants_multiVariantStyles_placement_right__ajbar41 {
   box-shadow: -0.3rem 0 1.5rem rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   top: 0;
   bottom: 0;
   right: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_placement_bottom__idav9r2 {
+.DrawerPopupVariants_multiVariantStyles_placement_bottom__ajbar42 {
   box-shadow: 0 -0.3rem 0.3rem 0 rgba(var(--oj-c-boxshadow-shadowcolor), 0.05);
   bottom: 0;
   left: 0;
   right: 0;
 }
-.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_overlay__idav9r5 {
+.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_overlay__ajbar45 {
   max-width: 90vw;
   min-width: 320px;
 }
-.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_fullOverlay__idav9r6 {
+.DrawerPopupVariants_multiVariantStyles_displayModeHorizontal_fullOverlay__ajbar46 {
   width: 100%;
   max-width: 100%;
 }

package/amd/Expander-4b1f2445.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './EmbeddedIconButton-2630c4ed', './ChevronDown-a84ee7af', './ChevronRight-aa249c4c', './ChevronUp-6a0c35b2', './ExpandableContext-9f96f74d', './useExpandableContext-17add3fc', './useTranslationBundle-1be27606', 'preact/hooks', './unsafeDomAccess-602c5dde', './clientHints-dabdb010'], (function(e,n,t,a,o,d,s,r,i,l,c,x){"use strict";const u=(e,n)=>n?e.expander_collapsible():e.expander_expandable(),p=(e,t)=>"default"===e?t?n.jsx(a.SvgChevronDown,{size:"6x"}):n.jsx(o.SvgChevronRight,{size:"6x"}):t?n.jsx(d.SvgChevronUp,{size:"6x"}):n.jsx(a.SvgChevronDown,{size:"6x"});e.Expander=function({testId:e}){const{isExpanded:a,onToggle:o,variant:d="default"}=r.useExpandableContext(),{platform:s}=x.getClientHints(),f="ios"===s||"android"===s,v=i.useTranslationBundle("@oracle/oraclejet-preact"),C=l.useRef(null);return n.jsx(t.EmbeddedIconButton,{ref:C,testId:e,"aria-hidden":!f,"aria-label":f?u(v,a):void 0,onAction:()=>{o({target:C.current?.[c.UNSAFE_DOM_ACCESS]??null})},children:p(d,a)})}}));
+//# sourceMappingURL=Expander-4b1f2445.js.map

package/amd/{Expander-150fa95e.js.map → Expander-4b1f2445.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Expander-150fa95e.js","sources":["../../src/UNSAFE_Expander/Expander.tsx"],"sourcesContent":["import { EmbeddedIconButton } from '#PRIVATE_EmbeddedIconButton';\nimport { ChevronDown } from '#UNSAFE_RedwoodIcons/ChevronDown';\nimport { ChevronRight } from '#UNSAFE_RedwoodIcons/ChevronRight';\nimport { ChevronUp } from '#UNSAFE_RedwoodIcons/ChevronUp';\nimport { useExpandableContext } from '#hooks/UNSAFE_useExpandableContext';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { BundleType } from '#resources/nls/bundle';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport type { ComponentChild } from 'preact';\nimport { ElementRef } from 'preact/compat';\nimport { useRef } from 'preact/hooks';\nimport { UNSAFE_DOM_ACCESS } from '#utils/UNSAFE_unsafeDomAccess';\nimport { getClientHints } from '#utils/PRIVATE_clientHints';\n\ntype ButtonHandle = ElementRef<typeof EmbeddedIconButton>;\n\n/**\n * Props for the Expander component\n */\ntype Props = TestIdProps;\n\n/**\n * The Expander component renders expand and collapse icons in collections.\n * Expander is intended for use within collection components such as TreeView and HierarchicalList.\n * It should not be presented as a standalone control.\n */\nexport function Expander({ testId }: Props) {\n  const { isExpanded, onToggle, variant = 'default' } = useExpandableContext();\n\n  const { platform } = getClientHints();\n  const isMobile = platform === 'ios' || platform === 'android';\n  const translations = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n\n  const ref = useRef<ButtonHandle>(null);\n  const handleAction = () => {\n    onToggle({ target: ref.current?.[UNSAFE_DOM_ACCESS] ?? null });\n  };\n\n  return (\n    <EmbeddedIconButton\n      ref={ref}\n      testId={testId}\n      aria-hidden={!isMobile}\n      aria-label={isMobile ? getAccessibleLabel(translations, isExpanded) : undefined}\n      onAction={handleAction}>\n      {renderIcons(variant, isExpanded)}\n    </EmbeddedIconButton>\n  );\n}\n\nconst getAccessibleLabel = (translations: BundleType, isExpanded: boolean): string => {\n  return isExpanded ? translations.expander_collapsible() : translations.expander_expandable();\n};\n\n/**\n * Helper to render expand/collapse icons based on the variant.\n */\nconst renderIcons = (\n  variant: 'default' | 'navigationList',\n  isExpanded: boolean\n): ComponentChild => {\n  if (variant === 'default') {\n    return isExpanded ? <ChevronDown size=\"6x\" /> : <ChevronRight size=\"6x\" />;\n  }\n\n  return isExpanded ? <ChevronUp size=\"6x\" /> : <ChevronDown size=\"6x\" />;\n};\n"],"names":["getAccessibleLabel","translations","isExpanded","expander_collapsible","expander_expandable","renderIcons","variant","_jsx","ChevronDown","size","ChevronRight","ChevronUp","testId","onToggle","useExpandableContext","platform","getClientHints","isMobile","useTranslationBundle","ref","useRef","EmbeddedIconButton","undefined","onAction","target","current","UNSAFE_DOM_ACCESS","children"],"mappings":"0WAkDA,MAAMA,EAAqB,CAACC,EAA0BC,IAC7CA,EAAaD,EAAaE,uBAAyBF,EAAaG,sBAMnEC,EAAc,CAClBC,EACAJ,IAEgB,YAAZI,EACKJ,EAAaK,MAACC,iBAAW,CAACC,KAAK,OAAUF,EAAAA,IAACG,EAAAA,iBAAaD,KAAK,OAG9DP,EAAaK,MAACI,eAAS,CAACF,KAAK,OAAUF,EAAAA,IAACC,EAAAA,gBAAYC,KAAK,kBAvClD,UAASG,OAAEA,IACzB,MAAMV,WAAEA,EAAUW,SAAEA,EAAQP,QAAEA,EAAU,WAAcQ,EAAAA,wBAEhDC,SAAEA,GAAaC,EAAAA,iBACfC,EAAwB,QAAbF,GAAmC,YAAbA,EACjCd,EAAeiB,uBAAiC,4BAEhDC,EAAMC,SAAqB,MAKjC,OACEb,MAACc,EAAAA,oBACCF,IAAKA,EACLP,OAAQA,EAAM,eACAK,EAAQ,aACVA,EAAWjB,EAAmBC,EAAcC,QAAcoB,EACtEC,SAViB,KACnBV,EAAS,CAAEW,OAAQL,EAAIM,UAAUC,sBAAsB,MAAO,EAU3DC,SAAAtB,EAAYC,EAASJ,IAG5B"}
+{"version":3,"file":"Expander-4b1f2445.js","sources":["../../src/UNSAFE_Expander/Expander.tsx"],"sourcesContent":["import { EmbeddedIconButton } from '#PRIVATE_EmbeddedIconButton';\nimport { ChevronDown } from '#UNSAFE_RedwoodIcons/ChevronDown';\nimport { ChevronRight } from '#UNSAFE_RedwoodIcons/ChevronRight';\nimport { ChevronUp } from '#UNSAFE_RedwoodIcons/ChevronUp';\nimport { useExpandableContext } from '#hooks/UNSAFE_useExpandableContext';\nimport { useTranslationBundle } from '#hooks/UNSAFE_useTranslationBundle';\nimport { BundleType } from '#resources/nls/bundle';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport type { ComponentChild } from 'preact';\nimport { ElementRef } from 'preact/compat';\nimport { useRef } from 'preact/hooks';\nimport { UNSAFE_DOM_ACCESS } from '#utils/UNSAFE_unsafeDomAccess';\nimport { getClientHints } from '#utils/PRIVATE_clientHints';\n\ntype ButtonHandle = ElementRef<typeof EmbeddedIconButton>;\n\n/**\n * Props for the Expander component\n */\ntype Props = TestIdProps;\n\n/**\n * The Expander component renders expand and collapse icons in collections.\n * Expander is intended for use within collection components such as TreeView and HierarchicalList.\n * It should not be presented as a standalone control.\n */\nexport function Expander({ testId }: Props) {\n  const { isExpanded, onToggle, variant = 'default' } = useExpandableContext();\n\n  const { platform } = getClientHints();\n  const isMobile = platform === 'ios' || platform === 'android';\n  const translations = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n\n  const ref = useRef<ButtonHandle>(null);\n  const handleAction = () => {\n    onToggle({ target: ref.current?.[UNSAFE_DOM_ACCESS] ?? null });\n  };\n\n  return (\n    <EmbeddedIconButton\n      ref={ref}\n      testId={testId}\n      aria-hidden={!isMobile}\n      aria-label={isMobile ? getAccessibleLabel(translations, isExpanded) : undefined}\n      onAction={handleAction}>\n      {renderIcons(variant, isExpanded)}\n    </EmbeddedIconButton>\n  );\n}\n\nconst getAccessibleLabel = (translations: BundleType, isExpanded: boolean): string => {\n  return isExpanded ? translations.expander_collapsible() : translations.expander_expandable();\n};\n\n/**\n * Helper to render expand/collapse icons based on the variant.\n */\nconst renderIcons = (\n  variant: 'default' | 'navigationList',\n  isExpanded: boolean\n): ComponentChild => {\n  if (variant === 'default') {\n    return isExpanded ? <ChevronDown size=\"6x\" /> : <ChevronRight size=\"6x\" />;\n  }\n\n  return isExpanded ? <ChevronUp size=\"6x\" /> : <ChevronDown size=\"6x\" />;\n};\n"],"names":["getAccessibleLabel","translations","isExpanded","expander_collapsible","expander_expandable","renderIcons","variant","_jsx","ChevronDown","size","ChevronRight","ChevronUp","testId","onToggle","useExpandableContext","platform","getClientHints","isMobile","useTranslationBundle","ref","useRef","EmbeddedIconButton","undefined","onAction","target","current","UNSAFE_DOM_ACCESS","children"],"mappings":"0WAkDA,MAAMA,EAAqB,CAACC,EAA0BC,IAC7CA,EAAaD,EAAaE,uBAAyBF,EAAaG,sBAMnEC,EAAc,CAClBC,EACAJ,IAEgB,YAAZI,EACKJ,EAAaK,MAACC,iBAAW,CAACC,KAAK,OAAUF,EAAAA,IAACG,EAAAA,iBAAaD,KAAK,OAG9DP,EAAaK,MAACI,eAAS,CAACF,KAAK,OAAUF,EAAAA,IAACC,EAAAA,gBAAYC,KAAK,kBAvClD,UAASG,OAAEA,IACzB,MAAMV,WAAEA,EAAUW,SAAEA,EAAQP,QAAEA,EAAU,WAAcQ,EAAAA,wBAEhDC,SAAEA,GAAaC,EAAAA,iBACfC,EAAwB,QAAbF,GAAmC,YAAbA,EACjCd,EAAeiB,uBAAiC,4BAEhDC,EAAMC,SAAqB,MAKjC,OACEb,MAACc,EAAAA,oBACCF,IAAKA,EACLP,OAAQA,EAAM,eACAK,EAAQ,aACVA,EAAWjB,EAAmBC,EAAcC,QAAcoB,EACtEC,SAViB,KACnBV,EAAS,CAAEW,OAAQL,EAAIM,UAAUC,sBAAsB,MAAO,EAU3DC,SAAAtB,EAAYC,EAASJ,IAG5B"}