@oracle/oraclejet-preact 14.0.0

package/es/UNSAFE_Button.js

@@ -0,0 +1,87 @@
+/* @oracle/oraclejet-preact: 14.0.0 */
+import { jsxs, jsx } from 'preact/jsx-runtime';
+import { BaseButton } from './UNSAFE_BaseButton.js';
+import { _ as __rest } from './tslib.es6-8b94ba02.js';
+import "./UNSAFE_Button.css";
+import { classNames } from './utils/UNSAFE_classNames.js';
+import { forwardRef } from 'preact/compat';
+import './hooks/UNSAFE_usePress.js';
+import 'preact/hooks';
+import './hooks/UNSAFE_useHover.js';
+import './hooks/UNSAFE_useToggle.js';
+import './hooks/UNSAFE_useActive.js';
+import './utils/UNSAFE_interpolations/dimensions.js';
+import './utils/UNSAFE_arrayUtils.js';
+import './utils/UNSAFE_size.js';
+import './_curry1-d822c6e1.js';
+import './utils/UNSAFE_mergeInterpolations.js';
+import './_curry3-ddab9fe1.js';
+import './_curry2-50442f66.js';
+import './_has-c4aaaf43.js';
+import './utils/PRIVATE_clientHints.js';
+import './hooks/UNSAFE_useTabbableMode.js';
+import 'preact';
+import './utils/UNSAFE_mergeProps.js';
+
+const compStyles = {
+  text: "mwqup1",
+  icon: "_1xt49v0",
+  startText: "_1cdack0",
+  endText: "d2rqzg",
+  startIcon: "_105gw52",
+  startIconOnly: "_1fhs9sf",
+  endIcon: "_1oavhju",
+  label: "kspemf"
+};
+
+const isNullOrUndefined = value => {
+  return value === null || value === undefined;
+};
+
+function ButtonLayout(_a) {
+  var {
+    size = 'md',
+    display = 'all',
+    styling = 'default'
+  } = _a,
+      props = __rest(_a, ["size", "display", "styling"]);
+
+  const showIcons = display === 'all' || display === 'icons';
+  const showText = display === 'all' || display === 'label';
+  const labelClass = compStyles.label;
+  const isOnlyIcon = props.startIcon && (display === 'icons' || !props.children) && !props.endIcon;
+  const isEmbedded = styling === 'embedded';
+  const textStartIcon = !isNullOrUndefined(props.startIcon) && display === 'all';
+  const textEndIcon = !isNullOrUndefined(props.endIcon) && display === 'all';
+  const isTwoIcons = props.startIcon && props.endIcon;
+  const endIconClass = `${compStyles.icon} oj-c-button-layout-${size} ${compStyles.endIcon}`;
+  const startIconStyles = classNames([compStyles.icon, isEmbedded ? `oj-c-button-layout-embedded-${size}` : `oj-c-button-layout-${size}`, isOnlyIcon ? compStyles.startIconOnly : compStyles.startIcon]);
+  const textStyles = classNames([compStyles.text, textStartIcon && !isTwoIcons && compStyles.endText, textEndIcon && !isTwoIcons && compStyles.startText]);
+  return jsxs("span", Object.assign({
+    class: labelClass
+  }, {
+    children: [showIcons && props.startIcon && jsx("span", Object.assign({
+      class: startIconStyles
+    }, {
+      children: props.startIcon
+    })), showText && props.children && jsxs("span", Object.assign({
+      class: textStyles
+    }, {
+      children: [" ", props.children, " "]
+    })), showIcons && props.endIcon && jsx("span", Object.assign({
+      class: endIconClass
+    }, {
+      children: props.endIcon
+    }))]
+  }));
+}
+
+const Button = forwardRef(({ variant = 'outlined', isDisabled = false, isRepeat = false, size = 'md', display = 'all', endIcon, startIcon, autofocus, edge, onAction, label = '', accessibleLabel, title, width }, ref) => {
+    const labelOnly = (!startIcon && !endIcon) || display === 'label';
+    const content = labelOnly ? (label) : (jsx(ButtonLayout, Object.assign({ display: display, startIcon: startIcon, endIcon: endIcon, size: size }, { children: label })));
+    return (jsx(BaseButton, Object.assign({ ref: ref, isDisabled: isDisabled, isRepeat: isRepeat, size: size, width: width, autofocus: autofocus, edge: edge, variant: variant, styling: [labelOnly ? 'default' : 'min'], onAction: onAction, accessibleLabel: accessibleLabel !== null && accessibleLabel !== void 0 ? accessibleLabel : (display === 'icons' ? label : undefined), title: title !== null && title !== void 0 ? title : (display === 'icons' ? accessibleLabel !== null && accessibleLabel !== void 0 ? accessibleLabel : label : undefined), "aria-label": display === 'icons' ? label : null }, { children: content })));
+});
+
+export { Button, ButtonLayout };
+/*  */
+//# sourceMappingURL=UNSAFE_Button.js.map

package/es/UNSAFE_Button.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UNSAFE_Button.js","sources":["../../src/UNSAFE_Button/ButtonLayout.tsx","../../src/UNSAFE_Button/Button.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, ComponentProps } from 'preact';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { BaseButton } from '../UNSAFE_BaseButton';\n\nexport type ButtonDisplay = 'icons' | 'label' | 'all';\n\nexport type Props = {\n  /**\n   *The default slot is the button's text label. The oj-c-button element accepts plain text or DOM nodes as children for the default slot.\"\n   */\n  children?: ComponentChildren;\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   * Styling can be used for customizing icon layout by limiting padding (\"embedded\")\n   */\n  styling?: 'default' | 'embedded';\n\n  /**\n   * The size indicates how large the button is rendered.\n   */\n  size?: ComponentProps<typeof BaseButton>['size'];\n\n  /**\n   * Display indicates whether the label, the icons, or all elements should be rendered by the button.\n   */\n  display?: ButtonDisplay;\n};\n\nexport const compStyles = {\n  text: cssProps`\n    ${{\n      overflowX: 'hidden',\n      overflowY: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      display: 'inline-flex'\n    }}\n  `,\n\n  icon: cssProps`\n    ${{\n      display: 'inline-flex',\n      fontSize: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-size)',\n      fontWeight: 'normal',\n      marginTop: 0,\n      marginBottom: 0\n    }}\n  `,\n\n  startText: cssProps`\n    ${{\n      marginInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-to-edge-padding)'\n    }}\n  `,\n\n  endText: cssProps`\n    ${{\n      marginInlineEnd: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-to-edge-padding)'\n    }}\n  `,\n\n  startIcon: cssProps`\n    ${{\n      marginInlineEnd: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-text-padding)',\n      marginInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-edge-padding)'\n    }}\n  `,\n\n  startIconOnly: cssProps`\n    ${{\n      marginInlineEnd: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-edge-padding)',\n      marginInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-edge-padding)'\n    }}\n  `,\n\n  endIcon: cssProps`\n    ${{\n      marginInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-text-padding)',\n      marginInlineEnd: 'var(--oj-c-PRIVATE-DO-NOT-USE-button-icon-to-edge-padding)'\n    }}\n  `,\n\n  label: cssProps`\n    ${{\n      cursor: 'inherit',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      width: '100%',\n      height: '100%'\n    }}\n  `\n};\n\nconst isNullOrUndefined = (\n  value: ComponentChildren | null | undefined\n): value is null | undefined => {\n  return value === null || value === undefined;\n};\n\nexport function ButtonLayout({\n  size = 'md',\n  display = 'all',\n  styling = 'default',\n  ...props\n}: Props) {\n  const showIcons = display === 'all' || display === 'icons';\n  const showText = display === 'all' || display === 'label';\n  const labelClass = compStyles.label;\n  const isOnlyIcon = props.startIcon && (display === 'icons' || !props.children) && !props.endIcon;\n  const isEmbedded = styling === 'embedded';\n  const textStartIcon = !isNullOrUndefined(props.startIcon) && display === 'all';\n  const textEndIcon = !isNullOrUndefined(props.endIcon) && display === 'all';\n  const isTwoIcons = props.startIcon && props.endIcon;\n\n  const endIconClass = `${compStyles.icon} oj-c-button-layout-${size} ${compStyles.endIcon}`;\n  const startIconStyles = classNames([\n    compStyles.icon,\n    isEmbedded ? `oj-c-button-layout-embedded-${size}` : `oj-c-button-layout-${size}`,\n    isOnlyIcon ? compStyles.startIconOnly : compStyles.startIcon\n  ]);\n  const textStyles = classNames([\n    compStyles.text,\n    textStartIcon && !isTwoIcons && compStyles.endText,\n    textEndIcon && !isTwoIcons && compStyles.startText\n  ]);\n\n  return (\n    <span class={labelClass}>\n      {showIcons && props.startIcon && <span class={startIconStyles}>{props.startIcon}</span>}\n      {showText && props.children && <span class={textStyles}> {props.children} </span>}\n      {showIcons && props.endIcon && <span class={endIconClass}>{props.endIcon}</span>}\n    </span>\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 { ComponentChildren, ComponentProps, Ref } from 'preact';\nimport { BaseButton } from '../UNSAFE_BaseButton';\nimport { ButtonLayout } from './ButtonLayout';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { forwardRef } from 'preact/compat';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\n\ntype IntrinsicProps = Pick<HTMLAttributesSignalExcluded<HTMLButtonElement>, 'autofocus'>;\n\ntype WidthProps = Pick<DimensionProps, 'width'>;\n\ntype Props = IntrinsicProps &\n  WidthProps & {\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     * Specifies that the button element should be disabled.\n     */\n    isDisabled?: boolean;\n\n    /**\n     * Specifies if repeated events are dispatched for key or pointer held down\n     */\n    isRepeat?: boolean;\n\n    /**\n     * label - button label, used for accessibility if no override\n     */\n    label?: string;\n\n    /**\n     * accessibleLabel - override label for accessibility\n     */\n    accessibleLabel?: string;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"borderless\"': \"Borderless buttons are the least prominent variation.\n     * Borderless buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n     *  most important actions in the UI.\",\n     *     \"callToAction\"': \"A Call To Action (CTA) button guides the user to take or\n     * complete the action that is the main goal of the page or page section. There\n     * should only be one CTA button on a page at any given time.\",\n     *     \"danger\"': \"A Danger button alerts the user to a dangerous situation.\",\n     */\n    variant?: ComponentProps<typeof BaseButton>['variant'];\n\n    /**\n     * The size indicates how large the button is rendered.\n     */\n    size?: ComponentProps<typeof BaseButton>['size'];\n\n    /**\n     * Edge can be used to specify that the button is intended to go at the bottom of\n     * a region, stretching from left to right.\n     */\n    edge?: ComponentProps<typeof BaseButton>['edge'];\n\n    /**\n     * Triggered when a button is clicked, whether by keyboard, mouse, or touch events.\n     */\n    onAction?: () => void | null;\n\n    /**\n     * Display indicates whether the label, the icons, or all elements should be rendered by the button.\n     */\n    display?: ComponentProps<typeof ButtonLayout>['display'];\n\n    /**\n     * The title is used to provide a tooltip.\n     */\n    title?: string;\n  };\n\nexport const Button = forwardRef(\n  (\n    {\n      variant = 'outlined',\n      isDisabled = false,\n      isRepeat = false,\n      size = 'md',\n      display = 'all',\n      endIcon,\n      startIcon,\n      autofocus,\n      edge,\n      onAction,\n      label = '',\n      accessibleLabel,\n      title,\n      width\n    }: Props,\n    ref?: Ref<HTMLButtonElement>\n  ) => {\n    const labelOnly = (!startIcon && !endIcon) || display === 'label';\n    const content = labelOnly ? (\n      label\n    ) : (\n      <ButtonLayout display={display} startIcon={startIcon} endIcon={endIcon} size={size}>\n        {label}\n      </ButtonLayout>\n    );\n    return (\n      <BaseButton\n        ref={ref as Ref<HTMLButtonElement> & Ref<HTMLAnchorElement> & Ref<HTMLSpanElement>}\n        isDisabled={isDisabled}\n        isRepeat={isRepeat}\n        size={size}\n        width={width}\n        autofocus={autofocus}\n        edge={edge}\n        variant={variant}\n        styling={[labelOnly ? 'default' : 'min']}\n        onAction={onAction}\n        accessibleLabel={accessibleLabel ?? (display === 'icons' ? label : undefined)}\n        title={title ?? (display === 'icons' ? accessibleLabel ?? label : undefined)}\n        aria-label={display === 'icons' ? label : null}>\n        {content}\n      </BaseButton>\n    );\n  }\n);\n"],"names":["compStyles","isNullOrUndefined","value","undefined","ButtonLayout","_a","size","display","styling","props","__rest","labelClass","label","isEmbedded","textStartIcon","startIcon","textEndIcon","endIcon","endIconClass","icon","text","isTwoIcons","endText","startText","_jsx"],"mappings":"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"}

package/es/UNSAFE_Center.js

@@ -0,0 +1,41 @@
+/* @oracle/oraclejet-preact: 14.0.0 */
+import { _ as __rest } from './tslib.es6-8b94ba02.js';
+import { jsx } from 'preact/jsx-runtime';
+import { Flex } from './UNSAFE_Flex.js';
+import './utils/UNSAFE_interpolations/dimensions.js';
+import './utils/UNSAFE_arrayUtils.js';
+import './utils/UNSAFE_size.js';
+import './_curry1-d822c6e1.js';
+import './utils/UNSAFE_mergeInterpolations.js';
+import './utils/UNSAFE_classNames.js';
+import './_curry3-ddab9fe1.js';
+import './_curry2-50442f66.js';
+import './_has-c4aaaf43.js';
+
+import './utils/UNSAFE_interpolations/boxalignment.js';
+import './keys-fed67954.js';
+import './utils/UNSAFE_interpolations/flexbox.js';
+import './utils/UNSAFE_interpolations/flexitem.js';
+
+/**
+ * Center is a convenience component that creates a flexbox
+ * with justifyContent: center and alignItems: center.
+ *
+ */
+// TODO: How do I add background-color, border, etc?
+function Center(_a) {
+    var { children, width = '100%', height = '100%' } = _a, props = __rest(_a, ["children", "width", "height"]);
+    return (jsx(Flex, Object.assign({}, props, { justify: "center", align: "center", width: width, height: height }, { children: children })));
+}
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+
+export { Center };
+/*  */
+//# sourceMappingURL=UNSAFE_Center.js.map

package/es/UNSAFE_Center.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UNSAFE_Center.js","sources":["../../src/UNSAFE_Center/Center.tsx","../../src/UNSAFE_Center/index.ts"],"sourcesContent":["import { ComponentChildren } from 'preact';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { Flex } from '../UNSAFE_Flex';\n\ntype Props = DimensionProps & {\n  children?: ComponentChildren;\n};\n\n/**\n * Center is a convenience component that creates a flexbox\n * with justifyContent: center and alignItems: center.\n *\n */\n// TODO: How do I add background-color, border, etc?\nfunction Center({ children, width = '100%', height = '100%', ...props }: Props) {\n  return (\n    <Flex {...props} justify=\"center\" align=\"center\" width={width} height={height}>\n      {children}\n    </Flex>\n  );\n}\n\nexport { Center };\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 */\nexport { Center } from './Center';\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;AAQA;;;;AAIG;AACH;AACA,SAAS,MAAM,CAAC,EAA8D,EAAA;AAA9D,IAAA,IAAA,EAAE,QAAQ,EAAE,KAAK,GAAG,MAAM,EAAE,MAAM,GAAG,MAAM,EAAmB,GAAA,EAAA,EAAd,KAAK,GAAA,MAAA,CAAA,EAAA,EAArD,+BAAuD,CAAF,CAAA;IACnE,QACEA,GAAC,CAAA,IAAI,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,KAAK,IAAE,OAAO,EAAC,QAAQ,EAAC,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAC1E,EAAA,EAAA,QAAA,EAAA,QAAQ,EACJ,CAAA,CAAA,EACP;AACJ;;ACpBA;;;;;;AAMG;;;;;;;"}

package/es/UNSAFE_Chip.css

@@ -0,0 +1,7 @@
+.ncvcxe{cursor:var( --oj-c-PRIVATE-DO-NOT-USE-core-cursor-clickable);}.ncvcxe:focus-visible{outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);outline-style:dotted;outline-width:1px;outline-offset:1px;}
+._1725rms{background-color:var(--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color);color:var(--oj-c-PRIVATE-DO-NOT-USE-chip-text-color);display:inline-block;padding-top:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);padding-right:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);padding-bottom:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);padding-left:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);box-sizing:border-box;border-top-left-radius:var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius);border-top-right-radius:var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius);border-bottom-right-radius:var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius);border-bottom-left-radius:var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius);height:2rem;min-width:2rem;line-height:var(--oj-c-PRIVATE-DO-NOT-USE-chip-line-height);font-size:var(--oj-c-PRIVATE-DO-NOT-USE-chip-font-size);font-weight:var(--oj-c-PRIVATE-DO-NOT-USE-chip-font-weight);overflow-x:hidden;overflow-y:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:center;}
+._1rtfypc{--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-color-disabled-1);--oj-c-PRIVATE-DO-NOT-USE-chip-text-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-disabled);}
+.m804v4{--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-1);--oj-c-PRIVATE-DO-NOT-USE-chip-text-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-contrast);}
+.p6nebi{--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-1);--oj-c-PRIVATE-DO-NOT-USE-chip-text-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-contrast);}
+._1g0t0xa{--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-3);--oj-c-PRIVATE-DO-NOT-USE-chip-text-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-contrast);}
+._9prc2f > *{margin-top:0 !important;margin-bottom:0 !important;margin-left:0 !important;margin-right:0 !important;}

package/es/UNSAFE_Chip.js

@@ -0,0 +1,65 @@
+/* @oracle/oraclejet-preact: 14.0.0 */
+import { jsx } from 'preact/jsx-runtime';
+import { useActionable } from './hooks/UNSAFE_useActionable.js';
+import "./UNSAFE_Chip.css";
+import { useCallback } from 'preact/hooks';
+import { classNames } from './utils/UNSAFE_classNames.js';
+import { useTabbableMode } from './hooks/UNSAFE_useTabbableMode.js';
+import './utils/UNSAFE_mergeProps.js';
+import './hooks/UNSAFE_useHover.js';
+import './hooks/UNSAFE_useToggle.js';
+import './hooks/UNSAFE_useActive.js';
+import './hooks/UNSAFE_useFocus.js';
+import './hooks/UNSAFE_usePress.js';
+import 'preact';
+
+const cursorandFocusStyle = "ncvcxe";
+const styles = {
+  base: "_1725rms",
+  disabled: "_1rtfypc",
+  info: "m804v4",
+  infoSubtle: "p6nebi",
+  infoSubtleLighter: "_1g0t0xa",
+  childrenMargins: "_9prc2f"
+};
+function Chip({
+  isSelected,
+  isDisabled,
+  accessibleLabel,
+  children,
+  onToggle
+}) {
+  const handleAction = useCallback(() => {
+    onToggle === null || onToggle === void 0 ? void 0 : onToggle({
+      previousValue: isSelected,
+      value: !isSelected
+    });
+  }, [isSelected, onToggle]);
+  const {
+    actionableProps,
+    isHover,
+    isActive
+  } = useActionable(handleAction);
+  const variant = isDisabled ? 'disabled' : isSelected || isActive ? 'info' : isHover ? 'infoSubtle' : 'infoSubtleLighter';
+  const classes = classNames([styles.base, isDisabled ? styles.disabled : `${styles.base} ${styles[variant]} ${cursorandFocusStyle}`, styles.childrenMargins]);
+  const {
+    isTabbable
+  } = useTabbableMode();
+  return isDisabled ? jsx("div", Object.assign({
+    class: classes
+  }, {
+    children: children
+  })) : jsx("div", Object.assign({}, actionableProps, {
+    class: classes,
+    tabIndex: isTabbable ? 0 : -1,
+    "aria-label": accessibleLabel,
+    role: "switch",
+    "aria-checked": isSelected ? 'true' : 'false'
+  }, {
+    children: children
+  }));
+}
+
+export { Chip };
+/*  */
+//# sourceMappingURL=UNSAFE_Chip.js.map

package/es/UNSAFE_Chip.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UNSAFE_Chip.js","sources":["../../src/UNSAFE_Chip/Chip.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 { useActionable } from '../hooks/UNSAFE_useActionable';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { useCallback } from 'preact/hooks';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { useTabbableMode } from '../hooks/UNSAFE_useTabbableMode';\n\nconst cursorandFocusStyle = cssProps`${{\n  cursor: 'var( --oj-c-PRIVATE-DO-NOT-USE-core-cursor-clickable)',\n  '&:focus-visible': {\n    outlineColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color)',\n    outlineStyle: 'dotted',\n    outlineWidth: '1px',\n    outlineOffset: '1px'\n  }\n}}`;\n\nconst styles = {\n  base: cssProps`${{\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color)',\n    color: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-text-color)',\n    display: 'inline-block',\n    paddingTop: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x)',\n    paddingRight: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x)',\n    paddingBottom: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x)',\n    paddingLeft: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x)',\n    boxSizing: 'border-box',\n    borderTopLeftRadius: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius)',\n    borderTopRightRadius: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius)',\n    borderBottomRightRadius: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius)',\n    borderBottomLeftRadius: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-border-radius)',\n    height: '2rem',\n    minWidth: '2rem',\n    lineHeight: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-line-height)',\n    fontSize: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-font-size)',\n    fontWeight: 'var(--oj-c-PRIVATE-DO-NOT-USE-chip-font-weight)',\n    overflowX: 'hidden',\n    overflowY: 'hidden',\n    whiteSpace: 'nowrap',\n    textOverflow: 'ellipsis',\n    textAlign: 'center'\n  }}`,\n  disabled: cssProps`${{\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-color-disabled-1)',\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-text-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-disabled)'\n  }}`,\n  info: cssProps`${{\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color': 'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-1)',\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-text-color': 'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-contrast)'\n  }}`,\n  infoSubtle: cssProps`${{\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-1)',\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-text-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-contrast)'\n  }}`,\n  infoSubtleLighter: cssProps`${{\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-bg-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-3)',\n    '--oj-c-PRIVATE-DO-NOT-USE-chip-text-color':\n      'var(--oj-c-PRIVATE-DO-NOT-USE-core-info-secondary-contrast)'\n  }}`,\n\n  childrenMargins: cssProps`${{\n    /* @ts-ignore */\n    '& > *': {\n      marginTop: '0 !important',\n      marginBottom: '0 !important',\n      marginLeft: '0 !important',\n      marginRight: '0 !important'\n    }\n  }}`\n};\n\ntype SelectedChangeDetail = { previousValue?: boolean; value?: boolean };\n\ntype Props = {\n  /**\n   * Specifies if the chip component is selected.\n   */\n  isSelected?: boolean;\n  /**\n   * Disables the component.\n   */\n  isDisabled?: boolean;\n  /**\n   * Specifies some screen reader text.\n   */\n  accessibleLabel?: string;\n  children: string;\n  /**\n   * Triggered when a chip is clickable, whether by keyboard, mouse, or touch events.\n   */\n  onToggle?: (detail: SelectedChangeDetail) => void;\n  //\n};\n\nexport function Chip({ isSelected, isDisabled, accessibleLabel, children, onToggle }: Props) {\n  const handleAction = useCallback(() => {\n    onToggle?.({ previousValue: isSelected, value: !isSelected });\n  }, [isSelected, onToggle]);\n\n  const { actionableProps, isHover, isActive } = useActionable(handleAction);\n\n  const variant = isDisabled\n    ? 'disabled'\n    : isSelected || isActive\n    ? 'info'\n    : isHover\n    ? 'infoSubtle'\n    : 'infoSubtleLighter';\n\n  const classes = classNames([\n    styles.base,\n    isDisabled ? styles.disabled : `${styles.base} ${styles[variant]} ${cursorandFocusStyle}`,\n    styles.childrenMargins\n  ]);\n  const { isTabbable } = useTabbableMode();\n\n  return isDisabled ? (\n    <div class={classes}>{children}</div>\n  ) : (\n    <div\n      {...actionableProps}\n      class={classes}\n      tabIndex={isTabbable ? 0 : -1}\n      aria-label={accessibleLabel}\n      role=\"switch\"\n      aria-checked={isSelected ? 'true' : 'false'}>\n      {children}\n    </div>\n  );\n}\n"],"names":["cursorandFocusStyle","styles","Chip","isSelected","isDisabled","accessibleLabel","children","onToggle","handleAction","useCallback","previousValue","value","actionableProps","isHover","isActive","useActionable","base","childrenMargins","isTabbable","useTabbableMode"],"mappings":";;;;;;;;;;;;;;;AAaA,MAAAA,mBAAA,GAAA,QAAA,CAAA;AAUA,MAAAC,MAAA,GAAA;QAAA,UAAA;YAAA,UAAA;QAAA,QAAA;cAAA,QAAA;qBAAA,UAAA;;AAAA,CAAA,CAAA;AAkFA,SAAAC,IAAA,CAAA;EAAAC,UAAA;EAAAC,UAAA;EAAAC,eAAA;EAAAC,QAAA;AAAAC,EAAAA,QAAAA;AAAA,CAAA,EAAA;AACE,EAAA,MAAAC,YAAA,GAAAC,WAAA,CAAA,MAAA;AACEF,IAAAA,QAAA,KAAA,IAAA,IAAAA,QAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAAA,QAAA,CAAA;AAAAG,MAAAA,aAAA,EAAAP,UAAA;AAAAQ,MAAAA,KAAA,EAAA,CAAAR,UAAAA;AAAA,KAAA,CAAA,CAAA;AACF,GAFA,EAEA,CAAAA,UAAA,EAAAI,QAAA,CAFA,CAAA,CAAA;EAIA,MAAA;IAAAK,eAAA;IAAAC,OAAA;AAAAC,IAAAA,QAAAA;GAAAC,GAAAA,aAAA,CAAAP,YAAA,CAAA,CAAA;+BAGE,sCAEA,SACAK,OAAA,GACA,YADA;8BAKAZ,MAAA,CAAAe,iGAEAf,MAAA,CAAAgB;EAEF,MAAA;AAAAC,IAAAA,UAAAA;AAAA,GAAA,GAAAC,eAAA,EAAA,CAAA;;;;;;;;;;;;;;AAeF;;;;;;;"}

package/es/UNSAFE_Collapsible.css

@@ -0,0 +1,9 @@
+._1twuo01 > *{margin-top:0 !important;margin-bottom:0 !important;margin-left:0 !important;margin-right:0 !important;}
+
+.yyma5a{cursor:pointer;}.yyma5a:focus-visible{outline-style:dotted;outline-offset:1px;outline-width:1px;outline-color:var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color);}
+._18jw5fl{padding-bottom:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x);}
+.g85tn4{color:var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-disabled);cursor:auto;}
+._74tkfq{padding-bottom:var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x);}
+._6ziia4{flex-grow:1;}._6ziia4 > *{margin-top:0 !important;margin-bottom:0 !important;margin-left:0 !important;margin-right:0 !important;}
+._1dyi5l6{padding-inline-start:16px;}
+._1m01evw{padding-inline-end:16px;}

package/es/UNSAFE_Collapsible.js

@@ -0,0 +1,264 @@
+/* @oracle/oraclejet-preact: 14.0.0 */
+import { jsx, jsxs, Fragment as Fragment$1 } from 'preact/jsx-runtime';
+import { useCallback, useState, useRef, useEffect } from 'preact/hooks';
+import { useId } from './hooks/UNSAFE_useId.js';
+import { Fragment } from 'preact';
+import "./UNSAFE_Collapsible.css";
+import { classNames } from './utils/UNSAFE_classNames.js';
+import { Flex } from './UNSAFE_Flex.js';
+import { Divider } from './UNSAFE_Divider.js';
+import { CollapseIcon } from './UNSAFE_ThemedIcons.js';
+import { IcoChevronDown as SvgIcoChevronDown, IcoChevronUp as SvgIcoChevronUp } from './UNSAFE_Icons.js';
+import { usePress } from './hooks/UNSAFE_usePress.js';
+import { useAnimation } from './hooks/UNSAFE_useAnimation.js';
+import './tslib.es6-8b94ba02.js';
+import './utils/UNSAFE_interpolations/dimensions.js';
+import './utils/UNSAFE_arrayUtils.js';
+import './utils/UNSAFE_size.js';
+import './_curry1-d822c6e1.js';
+import './utils/UNSAFE_mergeInterpolations.js';
+import './_curry3-ddab9fe1.js';
+import './_curry2-50442f66.js';
+import './_has-c4aaaf43.js';
+import './utils/UNSAFE_interpolations/boxalignment.js';
+import './keys-fed67954.js';
+import './utils/UNSAFE_interpolations/flexbox.js';
+import './utils/UNSAFE_interpolations/flexitem.js';
+import './UNSAFE_Icon.js';
+import './hooks/UNSAFE_useTooltip.js';
+import './UNSAFE_Floating.js';
+import 'preact/compat';
+import './index-14bba6f7.js';
+import './hooks/UNSAFE_useUser.js';
+import './UNSAFE_Environment.js';
+import './UNSAFE_Layer.js';
+import './utils/PRIVATE_floatingUtils.js';
+import './utils/PRIVATE_refUtils.js';
+import './hooks/UNSAFE_useOutsideClick.js';
+import './hooks/UNSAFE_useHover.js';
+import './hooks/UNSAFE_useToggle.js';
+import './hooks/UNSAFE_useFocus.js';
+import './hooks/UNSAFE_useTouch.js';
+import './utils/UNSAFE_mergeProps.js';
+import './hooks/UNSAFE_useTheme.js';
+
+/**
+ * Header icon subcomponent
+ */
+const CollapsibleHeaderIcon = ({ isExpanded, iconPosition }) => {
+    const startIcon = iconPosition === 'start' && isExpanded ? SvgIcoChevronDown : CollapseIcon;
+    const endIcon = iconPosition === 'end' && isExpanded ? SvgIcoChevronUp : SvgIcoChevronDown;
+    const Icon = iconPosition === 'start' ? startIcon : endIcon;
+    return jsx(Icon, { size: "6x" });
+};
+
+const styles$1 = {
+  base: "yyma5a",
+  expanded: "_18jw5fl",
+  disabled: "g85tn4",
+  divider: "_74tkfq"
+};
+const childrenStylesBase = {
+  base: "_6ziia4",
+  iconStart: "_1dyi5l6",
+  iconEnd: "_1m01evw"
+};
+/**
+ * Header subcomponent
+ */
+
+const CollapsibleHeader = ({
+  children,
+  id,
+  contentId,
+  isDisabled,
+  isExpanded,
+  iconPosition,
+  variant = 'basic',
+  toggleHandler
+}) => {
+  const classes = classNames([styles$1.base, variant === 'horizontal-rule' && styles$1.divider, isExpanded && variant !== 'horizontal-rule' && styles$1.expanded, isDisabled && styles$1.disabled]);
+  const childrenClasses = classNames([childrenStylesBase.base, iconPosition === 'end' && childrenStylesBase.iconEnd, iconPosition === 'start' && childrenStylesBase.iconStart]);
+  const pressHandler = useCallback(event => {
+    toggleHandler(event.target);
+  }, [toggleHandler]);
+  const {
+    pressProps
+  } = usePress(pressHandler, {
+    isDisabled,
+    isRepeat: false
+  });
+
+  const getHeader = () => jsxs(Fragment, {
+    children: [iconPosition === 'end' && jsx("div", Object.assign({
+      className: childrenClasses
+    }, {
+      children: children
+    })), jsx(CollapsibleHeaderIcon, {
+      iconPosition: iconPosition,
+      isExpanded: isExpanded
+    }), iconPosition === 'start' && jsx("div", Object.assign({
+      className: childrenClasses
+    }, {
+      children: children
+    }))]
+  });
+
+  return jsxs(Fragment$1, {
+    children: [jsx("div", Object.assign({
+      role: 'button',
+      "aria-controls": contentId,
+      "aria-expanded": isExpanded,
+      id: id,
+      tabIndex: 0,
+      className: classes
+    }, pressProps, {
+      children: jsx(Flex, Object.assign({
+        align: "center",
+        justify: iconPosition === 'start' ? 'start' : 'between'
+      }, {
+        children: getHeader()
+      }))
+    })), variant === 'horizontal-rule' && jsx(Divider, {})]
+  });
+};
+
+const styles = "_1twuo01";
+const CollapsibleContent = ({
+  children,
+  id,
+  isExpanded,
+  onTransitionEnd
+}) => {
+  const [state, setState] = useState(isExpanded ? 'expanding' : 'unmounted');
+  /**
+   * 1. On initial render, Preact sets style.maxHeight field to 0 or 'none'.
+   * 2. During expanding animation, useAnimation hook uses WAAPI to animate the maxHeight out
+   *    to the expanded value.
+   * 3. On subsequent re-renders, Preact does never updates the style.maxHeight value
+   *    because even though we are telling Preact that maxHeight should be 0 or 'none', Preact
+   *    considers the maxHeight value is 0 or 'none' as it is not aware that we changed this value
+   *    in step 2. So from Preact's perspective there is no difference.
+   */
+
+  const contentInitialStyle = useRef({
+    overflowY: 'hidden',
+    maxHeight: isExpanded ? 'none' : '0'
+  });
+  useEffect(() => {
+    // Ignore state update on initial render
+    if (state === 'unmounted' && !isExpanded) {
+      return;
+    }
+
+    setState(isExpanded ? 'expanding' : 'collapsing');
+  }, [isExpanded, state]);
+  const {
+    nodeRef
+  } = useAnimation(state, {
+    animationStates,
+    onAnimationEnd: ({
+      animationState
+    }) => {
+      if (animationState === 'collapsing') {
+        setState('unmounted');
+      }
+
+      onTransitionEnd === null || onTransitionEnd === void 0 ? void 0 : onTransitionEnd();
+    }
+  });
+  return jsx("div", Object.assign({
+    className: styles,
+    ref: nodeRef,
+    id: id,
+    tabIndex: -1,
+    style: contentInitialStyle.current,
+    "aria-hidden": !isExpanded || undefined
+  }, {
+    children: state !== 'unmounted' && children
+  }));
+};
+/**
+ * The transition from collapsed to expanded works as follows:
+ * 1. When the component is initially rendered in the collapsed state, we
+ *    explicitly set maxHeight and overflowY from "to" configuration.
+ * 2. When the expanded prop changes from false to true, we first mount the content children.
+ * 3. Once this is mounted we trigger an animation updating animationState value of useAnimationHook.
+ * 4. Configuration is represented inside hook. Passed config depends if previous animation was completed or not.
+ *    We could check that based on node.style.maxHeight.
+ *
+ * The transition from expanded to collapsed is similar:
+ * 1. We trigger an animation updating animationState value of useAnimationHook.
+ * 2. Once animation is completed, with the help of end config,we set max-Height as 'none'.
+ *    This will allow us to keep adding content.
+ * 3. Once this is done, onAnimationEnd is called(as 'from collapsed to expanded"). Here, content children are unmouunted.
+ */
+
+const animationStates = {
+  expanding: node => ({
+    to: {
+      maxHeight: `${node.scrollHeight}px`
+    },
+    options: {
+      duration: 400
+    },
+    end: {
+      maxHeight: 'none'
+    }
+  }),
+  collapsing: node => Object.assign(Object.assign({}, node.style.maxHeight === 'none' && {
+    from: {
+      maxHeight: `${node.scrollHeight}px`
+    }
+  }), {
+    to: {
+      maxHeight: '0'
+    },
+    options: {
+      duration: 400
+    }
+  })
+};
+
+/**
+ * A collapsible displays a header that can be expanded to show its content.
+ */
+const Collapsible = ({ id, header, children, isDisabled = false, isExpanded = false, iconPosition = 'start', variant = 'basic', onToggle, onTransitionEnd }) => {
+    const rootRef = useRef(null);
+    const uniqueID = useId();
+    const headerId = `oj-collapsible-header-${uniqueID}`;
+    const contentId = `oj-collapsible-content-${uniqueID}`;
+    /**
+     * Function handling toggle and invoking callback for collapsing/expanding
+     */
+    const toggleHandler = useCallback((target) => {
+        if (isDisabled) {
+            return;
+        }
+        onToggle === null || onToggle === void 0 ? void 0 : onToggle({
+            value: !isExpanded,
+            target
+        });
+    }, [isDisabled, onToggle, isExpanded]);
+    /**
+     * Function that is triggerd when animation ends
+     */
+    const transitionEndHandler = useCallback(() => {
+        onTransitionEnd === null || onTransitionEnd === void 0 ? void 0 : onTransitionEnd({
+            value: isExpanded
+        });
+    }, [onTransitionEnd, isExpanded]);
+    return (jsxs("div", Object.assign({ id: id, ref: rootRef }, { children: [jsx(CollapsibleHeader, Object.assign({ id: headerId, contentId: contentId, toggleHandler: toggleHandler, isDisabled: isDisabled, isExpanded: isExpanded, iconPosition: iconPosition, variant: variant }, { children: header })), jsx(CollapsibleContent, Object.assign({ id: contentId, isExpanded: isExpanded, onTransitionEnd: transitionEndHandler }, { children: children }))] })));
+};
+
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+
+export { Collapsible };
+/*  */
+//# sourceMappingURL=UNSAFE_Collapsible.js.map

package/es/UNSAFE_Collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UNSAFE_Collapsible.js","sources":["../../src/UNSAFE_Collapsible/CollapsibleHeaderIcon.tsx","../../src/UNSAFE_Collapsible/CollapsibleHeader.tsx","../../src/UNSAFE_Collapsible/CollapsibleContent.tsx","../../src/UNSAFE_Collapsible/Collapsible.tsx","../../src/UNSAFE_Collapsible/index.ts"],"sourcesContent":["import { ExpandIcon, CollapseIcon, CollapseUpIcon } from '../UNSAFE_ThemedIcons';\n\ntype IconProps = {\n  isExpanded: boolean;\n  iconPosition?: 'start' | 'end';\n};\n\n/**\n * Header icon subcomponent\n */\nexport const CollapsibleHeaderIcon = ({ isExpanded, iconPosition }: IconProps) => {\n  const startIcon = iconPosition === 'start' && isExpanded ? ExpandIcon : CollapseIcon;\n  const endIcon = iconPosition === 'end' && isExpanded ? CollapseUpIcon : ExpandIcon;\n  const Icon = iconPosition === 'start' ? startIcon : endIcon;\n\n  return <Icon size=\"6x\" />;\n};\n","import { Fragment } from 'preact';\nimport { useCallback } from 'preact/hooks';\n\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { Flex } from '../UNSAFE_Flex';\nimport { Divider } from '../UNSAFE_Divider';\nimport { CollapsibleHeaderIcon } from './CollapsibleHeaderIcon';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\nimport { usePress } from '../hooks/UNSAFE_usePress';\n\ntype IntrinsicProps = Pick<HTMLAttributesSignalExcluded<HTMLDivElement>, 'id' | 'children'>;\n\ntype HeaderProps = IntrinsicProps & {\n  id: string;\n  contentId: string;\n  isDisabled: boolean;\n  isExpanded: boolean;\n  iconPosition?: 'start' | 'end';\n  variant?: 'basic' | 'horizontal-rule';\n  toggleHandler: (target: EventTarget | null) => void;\n};\n\nconst styles = {\n  base: cssProps`${{\n    cursor: 'pointer',\n    '&:focus-visible': {\n      outlineStyle: 'dotted',\n      outlineOffset: '1px',\n      outlineWidth: '1px',\n      outlineColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-focus-border-color)'\n    }\n  }}`,\n  expanded: cssProps`${{\n    paddingBottom: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x)'\n  }}`,\n  disabled: cssProps`${{\n    color: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-text-color-disabled)',\n    cursor: 'auto'\n  }}`,\n  divider: cssProps`${{\n    paddingBottom: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-2x)'\n  }}`\n};\n\nconst childrenStylesBase = {\n  base: cssProps`${{\n    flexGrow: 1,\n    /* @ts-ignore */\n    '& > *': {\n      marginTop: '0 !important',\n      marginBottom: '0 !important',\n      marginLeft: '0 !important',\n      marginRight: '0 !important'\n    }\n  }}`,\n  iconStart: cssProps`${{\n    paddingInlineStart: '16px'\n  }}`,\n  iconEnd: cssProps`${{\n    paddingInlineEnd: '16px'\n  }}`\n};\n\n/**\n * Header subcomponent\n */\n\nexport const CollapsibleHeader = ({\n  children,\n  id,\n  contentId,\n  isDisabled,\n  isExpanded,\n  iconPosition,\n  variant = 'basic',\n  toggleHandler\n}: HeaderProps) => {\n  const classes = classNames([\n    styles.base,\n    variant === 'horizontal-rule' && styles.divider,\n    isExpanded && variant !== 'horizontal-rule' && styles.expanded,\n    isDisabled && styles.disabled\n  ]);\n\n  const childrenClasses = classNames([\n    childrenStylesBase.base,\n    iconPosition === 'end' && childrenStylesBase.iconEnd,\n    iconPosition === 'start' && childrenStylesBase.iconStart\n  ]);\n\n  const pressHandler = useCallback(\n    (event: Event) => {\n      toggleHandler(event.target);\n    },\n    [toggleHandler]\n  );\n\n  const { pressProps } = usePress(pressHandler, {\n    isDisabled,\n    isRepeat: false\n  });\n\n  const getHeader = () => (\n    <Fragment>\n      {iconPosition === 'end' && <div className={childrenClasses}>{children}</div>}\n      <CollapsibleHeaderIcon iconPosition={iconPosition} isExpanded={isExpanded} />\n      {iconPosition === 'start' && <div className={childrenClasses}>{children}</div>}\n    </Fragment>\n  );\n\n  return (\n    <>\n      <div\n        role={'button'}\n        aria-controls={contentId}\n        aria-expanded={isExpanded}\n        id={id}\n        tabIndex={0}\n        className={classes}\n        {...pressProps}>\n        <Flex align=\"center\" justify={iconPosition === 'start' ? 'start' : 'between'}>\n          {getHeader()}\n        </Flex>\n      </div>\n      {variant === 'horizontal-rule' && <Divider />}\n    </>\n  );\n};\n","import { JSX } from 'preact';\nimport { useState, useEffect, useRef } from 'preact/hooks';\nimport { useAnimation, UseAnimationConfig } from '../hooks/UNSAFE_useAnimation';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\n\ntype IntrinsicProps = Pick<HTMLAttributesSignalExcluded<HTMLDivElement>, 'children'>;\n\ntype ContentProps = IntrinsicProps & {\n  id: string;\n  isExpanded: boolean;\n  onTransitionEnd: () => void;\n};\n\n/**\n * The 'collapsing' and 'expanding' states are related to the animation. The 'unmounted' state\n * is used for conditional rendering. In this state, the Collapsible content is completely removed\n * from the DOM. The 'unmounted' state is set either as an initial state or when collapsing\n * animation ends.\n */\ntype Status = 'collapsing' | 'expanding' | 'unmounted';\n\nconst styles = cssProps`${{\n  /* @ts-ignore */\n  '& > *': {\n    marginTop: '0 !important',\n    marginBottom: '0 !important',\n    marginLeft: '0 !important',\n    marginRight: '0 !important'\n  }\n}}`;\n\nexport const CollapsibleContent = ({ children, id, isExpanded, onTransitionEnd }: ContentProps) => {\n  const [state, setState] = useState<Status>(isExpanded ? 'expanding' : 'unmounted');\n\n  /**\n   * 1. On initial render, Preact sets style.maxHeight field to 0 or 'none'.\n   * 2. During expanding animation, useAnimation hook uses WAAPI to animate the maxHeight out\n   *    to the expanded value.\n   * 3. On subsequent re-renders, Preact does never updates the style.maxHeight value\n   *    because even though we are telling Preact that maxHeight should be 0 or 'none', Preact\n   *    considers the maxHeight value is 0 or 'none' as it is not aware that we changed this value\n   *    in step 2. So from Preact's perspective there is no difference.\n   */\n  const contentInitialStyle = useRef<JSX.CSSProperties>({\n    overflowY: 'hidden',\n    maxHeight: isExpanded ? 'none' : '0'\n  });\n\n  useEffect(() => {\n    // Ignore state update on initial render\n    if (state === 'unmounted' && !isExpanded) {\n      return;\n    }\n    setState(isExpanded ? 'expanding' : 'collapsing');\n  }, [isExpanded, state]);\n\n  const { nodeRef } = useAnimation<Status, HTMLDivElement>(state, {\n    animationStates,\n    onAnimationEnd: ({ animationState }) => {\n      if (animationState === 'collapsing') {\n        setState('unmounted');\n      }\n      onTransitionEnd?.();\n    }\n  });\n\n  return (\n    <div\n      className={styles}\n      ref={nodeRef}\n      id={id}\n      tabIndex={-1}\n      style={contentInitialStyle.current}\n      aria-hidden={!isExpanded || undefined}>\n      {state !== 'unmounted' && children}\n    </div>\n  );\n};\n\n/**\n * The transition from collapsed to expanded works as follows:\n * 1. When the component is initially rendered in the collapsed state, we\n *    explicitly set maxHeight and overflowY from \"to\" configuration.\n * 2. When the expanded prop changes from false to true, we first mount the content children.\n * 3. Once this is mounted we trigger an animation updating animationState value of useAnimationHook.\n * 4. Configuration is represented inside hook. Passed config depends if previous animation was completed or not.\n *    We could check that based on node.style.maxHeight.\n *\n * The transition from expanded to collapsed is similar:\n * 1. We trigger an animation updating animationState value of useAnimationHook.\n * 2. Once animation is completed, with the help of end config,we set max-Height as 'none'.\n *    This will allow us to keep adding content.\n * 3. Once this is done, onAnimationEnd is called(as 'from collapsed to expanded\"). Here, content children are unmouunted.\n */\nconst animationStates: UseAnimationConfig<Status, HTMLDivElement>['animationStates'] = {\n  expanding: (node) => ({\n    to: {\n      maxHeight: `${node.scrollHeight}px`\n    },\n    options: {\n      duration: 400\n    },\n    end: {\n      maxHeight: 'none'\n    }\n  }),\n  collapsing: (node) => ({\n    ...(node.style.maxHeight === 'none' && {\n      from: {\n        maxHeight: `${node.scrollHeight}px`\n      }\n    }),\n    to: {\n      maxHeight: '0'\n    },\n    options: {\n      duration: 400\n    }\n  })\n};\n","import { ComponentChildren } from 'preact';\nimport { useRef, useCallback } from 'preact/hooks';\nimport { useId } from '../hooks/UNSAFE_useId';\nimport { CollapsibleHeader } from './CollapsibleHeader';\nimport { CollapsibleContent } from './CollapsibleContent';\n\ntype Props = {\n  /**\n   * Id of the component\n   */\n  id?: string;\n\n  /**\n   * Collapsible's header. If not specified, the header contains only an open/close icon. Note that the header text is required for JET collapsible for accessibility purposes.\n   */\n  header?: ComponentChildren;\n\n  /**\n   * The content node to be collapsed\n   */\n  children?: ComponentChildren;\n\n  /**\n   * Disables the collapsible if set to true\n   */\n  isDisabled?: boolean;\n\n  /**\n   * Specifies if the content is expanded\n   */\n  isExpanded?: boolean;\n\n  /**\n   * Changes chevron icon placement at the end of the collapsible header\n   */\n  iconPosition?: 'start' | 'end';\n\n  /**\n   * Controls the header display which con include a divider below the collapsible header\n   */\n  variant?: 'basic' | 'horizontal-rule';\n\n  /**\n   * Property that triggers a callback immediately when toggle happens and value of expanded property should be updated\n   */\n  onToggle?: (details: ToggleDetail) => void;\n\n  /**\n   * Property that triggers a callback after toggle animation is done\n   */\n  onTransitionEnd?: (details: TransitionEnd) => void;\n};\n\ntype ToggleDetail = TransitionEnd & {\n  target: EventTarget | null;\n};\n\ntype TransitionEnd = {\n  value: boolean;\n};\n\n/**\n * A collapsible displays a header that can be expanded to show its content.\n */\n\nexport const Collapsible = ({\n  id,\n  header,\n  children,\n  isDisabled = false,\n  isExpanded = false,\n  iconPosition = 'start',\n  variant = 'basic',\n  onToggle,\n  onTransitionEnd\n}: Props) => {\n  const rootRef = useRef<HTMLDivElement>(null);\n  const uniqueID = useId();\n  const headerId = `oj-collapsible-header-${uniqueID}`;\n  const contentId = `oj-collapsible-content-${uniqueID}`;\n\n  /**\n   * Function handling toggle and invoking callback for collapsing/expanding\n   */\n  const toggleHandler = useCallback(\n    (target: EventTarget | null) => {\n      if (isDisabled) {\n        return;\n      }\n      onToggle?.({\n        value: !isExpanded,\n        target\n      });\n    },\n    [isDisabled, onToggle, isExpanded]\n  );\n\n  /**\n   * Function that is triggerd when animation ends\n   */\n  const transitionEndHandler = useCallback(() => {\n    onTransitionEnd?.({\n      value: isExpanded\n    });\n  }, [onTransitionEnd, isExpanded]);\n\n  return (\n    <div id={id} ref={rootRef}>\n      <CollapsibleHeader\n        id={headerId}\n        contentId={contentId}\n        toggleHandler={toggleHandler}\n        isDisabled={isDisabled}\n        isExpanded={isExpanded}\n        iconPosition={iconPosition}\n        variant={variant}>\n        {header}\n      </CollapsibleHeader>\n      <CollapsibleContent\n        id={contentId}\n        isExpanded={isExpanded}\n        onTransitionEnd={transitionEndHandler}>\n        {children}\n      </CollapsibleContent>\n    </div>\n  );\n};\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 */\nexport { Collapsible } from './Collapsible';\n"],"names":["ExpandIcon","CollapseUpIcon","_jsx","styles","childrenStylesBase","CollapsibleHeader","children","id","contentId","isDisabled","isExpanded","iconPosition","variant","toggleHandler","base","divider","expanded","iconEnd","iconStart","pressHandler","useCallback","event","target","pressProps","usePress","isRepeat","_jsxs","_Fragment","Object","assign","role","tabIndex","className","classes","Flex","align","justify","getHeader","Divider","CollapsibleContent","onTransitionEnd","state","setState","useState","overflowY","nodeRef","useAnimation","onAnimationEnd","animationState","ref","style","contentInitialStyle","current","undefined","animationStates","expanding","node","to","maxHeight","scrollHeight","options","duration","end","collapsing","from"],"mappings":"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"}

package/es/UNSAFE_Collection.js

@@ -0,0 +1,10 @@
+/* @oracle/oraclejet-preact: 14.0.0 */
+/**
+ * @license
+ * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.
+ * The Universal Permissive License (UPL), Version 1.0
+ * as shown at https://oss.oracle.com/licenses/upl/
+ * @ignore
+ */
+/*  */
+//# sourceMappingURL=UNSAFE_Collection.js.map

package/es/UNSAFE_Collection.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"UNSAFE_Collection.js","sources":["../../src/UNSAFE_Collection/index.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\n/**\n * These are the Collection-related types, the actual Collection component has been moved to PRIVATE_Collection as it is not meant to be used by consumers\n */\nexport { DataState, Range, FlattenedDataState } from './DataState';\nexport {\n  CurrentKeyDetail,\n  HierarchicalItemContext,\n  ItemContext,\n  ListItemContext,\n  Metadata,\n  SelectionMode,\n  SelectionDetail,\n  SingleSelectionDetail,\n  ItemActionDetail,\n  CurrentItemVariant,\n  ViewportInfo\n} from './Collection.types';\n"],"names":[],"mappings":";AAAA;;;;;;AAMG;;;"}

package/es/UNSAFE_ComponentMessage.css

@@ -0,0 +1,3 @@
+._1lfv7q{box-sizing:border-box;display:flex;flex-wrap:wrap;}
+
+.u1i9r9{overflow-x:hidden;overflow-y:hidden;}