@oracle/oraclejet-preact 20.0.3 → 20.1.0

package/es/TimeComponentCanvas2D-cfb0066d.js

@@ -4,20 +4,20 @@ import { layersStackStyles, overlayControlsContainerStyles, panZoomLayoutStyles,
 import { c as classNames } from './classNames-4e12b00d.js';
 import { useState, useRef, useLayoutEffect } from 'preact/hooks';
 import { T as TrackResizeContainer } from './TrackResizeContainer-3d7b18b7.js';
-import { F as Flex } from './Flex-03129963.js';
-import { B as BaseButton } from './BaseButton-41068c85.js';
+import { F as Flex } from './Flex-fc483125.js';
+import { B as BaseButton } from './BaseButton-243d200f.js';
 import { B as ButtonLabelLayout } from './ButtonLabelLayout-1631c997.js';
-import { u as useTooltip } from './useTooltip-94af94d4.js';
+import { u as useTooltip } from './useTooltip-ab739df0.js';
 import './logger-c92f309c.js';
-import './LayerHost-7931b424.js';
+import './LayerHost-3cf255a6.js';
 import 'preact/compat';
 import './TooltipContentStyles.styles.css';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.styles.css';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js';
-import './tooltipUtils-af0abd38.js';
+import './tooltipUtils-90fb656f.js';
 import { S as SvgPlus } from './Plus-b62e474b.js';
 import { a as getFormatParse } from './getFormatParse-6d6fdd4d.js';
-import { u as useTranslationBundle } from './useTranslationBundle-4822502f.js';
+import { u as useTranslationBundle } from './useTranslationBundle-bc6e0896.js';
 import { S as SvgMinus } from './Minus-6bd44b40.js';
 import { u as usePointerGesture } from './usePointerGesture-ddf231cc.js';
 import { toChildArray } from 'preact';

package/es/ToggleButton-65f5d293.js

@@ -0,0 +1,28 @@
+/* @oracle/oraclejet-preact: undefined */
+import { jsx } from 'preact/jsx-runtime';
+import { forwardRef } from 'preact/compat';
+import { B as BaseButton } from './BaseButton-243d200f.js';
+import { u as useToggleAction } from './useToggleAction-fc0f5399.js';
+import { m as mergeProps } from './mergeProps-88ea8306.js';
+import { a as toggleStyling } from './toggleButtonUtils-75e3d781.js';
+import { p as processGlobals } from './buttonUtils-55fb1df7.js';
+import { T as ToggleButtonLabel } from './ToggleButtonLabel-bf4e1599.js';
+
+/**
+ * ToggleButtons direct users to toggle a state with a single tap, click, or keystroke.
+ */
+const ToggleButton = forwardRef(({ startIcon, endIcon, variant = 'outlined', size = 'md', isDisabled = false, isSelected = false, onToggle, display = 'all', autofocus, testId, label, 'aria-label': accessibleLabel, 'aria-describedby': ariaDescribedBy, width, ...props }, ref) => {
+    const { globalEventProps } = processGlobals(props);
+    const labelOnly = (!startIcon && !endIcon) || display === 'label';
+    const { triggerProps } = useToggleAction({
+        isDisabled: isDisabled,
+        onToggle: onToggle
+    });
+    const styling = toggleStyling('auto', isSelected, false, false, variant === 'outlined', undefined, labelOnly, false, true);
+    const ariaProps = { 'aria-describedby': ariaDescribedBy };
+    return (jsx(BaseButton, { ...mergeProps(triggerProps, globalEventProps, ariaProps), ref: ref, variant: variant, isDisabled: isDisabled, size: size, width: width, "aria-pressed": isSelected, autofocus: autofocus, styling: styling, "aria-label": accessibleLabel ?? label, testId: testId, ...globalEventProps, children: jsx(ToggleButtonLabel, { onAction: () => onToggle?.({ value: isSelected }), label: label, size: size, isDisabled: isDisabled, display: display, startIcon: startIcon, endIcon: endIcon }) }));
+});
+ToggleButton.displayName = 'ToggleButton';
+
+export { ToggleButton as T };
+//# sourceMappingURL=ToggleButton-65f5d293.js.map

package/es/ToggleButton-65f5d293.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleButton-65f5d293.js","sources":["../../src/UNSAFE_ToggleButton/ToggleButton.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChildren } from 'preact';\nimport { forwardRef, ForwardedRef, ElementRef } from 'preact/compat';\n\nimport { BaseButton } from '#UNSAFE_BaseButton';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { useToggleAction, ToggleDetail } from '#hooks/UNSAFE_useToggleAction';\nimport { TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport { toggleStyling, processGlobals } from '#utils/UNSAFE_buttonUtils';\nimport { ToggleButtonLabel } from '#UNSAFE_ToggleButtonLabel';\nimport type { ButtonIntrinsicProps } from '#utils/UNSAFE_buttonUtils';\n\ntype ButtonHandle = ElementRef<typeof BaseButton>;\n\ntype WidthProps = Pick<DimensionProps, 'width'>;\n\nexport type ToggleButtonProps = ButtonIntrinsicProps &\n  WidthProps &\n  TestIdProps & {\n    /**\n     * The startIcon is the button's start icon. This should not vary depending on state.\n     */\n    startIcon?: ComponentChildren;\n\n    /**\n     * The endIcon is the button's end icon. This should not vary depending on state.\n     */\n    endIcon?: ComponentChildren;\n\n    /**\n     * Specifies that the togglebutton element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * label - togglebutton label, used for accessibility if no override\n     */\n    label: string;\n\n    /**\n     * aria-label - override label for accessibility\n     */\n    'aria-label'?: string;\n\n    /**\n     * Indicates in what states the togglebutton has chrome (background and border).\n     *     \"borderless\"': \"Borderless togglebuttons are a more prominent variation. Borderless\n     * togglebuttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined togglebuttons are salient, but lighter weight than\n     * solid togglebuttons. Outlined togglebuttons are useful for secondary actions.\",\n     */\n    variant?: 'outlined' | 'borderless';\n\n    /**\n     * The size indicates how large the togglebutton is rendered.\n     */\n    size?: 'sm' | 'md' | 'lg';\n\n    /**\n     * Specifies if the toggle button is selected\n     */\n    isSelected?: boolean;\n\n    /**\n     * Property that triggers a callback immediately when toggle happens and value of isSelected property should be updated\n     */\n    onToggle?: (details: ToggleDetail) => void;\n\n    /**\n     * Display indicates whether only the label or all elements should be rendered by the togglebutton.\n     */\n    display?: 'label' | 'all';\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the togglebutton.\n     */\n    'aria-describedby'?: string;\n  };\n\n/**\n * ToggleButtons direct users to toggle a state with a single tap, click, or keystroke.\n */\nexport const ToggleButton = forwardRef(\n  (\n    {\n      startIcon,\n      endIcon,\n      variant = 'outlined',\n      size = 'md',\n      isDisabled = false,\n      isSelected = false,\n      onToggle,\n      display = 'all',\n      autofocus,\n      testId,\n      label,\n      'aria-label': accessibleLabel,\n      'aria-describedby': ariaDescribedBy,\n      width,\n      ...props\n    }: ToggleButtonProps,\n    ref: ForwardedRef<ButtonHandle>\n  ) => {\n    const { globalEventProps } = processGlobals(props);\n\n    const labelOnly = (!startIcon && !endIcon) || display === 'label';\n    const { triggerProps } = useToggleAction({\n      isDisabled: isDisabled,\n      onToggle: onToggle\n    });\n\n    const styling = toggleStyling(\n      'auto',\n      isSelected,\n      false,\n      false,\n      variant === 'outlined',\n      undefined,\n      labelOnly,\n      false,\n      true\n    );\n\n    const ariaProps = { 'aria-describedby': ariaDescribedBy };\n\n    return (\n      <BaseButton\n        {...mergeProps(triggerProps, globalEventProps, ariaProps)}\n        ref={ref}\n        variant={variant}\n        isDisabled={isDisabled}\n        size={size}\n        width={width}\n        aria-pressed={isSelected}\n        autofocus={autofocus}\n        styling={styling}\n        aria-label={accessibleLabel ?? label}\n        testId={testId}\n        {...globalEventProps}>\n        <ToggleButtonLabel\n          onAction={() => onToggle?.({ value: isSelected })}\n          label={label}\n          size={size}\n          isDisabled={isDisabled}\n          display={display}\n          startIcon={startIcon}\n          endIcon={endIcon}></ToggleButtonLabel>\n      </BaseButton>\n    );\n  }\n);\n\nToggleButton.displayName = 'ToggleButton';\n"],"names":["_jsx"],"mappings":";;;;;;;;;;AAuFA;;AAEG;AACU,MAAA,YAAY,GAAG,UAAU,CACpC,CACE,EACE,SAAS,EACT,OAAO,EACP,OAAO,GAAG,UAAU,EACpB,IAAI,GAAG,IAAI,EACX,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,QAAQ,EACR,OAAO,GAAG,KAAK,EACf,SAAS,EACT,MAAM,EACN,KAAK,EACL,YAAY,EAAE,eAAe,EAC7B,kBAAkB,EAAE,eAAe,EACnC,KAAK,EACL,GAAG,KAAK,EACU,EACpB,GAA+B,KAC7B;IACF,MAAM,EAAE,gBAAgB,EAAE,GAAG,cAAc,CAAC,KAAK,CAAC,CAAC;AAEnD,IAAA,MAAM,SAAS,GAAG,CAAC,CAAC,SAAS,IAAI,CAAC,OAAO,KAAK,OAAO,KAAK,OAAO,CAAC;AAClE,IAAA,MAAM,EAAE,YAAY,EAAE,GAAG,eAAe,CAAC;AACvC,QAAA,UAAU,EAAE,UAAU;AACtB,QAAA,QAAQ,EAAE,QAAQ;AACnB,KAAA,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,aAAa,CAC3B,MAAM,EACN,UAAU,EACV,KAAK,EACL,KAAK,EACL,OAAO,KAAK,UAAU,EACtB,SAAS,EACT,SAAS,EACT,KAAK,EACL,IAAI,CACL,CAAC;AAEF,IAAA,MAAM,SAAS,GAAG,EAAE,kBAAkB,EAAE,eAAe,EAAE,CAAC;IAE1D,QACEA,IAAC,UAAU,EAAA,EAAA,GACL,UAAU,CAAC,YAAY,EAAE,gBAAgB,EAAE,SAAS,CAAC,EACzD,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,OAAO,EAChB,UAAU,EAAE,UAAU,EACtB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,kBACE,UAAU,EACxB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EACJ,YAAA,EAAA,eAAe,IAAI,KAAK,EACpC,MAAM,EAAE,MAAM,EAAA,GACV,gBAAgB,EACpB,QAAA,EAAAA,GAAA,CAAC,iBAAiB,EAChB,EAAA,QAAQ,EAAE,MAAM,QAAQ,GAAG,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,EACjD,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,OAAO,EAAA,CAAsB,EAC7B,CAAA,EACb;AACJ,CAAC,EACD;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc;;;;"}

package/es/ToggleButtonLabel-bf4e1599.js

@@ -0,0 +1,75 @@
+/* @oracle/oraclejet-preact: undefined */
+import { jsx, jsxs, Fragment } from 'preact/jsx-runtime';
+import { Fragment as Fragment$1 } from 'preact';
+import { B as ButtonLabelLayout } from './ButtonLabelLayout-1631c997.js';
+import { u as useId } from './useId-03dbfdf0.js';
+import { H as HiddenAccessible } from './HiddenAccessible-61197e7c.js';
+import { u as usePress } from './usePress-051f5adb.js';
+import { styles } from './UNSAFE_BaseButton/themes/BaseButtonStyles.css.js';
+import { c as classNames } from './classNames-4e12b00d.js';
+import { m as mergeProps } from './mergeProps-88ea8306.js';
+import './TabbableModeContext-7d8ad946.js';
+import { u as useTabbableMode } from './useTabbableMode-090ed4b5.js';
+import { g as getClientHints } from './clientHints-a42b510c.js';
+
+const ToggleButtonInput = ({ isDisabled, isChecked, isSwitch, inputName, inputType, value, inputId, startIcon, endIcon, display, onAction, size, label, onBlur, onFocus, onMouseEnter, onMouseLeave, onTouchEnd, onTouchStart }) => {
+    const { pressProps } = usePress((e) => {
+        onAction?.(e);
+    });
+    const { tabbableModeProps } = useTabbableMode(isDisabled);
+    const onKeyDown = (event) => {
+        const key = event.key;
+        switch (key) {
+            case 'ArrowLeft':
+            case 'ArrowRight': {
+                event.preventDefault();
+                break;
+            }
+        }
+    };
+    const keyProps = { onKeyDown };
+    const mergedProps = mergeProps(pressProps, tabbableModeProps, keyProps);
+    const inputElement = (jsx(HiddenAccessible, { children: jsx("input", { ...(isSwitch ? { role: 'switch' } : {}), type: inputType, checked: isChecked, name: inputName, value: value, disabled: isDisabled, ...mergedProps, id: inputId }) }));
+    const isLabel = (!startIcon && !endIcon) || display === 'label';
+    const isIcon = display === 'icons';
+    const wrapperClasses = classNames([
+        styles.inputLabel,
+        !isIcon ? styles.labelSizes[size ?? 'md'] : undefined,
+        !isLabel && styles.min
+    ]);
+    // For input types, must use labels and modify approach for button
+    const content = isLabel ? (jsxs("div", { class: styles.inputLabel, children: [inputElement, label] })) : (jsxs(Fragment, { children: [inputElement, jsx(ButtonLabelLayout, { display: display, startIcon: startIcon, endIcon: endIcon, size: size, children: label }), isIcon ? jsx(HiddenAccessible, { children: label }) : undefined] }));
+    // JET-75329: For iOS with VoiceOver, we want to apply the role to
+    // the label for proper swiping focus and label announcement.
+    const isIos = getClientHints().platform === 'ios';
+    const labelRole = isSwitch ? 'switch' : inputType;
+    return (jsx("label", { ...(isIos
+            ? {
+                role: labelRole,
+                'aria-checked': isChecked,
+                'aria-disabled': isDisabled
+            }
+            : {}), for: inputId, class: wrapperClasses, onBlur: onBlur, onFocus: onFocus, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onTouchEnd: onTouchEnd, onTouchStart: onTouchStart, children: content }));
+};
+ToggleButtonInput.displayName = 'ToggleButtonInput';
+
+const ToggleButtonLabel = ({ isDisabled, isSelected, isToggle = true, inputName, inputType, value, startIcon, endIcon, display, onAction, size, label, onBlur, onFocus, onMouseEnter, onMouseLeave, onTouchEnd, onTouchStart }) => {
+    const isInput = inputType === 'radio' || inputType === 'checkbox';
+    const labelOnly = (!startIcon && !endIcon) || display === 'label';
+    // preact useId fails to be unique on storybook pages, each canvas starts from scratch
+    //const childId = useId() + '-' + (isInput ? inputName : '');
+    const childId = useId();
+    const inputElement = isInput ? (jsx(ToggleButtonInput, { isSwitch: !isToggle, onAction: onAction, isChecked: isSelected, inputType: inputType, inputName: inputName, value: value, inputId: childId, isDisabled: isDisabled, label: label, display: display, startIcon: startIcon, endIcon: endIcon, size: size, onBlur: onBlur, onFocus: onFocus, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onTouchEnd: onTouchEnd, onTouchStart: onTouchStart })) : undefined;
+    if (!isInput) {
+        // For standalone toggles, no need for labels
+        return labelOnly ? (jsx(Fragment$1, { children: label })) : (jsx(ButtonLabelLayout, { display: display, startIcon: startIcon, endIcon: endIcon, size: size, children: label }));
+    }
+    else {
+        // For input types, must use labels and modify approach for button
+        return jsx(Fragment$1, { children: inputElement });
+    }
+};
+ToggleButtonLabel.displayName = 'ToggleButtonLabel';
+
+export { ToggleButtonLabel as T };
+//# sourceMappingURL=ToggleButtonLabel-bf4e1599.js.map

package/es/ToggleButtonLabel-bf4e1599.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ToggleButtonLabel-bf4e1599.js","sources":["../../src/UNSAFE_ToggleButtonLabel/ToggleButtonInput.tsx","../../src/UNSAFE_ToggleButtonLabel/ToggleButtonLabel.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Vers.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport type { ComponentChildren, JSX } from 'preact';\nimport { HiddenAccessible } from '#UNSAFE_HiddenAccessible';\nimport { usePress } from '#hooks/UNSAFE_usePress';\nimport { ButtonLabelLayout } from '#UNSAFE_ButtonLabelLayout';\nimport { styles } from '#UNSAFE_BaseButton/themes/BaseButtonStyles.css';\nimport { classNames } from '#/utils/UNSAFE_classNames';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport type { UnpackSignals } from '@oracle/oraclejet-internal-utilities/attributeUtils';\n\nimport { useTabbableMode } from '../hooks/UNSAFE_useTabbableMode';\nimport { getClientHints } from '#utils/PRIVATE_clientHints';\n\ntype IntrinsicProps = Pick<\n  UnpackSignals<JSX.HTMLAttributes<HTMLElement>>,\n  | 'autofocus'\n  | 'onBlur'\n  | 'onFocus'\n  | 'onMouseEnter'\n  | 'onMouseLeave'\n  | 'onTouchEnd'\n  | 'onTouchStart'\n>;\n\nexport type Props = IntrinsicProps & {\n  /**\n   * Specifies that the button separator should be rendered disabled.\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies that the input is intended for use in a switch button\n   */\n  isSwitch?: boolean;\n\n  /**\n   * Specifies if input is checked or not, controlled pattern\n   */\n  isChecked?: boolean;\n\n  /**\n   * onAction is invoked when then input is pressed\n   */\n  onAction?: (event: Event) => void;\n\n  /**\n   * inputType specifies what type of input is needed\n   */\n  inputType?: 'radio' | 'checkbox';\n\n  /**\n   * inputName is the name of the radio or checkbox\n   */\n  inputName?: string;\n\n  /**\n   * value is the value of the radio or checkbox\n   */\n  value?: string;\n\n  /**\n   * inputId is the id used by the label\n   */\n  inputId?: string;\n\n  /**\n   * The startIcon is the button's start icon.\n   */\n  startIcon?: ComponentChildren;\n\n  /**\n   * The endIcon is the button's end icon.\n   */\n  endIcon?: ComponentChildren;\n\n  /**\n   * Display indicates whether only the label or all elements should be rendered by the togglebutton.\n   */\n  display?: 'label' | 'all' | 'icons';\n\n  /**\n   * The size indicates how large the togglebutton is rendered.\n   */\n  size?: 'sm' | 'md' | 'lg';\n\n  /**\n   * label - togglebutton label\n   */\n  label?: string;\n};\n\nexport const ToggleButtonInput = ({\n  isDisabled,\n  isChecked,\n  isSwitch,\n  inputName,\n  inputType,\n  value,\n  inputId,\n  startIcon,\n  endIcon,\n  display,\n  onAction,\n  size,\n  label,\n  onBlur,\n  onFocus,\n  onMouseEnter,\n  onMouseLeave,\n  onTouchEnd,\n  onTouchStart\n}: Props) => {\n  const { pressProps } = usePress((e) => {\n    onAction?.(e);\n  });\n  const { tabbableModeProps } = useTabbableMode(isDisabled);\n\n  const onKeyDown = (event: KeyboardEvent) => {\n    const key = event.key;\n    switch (key) {\n      case 'ArrowLeft':\n      case 'ArrowRight': {\n        event.preventDefault();\n        break;\n      }\n    }\n  };\n  const keyProps = { onKeyDown };\n\n  const mergedProps = mergeProps(pressProps, tabbableModeProps, keyProps);\n  const inputElement = (\n    <HiddenAccessible>\n      <input\n        {...(isSwitch ? { role: 'switch' } : {})}\n        type={inputType}\n        checked={isChecked}\n        name={inputName}\n        value={value}\n        disabled={isDisabled}\n        {...mergedProps}\n        id={inputId}></input>\n    </HiddenAccessible>\n  );\n\n  const isLabel = (!startIcon && !endIcon) || display === 'label';\n\n  const isIcon = display === 'icons';\n\n  const wrapperClasses = classNames([\n    styles.inputLabel,\n    !isIcon ? styles.labelSizes[size ?? 'md'] : undefined,\n    !isLabel && styles.min\n  ]);\n\n  // For input types, must use labels and modify approach for button\n  const content = isLabel ? (\n    <div class={styles.inputLabel}>\n      {inputElement}\n      {label}\n    </div>\n  ) : (\n    <>\n      {inputElement}\n      <ButtonLabelLayout display={display} startIcon={startIcon} endIcon={endIcon} size={size}>\n        {label}\n      </ButtonLabelLayout>\n      {isIcon ? <HiddenAccessible>{label}</HiddenAccessible> : undefined}\n    </>\n  );\n\n  // JET-75329: For iOS with VoiceOver, we want to apply the role to\n  // the label for proper swiping focus and label announcement.\n  const isIos = getClientHints().platform === 'ios';\n  const labelRole = isSwitch ? 'switch' : inputType;\n\n  return (\n    <label\n      {...(isIos\n        ? {\n            role: labelRole,\n            'aria-checked': isChecked,\n            'aria-disabled': isDisabled\n          }\n        : {})}\n      for={inputId}\n      class={wrapperClasses}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      onTouchEnd={onTouchEnd}\n      onTouchStart={onTouchStart}>\n      {content}\n    </label>\n  );\n};\n\nToggleButtonInput.displayName = 'ToggleButtonInput';\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Vers.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { type ComponentChildren, Fragment, type JSX } from 'preact';\nimport { ButtonLabelLayout } from '#UNSAFE_ButtonLabelLayout';\nimport { InputTypes, ToggleButtonTypes } from '#utils/UNSAFE_buttonUtils/toggle.types';\nimport { useId } from '#hooks/UNSAFE_useId';\nimport { ToggleButtonInput } from './ToggleButtonInput';\nimport type { UnpackSignals } from '@oracle/oraclejet-internal-utilities/attributeUtils';\n\ntype IntrinsicProps = Pick<\n  UnpackSignals<JSX.HTMLAttributes<HTMLElement>>,\n  | 'autofocus'\n  | 'onBlur'\n  | 'onFocus'\n  | 'onMouseEnter'\n  | 'onMouseLeave'\n  | 'onTouchEnd'\n  | 'onTouchStart'\n>;\n\nexport type ToggleButtonLabelProps = IntrinsicProps & {\n  /**\n   * Specifies that the button separator should be rendered disabled.\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies if button is selected\n   */\n  isSelected?: boolean;\n\n  /**\n   * Specifies if button is toggle\n   */\n  isToggle?: boolean;\n\n  /**\n   * onAction is invoked when then input is pressed\n   */\n  onAction?: (event: Event) => void;\n\n  /**\n   * inputType specifies what type of input is needed\n   */\n  inputType?: ToggleButtonTypes;\n\n  /**\n   * inputName is the name of the radio or checkbox\n   */\n  inputName?: string;\n\n  /**\n   *  value is the value of the radio or checkbox\n   */\n  value?: string;\n\n  /**\n   * The startIcon is the button's start icon.\n   */\n  startIcon?: ComponentChildren;\n\n  /**\n   * The endIcon is the button's end icon.\n   */\n  endIcon?: ComponentChildren;\n\n  /**\n   * Display indicates whether only the label or all elements should be rendered by the togglebutton.\n   */\n  display?: 'label' | 'all' | 'icons';\n\n  /**\n   * The size indicates how large the togglebutton is rendered.\n   */\n  size?: 'sm' | 'md' | 'lg';\n\n  /**\n   * label - togglebutton label\n   */\n  label?: string;\n};\n\nexport const ToggleButtonLabel = ({\n  isDisabled,\n  isSelected,\n  isToggle = true,\n  inputName,\n  inputType,\n  value,\n  startIcon,\n  endIcon,\n  display,\n  onAction,\n  size,\n  label,\n  onBlur,\n  onFocus,\n  onMouseEnter,\n  onMouseLeave,\n  onTouchEnd,\n  onTouchStart\n}: ToggleButtonLabelProps) => {\n  const isInput = inputType === 'radio' || inputType === 'checkbox';\n  const labelOnly = (!startIcon && !endIcon) || display === 'label';\n\n  // preact useId fails to be unique on storybook pages, each canvas starts from scratch\n  //const childId = useId() + '-' + (isInput ? inputName : '');\n  const childId = useId();\n\n  const inputElement = isInput ? (\n    <ToggleButtonInput\n      isSwitch={!isToggle}\n      onAction={onAction}\n      isChecked={isSelected}\n      inputType={inputType as InputTypes}\n      inputName={inputName}\n      value={value}\n      inputId={childId}\n      isDisabled={isDisabled}\n      label={label}\n      display={display}\n      startIcon={startIcon}\n      endIcon={endIcon}\n      size={size}\n      onBlur={onBlur}\n      onFocus={onFocus}\n      onMouseEnter={onMouseEnter}\n      onMouseLeave={onMouseLeave}\n      onTouchEnd={onTouchEnd}\n      onTouchStart={onTouchStart}\n    />\n  ) : undefined;\n\n  if (!isInput) {\n    // For standalone toggles, no need for labels\n    return labelOnly ? (\n      <Fragment>{label}</Fragment>\n    ) : (\n      <ButtonLabelLayout display={display} startIcon={startIcon} endIcon={endIcon} size={size}>\n        {label}\n      </ButtonLabelLayout>\n    );\n  } else {\n    // For input types, must use labels and modify approach for button\n    return <Fragment>{inputElement}</Fragment>;\n  }\n};\n\nToggleButtonLabel.displayName = 'ToggleButtonLabel';\n"],"names":["_jsx","_jsxs","_Fragment","Fragment"],"mappings":"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"}

package/es/TrainVariants.styles.css

@@ -1,29 +1,29 @@
-.TrainVariants_multiVariantStyles_needsEventsHover_isNeedsEventsHover__ty5ef5p:not(:active) {
+.TrainVariants_multiVariantStyles_needsEventsHover_isNeedsEventsHover__szao47p:not(:active) {
   cursor: pointer;
   background-color: var(--stepBgColorHover__wmjnh6m);
 }
-.TrainVariants_multiVariantStyles_stepIconNeedsEventsHover_isNeedsEventsHover__ty5ef5t:not(:active) {
+.TrainVariants_multiVariantStyles_stepIconNeedsEventsHover_isNeedsEventsHover__szao47t:not(:active) {
   cursor: pointer;
   border-color: var(--buttonBorderColorHover__wmjnh6k);
   color: var(--buttonTextColorHover__wmjnh6l);
   background-color: var(--buttonBgColorHover__wmjnh6j);
 }
-.TrainVariants_multiVariantStyles_stepLabelNeedsEventsHover_isNeedsEventsHover__ty5ef5x:not(:active) {
+.TrainVariants_multiVariantStyles_stepLabelNeedsEventsHover_isNeedsEventsHover__szao47x:not(:active) {
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
 }
 @media (hover: hover) {
-  .TrainVariants_multiVariantStyles_pseudoHover_isPseudoHover__ty5ef5r:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_pseudoHover_isPseudoHover__szao47r:hover:not(:active) {
     cursor: pointer;
     background-color: var(--stepBgColorHover__wmjnh6m);
   }
-  .TrainVariants_multiVariantStyles_stepIconPseudoHover_isPseudoHover__ty5ef5v:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_stepIconPseudoHover_isPseudoHover__szao47v:hover:not(:active) {
     cursor: pointer;
     border-color: var(--buttonBorderColorHover__wmjnh6k);
     color: var(--buttonTextColorHover__wmjnh6l);
     background-color: var(--buttonBgColorHover__wmjnh6j);
   }
-  .TrainVariants_multiVariantStyles_stepLabelPseudoHover_isPseudoHover__ty5ef5z:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_stepLabelPseudoHover_isPseudoHover__szao47z:hover:not(:active) {
     -webkit-text-decoration-line: underline;
             text-decoration-line: underline;
   }

package/es/TrainVariants.styles2.css

@@ -1,29 +1,29 @@
-.TrainVariants_multiVariantStyles_needsEventsHover_isNeedsEventsHover__szao47p:not(:active) {
+.TrainVariants_multiVariantStyles_needsEventsHover_isNeedsEventsHover__ty5ef5p:not(:active) {
   cursor: pointer;
   background-color: var(--stepBgColorHover__wmjnh6m);
 }
-.TrainVariants_multiVariantStyles_stepIconNeedsEventsHover_isNeedsEventsHover__szao47t:not(:active) {
+.TrainVariants_multiVariantStyles_stepIconNeedsEventsHover_isNeedsEventsHover__ty5ef5t:not(:active) {
   cursor: pointer;
   border-color: var(--buttonBorderColorHover__wmjnh6k);
   color: var(--buttonTextColorHover__wmjnh6l);
   background-color: var(--buttonBgColorHover__wmjnh6j);
 }
-.TrainVariants_multiVariantStyles_stepLabelNeedsEventsHover_isNeedsEventsHover__szao47x:not(:active) {
+.TrainVariants_multiVariantStyles_stepLabelNeedsEventsHover_isNeedsEventsHover__ty5ef5x:not(:active) {
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
 }
 @media (hover: hover) {
-  .TrainVariants_multiVariantStyles_pseudoHover_isPseudoHover__szao47r:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_pseudoHover_isPseudoHover__ty5ef5r:hover:not(:active) {
     cursor: pointer;
     background-color: var(--stepBgColorHover__wmjnh6m);
   }
-  .TrainVariants_multiVariantStyles_stepIconPseudoHover_isPseudoHover__szao47v:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_stepIconPseudoHover_isPseudoHover__ty5ef5v:hover:not(:active) {
     cursor: pointer;
     border-color: var(--buttonBorderColorHover__wmjnh6k);
     color: var(--buttonTextColorHover__wmjnh6l);
     background-color: var(--buttonBgColorHover__wmjnh6j);
   }
-  .TrainVariants_multiVariantStyles_stepLabelPseudoHover_isPseudoHover__szao47z:hover:not(:active) {
+  .TrainVariants_multiVariantStyles_stepLabelPseudoHover_isPseudoHover__ty5ef5z:hover:not(:active) {
     -webkit-text-decoration-line: underline;
             text-decoration-line: underline;
   }

package/es/TruncatingLink-6aaf40b9.js

@@ -0,0 +1,93 @@
+/* @oracle/oraclejet-preact: undefined */
+import { jsxs, Fragment, jsx } from 'preact/jsx-runtime';
+import { c as classNames } from './classNames-4e12b00d.js';
+import { u as usePressClick } from './usePressClick-945cc43b.js';
+import { u as useComponentTheme } from './useComponentTheme-d2f9e47f.js';
+import { u as useInteractionStyle } from './useInteractionStyle-99e32c23.js';
+import { LinkRedwoodTheme } from './UNSAFE_Link/themes/redwood/LinkTheme.js';
+import './TabbableModeContext-7d8ad946.js';
+import { u as useTabbableMode } from './useTabbableMode-090ed4b5.js';
+import { u as useTestId } from './useTestId-ab1bede6.js';
+import { u as useDetectTruncation } from './useDetectTruncation-071767c7.js';
+import { u as useTooltip } from './useTooltip-ab739df0.js';
+import { useMemo } from 'preact/hooks';
+import { m as mergeProps } from './mergeProps-88ea8306.js';
+import './LayerHost-3cf255a6.js';
+import 'preact/compat';
+import './TooltipContentStyles.styles.css';
+import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.styles.css';
+import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js';
+import './tooltipUtils-90fb656f.js';
+import { g as getClientHints } from './clientHints-a42b510c.js';
+import { T as Text } from './Text-834eb35e.js';
+import { u as useMiddleEllipsis } from './useMiddleEllipsis-b073ca6b.js';
+import { m as mergeRefs } from './refUtils-76275c69.js';
+import { H as HiddenAccessible } from './HiddenAccessible-61197e7c.js';
+
+const noop$1 = () => { };
+/**
+ * MiddleTruncatingLink component creates a hyperlink that shows a tooltip and ellipsis in middle of text when truncated.
+ */
+function MiddleTruncatingLink({ href, variant, placement = 'standalone', target, testId, 'aria-describedby': ariaDescribedBy, 'aria-label': accessibleLabel, 'aria-labelledby': ariaLabelledBy, onClick, isDisabled, children }) {
+    const { detectTruncationProps, isTextTruncated } = useDetectTruncation();
+    const { interactionProps, applyPseudoHoverStyle, applyHoverStyle } = useInteractionStyle();
+    const clientHints = getClientHints();
+    const { classes } = useComponentTheme(LinkRedwoodTheme, {
+        needsEventsHover: applyHoverStyle ? 'isNeedsEventsHover' : 'notNeedsEventsHover',
+        pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',
+        variant,
+        placement,
+        disabled: isDisabled ? 'isDisabled' : 'notDisabled',
+        truncatingLinkStyles: placement !== 'embedded' ? 'styles' : 'none',
+        truncatingLinkWhiteSpace: placement !== 'embedded' ? 'nowrap' : 'none',
+        safariStyles: clientHints.browser === 'safari' ? 'isSafari' : 'notSafari'
+    });
+    const { isTabbable } = useTabbableMode();
+    const linkClasses = classNames([classes]);
+    const { pressProps } = usePressClick(onClick ?? noop$1);
+    const testIdProps = useTestId(testId);
+    const shownText = children || href;
+    const { ref: middleElRef, truncatedText } = useMiddleEllipsis(shownText);
+    const displayText = useMemo(() => (placement !== 'embedded' && truncatedText !== shownText ? truncatedText : shownText), [placement, truncatedText, shownText]);
+    const { tooltipContent, tooltipProps } = useTooltip({
+        text: shownText,
+        isDisabled: !(isTextTruncated || truncatedText !== shownText) || isDisabled
+    });
+    const { 'aria-describedby': notNeeded, ...validTooltipProps } = tooltipProps; //remove aria-describedby to prevent screen readers reading the same text multiple times
+    const mergedRef = useMemo(() => mergeRefs(detectTruncationProps.ref, middleElRef), [detectTruncationProps.ref, middleElRef]);
+    return (jsxs(Fragment, { children: [jsxs("a", { ref: mergedRef, ...mergeProps(validTooltipProps, interactionProps, testIdProps, !isDisabled ? pressProps : {}), tabIndex: isTabbable && !isDisabled ? 0 : -1, href: !isDisabled ? href : undefined, "aria-describedby": ariaDescribedBy, "aria-label": accessibleLabel, "aria-labelledby": ariaLabelledBy, target: target, class: linkClasses, children: [jsx("span", { role: "presentation", "aria-hidden": true, children: jsx(Text, { size: "md", variant: "inherit", children: displayText }) }), jsx(HiddenAccessible, { children: shownText })] }), tooltipContent] }));
+}
+
+const noop = () => { };
+/**
+ * TruncatingLink component creates a hyperlink that shows a tooltip and ellipsis at the end or middle of text when truncated.
+ */
+function TruncatingLink({ href, variant, placement = 'standalone', target, testId, 'aria-describedby': ariaDescribedBy, 'aria-label': accessibleLabel, 'aria-labelledby': ariaLabelledBy, onClick, isDisabled, truncation, lineClamp, children }) {
+    const { detectTruncationProps, isTextTruncated } = useDetectTruncation();
+    const { interactionProps, applyPseudoHoverStyle, applyHoverStyle } = useInteractionStyle();
+    const clientHints = getClientHints();
+    const { classes } = useComponentTheme(LinkRedwoodTheme, {
+        needsEventsHover: applyHoverStyle ? 'isNeedsEventsHover' : 'notNeedsEventsHover',
+        pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',
+        variant,
+        placement,
+        disabled: isDisabled ? 'isDisabled' : 'notDisabled',
+        truncatingLinkStyles: placement !== 'embedded' ? 'styles' : 'none',
+        truncatingLinkWhiteSpace: placement !== 'embedded' && !lineClamp ? 'nowrap' : 'none',
+        safariStyles: clientHints.browser === 'safari' ? 'isSafari' : 'notSafari'
+    });
+    const { isTabbable } = useTabbableMode();
+    const linkClasses = classNames([classes]);
+    const { pressProps } = usePressClick(onClick ?? noop);
+    const testIdProps = useTestId(testId);
+    const shownText = children || href;
+    const { tooltipContent, tooltipProps } = useTooltip({
+        text: shownText,
+        isDisabled: !isTextTruncated || isDisabled
+    });
+    const { 'aria-describedby': notNeeded, ...validTooltipProps } = tooltipProps; //remove aria-describedby to prevent screen readers reading the same text multiple times
+    return truncation === 'middle' ? (jsx(MiddleTruncatingLink, { href: href, "aria-describedby": ariaDescribedBy, "aria-label": accessibleLabel, "aria-labelledby": ariaLabelledBy, target: target, placement: placement, isDisabled: isDisabled, variant: variant, testId: testId, onClick: onClick, children: shownText })) : (jsxs(Fragment, { children: [jsx("a", { ...mergeProps(detectTruncationProps, validTooltipProps, interactionProps, testIdProps, !isDisabled ? pressProps : {}), tabIndex: isTabbable && !isDisabled ? 0 : -1, href: !isDisabled ? href : undefined, "aria-describedby": ariaDescribedBy, "aria-label": accessibleLabel, "aria-labelledby": ariaLabelledBy, target: target, class: linkClasses, children: lineClamp ? (jsx(Text, { lineClamp: lineClamp, size: "md", variant: "inherit", children: shownText })) : (jsx(Text, { truncation: truncation === 'end' && placement !== 'embedded' ? 'ellipsis' : undefined, size: "md", variant: "inherit", children: shownText })) }), tooltipContent] }));
+}
+
+export { TruncatingLink as T };
+//# sourceMappingURL=TruncatingLink-6aaf40b9.js.map

package/es/TruncatingLink-6aaf40b9.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TruncatingLink-6aaf40b9.js","sources":["../../src/PRIVATE_TruncatingLink/MiddleTruncatingLink.tsx","../../src/PRIVATE_TruncatingLink/TruncatingLink.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { classNames } from '#utils/UNSAFE_classNames';\nimport { usePressClick } from '#hooks/UNSAFE_usePressClick';\nimport { useComponentTheme } from '#hooks/UNSAFE_useComponentTheme';\nimport { LinkVariantOptions } from '#UNSAFE_Link/themes/LinkStyles.css';\nimport { useInteractionStyle } from '#hooks/UNSAFE_useInteractionStyle';\nimport { LinkRedwoodTheme } from '#UNSAFE_Link/themes/redwood/LinkTheme';\nimport { useTabbableMode } from '#hooks/UNSAFE_useTabbableMode';\nimport { useTestId, TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport { useDetectTruncation } from '#hooks/PRIVATE_useDetectTruncation';\nimport { useTooltip } from '#hooks/UNSAFE_useTooltip';\nimport { useMemo } from 'preact/hooks';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport { getClientHints } from '#utils/PRIVATE_clientHints';\nimport { UnpackSignals } from '#utils/UNSAFE_attributeUtils';\nimport type { JSX } from 'preact';\nimport { Text } from '#UNSAFE_Text';\nimport { useMiddleEllipsis } from '#hooks/PRIVATE_useMiddleEllipsis';\nimport { mergeRefs } from '#utils/PRIVATE_refUtils';\nimport { HiddenAccessible } from '#UNSAFE_HiddenAccessible';\n\ntype AriaProps = Pick<\n  UnpackSignals<JSX.AriaAttributes>,\n  'aria-describedby' | 'aria-label' | 'aria-labelledby'\n>;\n\ntype Props = {\n  /**\n   * Sets the URL that the hyperlink points to.\n   */\n  href: string;\n\n  /**\n   * Sets the variant. The default value of this property is theme driven.\n   */\n  variant?: 'standard' | 'primary' | 'secondary';\n\n  /**\n   * Sets the placement.\n   */\n  placement?: 'standalone' | 'embedded';\n\n  /**\n   * Sets the target.\n   */\n  target?: string;\n\n  /**\n   * Triggered when a link is clicked, whether by keyboard, mouse, or touch events.\n   */\n  onClick?: (event: Event) => void;\n\n  /**\n   * Specifies that the link element should be disabled.\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies alternative text to be shown rather than the href.\n   */\n  children?: string;\n} & TestIdProps &\n  AriaProps;\n\nconst noop = () => {};\n\n/**\n * MiddleTruncatingLink component creates a hyperlink that shows a tooltip and ellipsis in middle of text when truncated.\n */\nexport function MiddleTruncatingLink({\n  href,\n  variant,\n  placement = 'standalone',\n  target,\n  testId,\n  'aria-describedby': ariaDescribedBy,\n  'aria-label': accessibleLabel,\n  'aria-labelledby': ariaLabelledBy,\n  onClick,\n  isDisabled,\n  children\n}: Props) {\n  const { detectTruncationProps, isTextTruncated } = useDetectTruncation<HTMLAnchorElement>();\n  const { interactionProps, applyPseudoHoverStyle, applyHoverStyle } = useInteractionStyle();\n  const clientHints = getClientHints();\n  const { classes } = useComponentTheme<LinkVariantOptions>(LinkRedwoodTheme, {\n    needsEventsHover: applyHoverStyle ? 'isNeedsEventsHover' : 'notNeedsEventsHover',\n    pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',\n    variant,\n    placement,\n    disabled: isDisabled ? 'isDisabled' : 'notDisabled',\n    truncatingLinkStyles: placement !== 'embedded' ? 'styles' : 'none',\n    truncatingLinkWhiteSpace: placement !== 'embedded' ? 'nowrap' : 'none',\n    safariStyles: clientHints.browser === 'safari' ? 'isSafari' : 'notSafari'\n  });\n  const { isTabbable } = useTabbableMode();\n  const linkClasses = classNames([classes]);\n  const { pressProps } = usePressClick(onClick ?? noop);\n  const testIdProps = useTestId(testId);\n  const shownText = children || href;\n  const { ref: middleElRef, truncatedText } = useMiddleEllipsis(shownText);\n  const displayText = useMemo(\n    () => (placement !== 'embedded' && truncatedText !== shownText ? truncatedText : shownText),\n    [placement, truncatedText, shownText]\n  );\n\n  const { tooltipContent, tooltipProps } = useTooltip({\n    text: shownText,\n    isDisabled: !(isTextTruncated || truncatedText !== shownText) || isDisabled\n  });\n  const { 'aria-describedby': notNeeded, ...validTooltipProps } = tooltipProps; //remove aria-describedby to prevent screen readers reading the same text multiple times\n  const mergedRef = useMemo(\n    () => mergeRefs(detectTruncationProps.ref, middleElRef),\n    [detectTruncationProps.ref, middleElRef]\n  );\n\n  return (\n    <>\n      <a\n        ref={mergedRef}\n        {...mergeProps(\n          validTooltipProps,\n          interactionProps,\n          testIdProps,\n          !isDisabled ? pressProps : {}\n        )}\n        tabIndex={isTabbable && !isDisabled ? 0 : -1}\n        href={!isDisabled ? href : undefined}\n        aria-describedby={ariaDescribedBy}\n        aria-label={accessibleLabel}\n        aria-labelledby={ariaLabelledBy}\n        target={target}\n        class={linkClasses}>\n        <span role=\"presentation\" aria-hidden={true}>\n          <Text size=\"md\" variant=\"inherit\">\n            {displayText}\n          </Text>\n        </span>\n        <HiddenAccessible>{shownText}</HiddenAccessible>\n      </a>\n      {tooltipContent}\n    </>\n  );\n}\n","/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * Licensed under The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { classNames } from '#utils/UNSAFE_classNames';\nimport { usePressClick } from '#hooks/UNSAFE_usePressClick';\nimport { useComponentTheme } from '#hooks/UNSAFE_useComponentTheme';\nimport { LinkVariantOptions } from '#UNSAFE_Link/themes/LinkStyles.css';\nimport { useInteractionStyle } from '#hooks/UNSAFE_useInteractionStyle';\nimport { LinkRedwoodTheme } from '#UNSAFE_Link/themes/redwood/LinkTheme';\nimport { useTabbableMode } from '#hooks/UNSAFE_useTabbableMode';\nimport { useTestId, TestIdProps } from '#hooks/UNSAFE_useTestId';\nimport { useDetectTruncation } from '#hooks/PRIVATE_useDetectTruncation';\nimport { useTooltip } from '#hooks/UNSAFE_useTooltip';\nimport { mergeProps } from '#utils/UNSAFE_mergeProps';\nimport { getClientHints } from '#utils/PRIVATE_clientHints';\nimport { UnpackSignals } from '#utils/UNSAFE_attributeUtils';\nimport type { JSX } from 'preact';\nimport { Text } from '#UNSAFE_Text';\nimport { MiddleTruncatingLink } from './MiddleTruncatingLink';\n\ntype AriaProps = Pick<\n  UnpackSignals<JSX.AriaAttributes>,\n  'aria-describedby' | 'aria-label' | 'aria-labelledby'\n>;\n\ntype TruncateProps =\n  | {\n      /**\n       * Truncates link at a specific number of lines and then displays an ellipsis (…) at the end of the last line. Parent of the element needs to have a specific width so text starts overflowing and produce a truncation.\n       */\n      lineClamp?: number;\n      /**\n       * Determines ellipsis position when link is truncated. Be aware of setting either lineClamp or truncation. Setting both props would produce a type error. In most cases, lineClamp=1 tries to put the ellipsis at the end of a \"word\". On the other hand, using truncation=\"end\" will show as much as possible text, then put the ellipsis at the end.\n       */\n      truncation?: never;\n    }\n  | {\n      lineClamp?: never;\n      truncation?: 'end' | 'middle' | 'none';\n    };\n\ntype Props = {\n  /**\n   * Sets the URL that the hyperlink points to.\n   */\n  href: string;\n\n  /**\n   * Sets the variant. The default value of this property is theme driven.\n   */\n  variant?: 'standard' | 'primary' | 'secondary';\n\n  /**\n   * Sets the placement.\n   */\n  placement?: 'standalone' | 'embedded';\n\n  /**\n   * Sets the target.\n   */\n  target?: string;\n\n  /**\n   * Triggered when a link is clicked, whether by keyboard, mouse, or touch events.\n   */\n  onClick?: (event: Event) => void;\n\n  /**\n   * Specifies that the link element should be disabled.\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies alternative text to be shown rather than the href.\n   */\n  children?: string;\n} & TestIdProps &\n  AriaProps &\n  TruncateProps;\n\nconst noop = () => {};\n\n/**\n * TruncatingLink component creates a hyperlink that shows a tooltip and ellipsis at the end or middle of text when truncated.\n */\nexport function TruncatingLink({\n  href,\n  variant,\n  placement = 'standalone',\n  target,\n  testId,\n  'aria-describedby': ariaDescribedBy,\n  'aria-label': accessibleLabel,\n  'aria-labelledby': ariaLabelledBy,\n  onClick,\n  isDisabled,\n  truncation,\n  lineClamp,\n  children\n}: Props) {\n  const { detectTruncationProps, isTextTruncated } = useDetectTruncation<HTMLAnchorElement>();\n  const { interactionProps, applyPseudoHoverStyle, applyHoverStyle } = useInteractionStyle();\n  const clientHints = getClientHints();\n  const { classes } = useComponentTheme<LinkVariantOptions>(LinkRedwoodTheme, {\n    needsEventsHover: applyHoverStyle ? 'isNeedsEventsHover' : 'notNeedsEventsHover',\n    pseudoHover: applyPseudoHoverStyle ? 'isPseudoHover' : 'notPseudoHover',\n    variant,\n    placement,\n    disabled: isDisabled ? 'isDisabled' : 'notDisabled',\n    truncatingLinkStyles: placement !== 'embedded' ? 'styles' : 'none',\n    truncatingLinkWhiteSpace: placement !== 'embedded' && !lineClamp ? 'nowrap' : 'none',\n    safariStyles: clientHints.browser === 'safari' ? 'isSafari' : 'notSafari'\n  });\n  const { isTabbable } = useTabbableMode();\n  const linkClasses = classNames([classes]);\n  const { pressProps } = usePressClick(onClick ?? noop);\n  const testIdProps = useTestId(testId);\n  const shownText = children || href;\n\n  const { tooltipContent, tooltipProps } = useTooltip({\n    text: shownText,\n    isDisabled: !isTextTruncated || isDisabled\n  });\n  const { 'aria-describedby': notNeeded, ...validTooltipProps } = tooltipProps; //remove aria-describedby to prevent screen readers reading the same text multiple times\n\n  return truncation === 'middle' ? (\n    <MiddleTruncatingLink\n      href={href}\n      aria-describedby={ariaDescribedBy}\n      aria-label={accessibleLabel}\n      aria-labelledby={ariaLabelledBy}\n      target={target}\n      placement={placement}\n      isDisabled={isDisabled}\n      variant={variant}\n      testId={testId}\n      onClick={onClick}>\n      {shownText}\n    </MiddleTruncatingLink>\n  ) : (\n    <>\n      <a\n        {...mergeProps(\n          detectTruncationProps,\n          validTooltipProps,\n          interactionProps,\n          testIdProps,\n          !isDisabled ? pressProps : {}\n        )}\n        tabIndex={isTabbable && !isDisabled ? 0 : -1}\n        href={!isDisabled ? href : undefined}\n        aria-describedby={ariaDescribedBy}\n        aria-label={accessibleLabel}\n        aria-labelledby={ariaLabelledBy}\n        target={target}\n        class={linkClasses}>\n        {lineClamp ? (\n          <Text lineClamp={lineClamp} size=\"md\" variant=\"inherit\">\n            {shownText}\n          </Text>\n        ) : (\n          <Text\n            truncation={truncation === 'end' && placement !== 'embedded' ? 'ellipsis' : undefined}\n            size=\"md\"\n            variant=\"inherit\">\n            {shownText}\n          </Text>\n        )}\n      </a>\n      {tooltipContent}\n    </>\n  );\n}\n"],"names":["noop","_jsxs","_jsx","_Fragment"],"mappings":"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"}

package/es/TruncatingText-1bf00351.js

@@ -1,6 +1,6 @@
 /* @oracle/oraclejet-preact: undefined */
 import { jsxs, Fragment, jsx } from 'preact/jsx-runtime';
-import { u as useTooltipOnTruncation } from './useTooltipOnTruncation-94282e75.js';
+import { u as useTooltipOnTruncation } from './useTooltipOnTruncation-31afc3f2.js';
 import './TabbableModeContext-7d8ad946.js';
 import { u as useTabbableMode } from './useTabbableMode-090ed4b5.js';
 import { c as classNames } from './classNames-4e12b00d.js';

package/es/UNSAFE_AccordionItemMultiple.js

@@ -2,7 +2,7 @@
 import { jsx } from 'preact/jsx-runtime';
 import { useRef, useCallback } from 'preact/hooks';
 import { C as Collapsible } from './Collapsible-2608ce3b.js';
-import { u as useTestId } from './useTestId-f24ac480.js';
+import { u as useTestId } from './useTestId-ab1bede6.js';
 import { A as AccordionItemStylingContext } from './AccordionItemStylingContext-cd01089c.js';
 import './useId-03dbfdf0.js';
 import 'preact';
@@ -11,7 +11,7 @@ import './useComponentTheme-d2f9e47f.js';
 import './logger-c92f309c.js';
 import './TabbableModeContext-7d8ad946.js';
 import './useTabbableMode-090ed4b5.js';
-import './Flex-03129963.js';
+import './Flex-fc483125.js';
 import './boxalignment-8980856d.js';
 import './size-af1e638c.js';
 import './utils-b1eb54f9.js';
@@ -38,25 +38,25 @@ import './SeparatorStyles.styles.css';
 import './vanilla-extract-recipes-createRuntimeFn.esm-2aaf8c98.js';
 import './ChevronDown-16a46328.js';
 import './Icon-4983d06e.js';
-import './useTooltip-94af94d4.js';
-import './useTooltipControlled-f2cfa454.js';
+import './useTooltip-ab739df0.js';
+import './useTooltipControlled-b7f30aee.js';
 import './useHover-85077adb.js';
 import './useToggle-8b7fcefe.js';
 import './useFocus-38c95977.js';
 import './useTouch-4828df25.js';
 import './mergeProps-88ea8306.js';
 import './useAnimation-fe39685e.js';
-import './useThemeInterpolations-e144e8ec.js';
-import './useColorScheme-c4f6caab.js';
-import './LayerHost-7931b424.js';
+import './useThemeInterpolations-5f358139.js';
+import './useColorScheme-67245285.js';
+import './LayerHost-3cf255a6.js';
 import './index-aec1cc7f.js';
 import 'preact/compat';
 import './UNSAFE_Layer/themes/LayerHostStyles.css.js';
 import './LayerHostStyles.styles.css';
-import './useScale-434ad939.js';
+import './useScale-93490e54.js';
 import './theme-63551f30.js';
 import './Theme-e6dec6db.js';
-import './useDensity-1acb0153.js';
+import './useDensity-969273f3.js';
 import './unsafeDomAccess-453eb74e.js';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentTheme.js';
 import './hooks/UNSAFE_useTooltip/themes/TooltipContentStyles.css.js';
@@ -65,16 +65,16 @@ import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.css.js'
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.styles.css';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js';
 import './TooltipContentVariants.styles.css';
-import './tooltipUtils-af0abd38.js';
-import './EnvironmentProvider-6a0a8212.js';
-import './LayerManager-52a26c55.js';
-import './Floating-4a82db94.js';
-import './useFloating-b9d680f7.js';
-import './useUser-06d34d19.js';
+import './tooltipUtils-90fb656f.js';
+import './EnvironmentProvider-6cf8ed37.js';
+import './LayerManager-e30fbfd6.js';
+import './Floating-be4c0cb6.js';
+import './useFloating-c74a7f54.js';
+import './useUser-e543b73c.js';
 import './positionUtils-f26caad9.js';
 import './refUtils-76275c69.js';
-import './useOutsideClick-b777a43e.js';
-import './Layer-535577b5.js';
+import './useOutsideClick-01f3d3e1.js';
+import './Layer-6c27170e.js';
 import './UNSAFE_Layer/themes/LayerStyles.css.js';
 import './LayerStyles.styles.css';
 import './useModal-953082f2.js';
@@ -93,7 +93,7 @@ import './clientHints-a42b510c.js';
 import './CollapseIcon-84f6ba8e.js';
 import './ChevronRight-f4ff20cb.js';
 import './ChevronLeft-4a89ffb9.js';
-import './withDirectionIcon-a8d84a3d.js';
+import './withDirectionIcon-b725a6d7.js';
 import './ChevronUp-62af57fd.js';
 import './UNSAFE_Collapsible/themes/redwood/CollapsibleTheme.js';
 import './UNSAFE_Collapsible/themes/CollapsibleStyles.css.js';

package/es/UNSAFE_AccordionItemSingle.js

@@ -2,7 +2,7 @@
 import { jsx } from 'preact/jsx-runtime';
 import { useRef, useCallback } from 'preact/hooks';
 import { C as Collapsible } from './Collapsible-2608ce3b.js';
-import { u as useTestId } from './useTestId-f24ac480.js';
+import { u as useTestId } from './useTestId-ab1bede6.js';
 import { e as equals } from './equals-625352e8.js';
 import { A as AccordionItemStylingContext } from './AccordionItemStylingContext-cd01089c.js';
 import './useId-03dbfdf0.js';
@@ -12,7 +12,7 @@ import './useComponentTheme-d2f9e47f.js';
 import './logger-c92f309c.js';
 import './TabbableModeContext-7d8ad946.js';
 import './useTabbableMode-090ed4b5.js';
-import './Flex-03129963.js';
+import './Flex-fc483125.js';
 import './boxalignment-8980856d.js';
 import './size-af1e638c.js';
 import './utils-b1eb54f9.js';
@@ -39,25 +39,25 @@ import './SeparatorStyles.styles.css';
 import './vanilla-extract-recipes-createRuntimeFn.esm-2aaf8c98.js';
 import './ChevronDown-16a46328.js';
 import './Icon-4983d06e.js';
-import './useTooltip-94af94d4.js';
-import './useTooltipControlled-f2cfa454.js';
+import './useTooltip-ab739df0.js';
+import './useTooltipControlled-b7f30aee.js';
 import './useHover-85077adb.js';
 import './useToggle-8b7fcefe.js';
 import './useFocus-38c95977.js';
 import './useTouch-4828df25.js';
 import './mergeProps-88ea8306.js';
 import './useAnimation-fe39685e.js';
-import './useThemeInterpolations-e144e8ec.js';
-import './useColorScheme-c4f6caab.js';
-import './LayerHost-7931b424.js';
+import './useThemeInterpolations-5f358139.js';
+import './useColorScheme-67245285.js';
+import './LayerHost-3cf255a6.js';
 import './index-aec1cc7f.js';
 import 'preact/compat';
 import './UNSAFE_Layer/themes/LayerHostStyles.css.js';
 import './LayerHostStyles.styles.css';
-import './useScale-434ad939.js';
+import './useScale-93490e54.js';
 import './theme-63551f30.js';
 import './Theme-e6dec6db.js';
-import './useDensity-1acb0153.js';
+import './useDensity-969273f3.js';
 import './unsafeDomAccess-453eb74e.js';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentTheme.js';
 import './hooks/UNSAFE_useTooltip/themes/TooltipContentStyles.css.js';
@@ -66,16 +66,16 @@ import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.css.js'
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentBaseTheme.styles.css';
 import './hooks/UNSAFE_useTooltip/themes/redwood/TooltipContentVariants.css.js';
 import './TooltipContentVariants.styles.css';
-import './tooltipUtils-af0abd38.js';
-import './EnvironmentProvider-6a0a8212.js';
-import './LayerManager-52a26c55.js';
-import './Floating-4a82db94.js';
-import './useFloating-b9d680f7.js';
-import './useUser-06d34d19.js';
+import './tooltipUtils-90fb656f.js';
+import './EnvironmentProvider-6cf8ed37.js';
+import './LayerManager-e30fbfd6.js';
+import './Floating-be4c0cb6.js';
+import './useFloating-c74a7f54.js';
+import './useUser-e543b73c.js';
 import './positionUtils-f26caad9.js';
 import './refUtils-76275c69.js';
-import './useOutsideClick-b777a43e.js';
-import './Layer-535577b5.js';
+import './useOutsideClick-01f3d3e1.js';
+import './Layer-6c27170e.js';
 import './UNSAFE_Layer/themes/LayerStyles.css.js';
 import './LayerStyles.styles.css';
 import './useModal-953082f2.js';
@@ -94,7 +94,7 @@ import './clientHints-a42b510c.js';
 import './CollapseIcon-84f6ba8e.js';
 import './ChevronRight-f4ff20cb.js';
 import './ChevronLeft-4a89ffb9.js';
-import './withDirectionIcon-a8d84a3d.js';
+import './withDirectionIcon-b725a6d7.js';
 import './ChevronUp-62af57fd.js';
 import './UNSAFE_Collapsible/themes/redwood/CollapsibleTheme.js';
 import './UNSAFE_Collapsible/themes/CollapsibleStyles.css.js';

package/es/UNSAFE_ActionCard.js

@@ -33,8 +33,8 @@ import './_isObject-1fab0f5b.js';
 import './PRIVATE_StyledCard/themes/StyledCardStyles.css.js';
 import './StyledCardStyles.styles.css';
 import './vanilla-extract-recipes-createRuntimeFn.esm-2aaf8c98.js';
-import './useTestId-f24ac480.js';
-import './LayerHost-7931b424.js';
+import './useTestId-ab1bede6.js';
+import './LayerHost-3cf255a6.js';
 import './index-aec1cc7f.js';
 import './UNSAFE_Layer/themes/LayerHostStyles.css.js';
 import './LayerHostStyles.styles.css';