@oracle/oraclejet-preact 15.1.8 → 15.1.9

package/amd/AvatarVariants.styles.css

@@ -1,116 +1,116 @@
-.AvatarVariants_multiVariantStyles_size_2xs__4ilptg0 {
+.AvatarVariants_multiVariantStyles_size_2xs__1h7waq80 {
   --size__n2nsgo2: var(--sizes-2xs-size__n2nsgo12);
   --initialsFontSize__n2nsgo4: var(--sizes-2xs-initialsFontSize__n2nsgo14);
   --initialsFontWeight__n2nsgo5: var(--sizes-2xs-initialsFontWeight__n2nsgo15);
   --iconFontSize__n2nsgo6: var(--sizes-2xs-iconFontSize__n2nsgo16);
 }
-.AvatarVariants_multiVariantStyles_size_xs__4ilptg1 {
+.AvatarVariants_multiVariantStyles_size_xs__1h7waq81 {
   --size__n2nsgo2: var(--sizes-xs-size__n2nsgo17);
   --initialsFontSize__n2nsgo4: var(--sizes-xs-initialsFontSize__n2nsgo19);
   --initialsFontWeight__n2nsgo5: var(--sizes-xs-initialsFontWeight__n2nsgo1a);
   --iconFontSize__n2nsgo6: var(--sizes-xs-iconFontSize__n2nsgo1b);
 }
-.AvatarVariants_multiVariantStyles_size_sm__4ilptg2 {
+.AvatarVariants_multiVariantStyles_size_sm__1h7waq82 {
   --size__n2nsgo2: var(--sizes-sm-size__n2nsgo1c);
   --initialsFontSize__n2nsgo4: var(--sizes-sm-initialsFontSize__n2nsgo1e);
   --initialsFontWeight__n2nsgo5: var(--sizes-sm-initialsFontWeight__n2nsgo1f);
   --iconFontSize__n2nsgo6: var(--sizes-sm-iconFontSize__n2nsgo1g);
 }
-.AvatarVariants_multiVariantStyles_size_md__4ilptg3 {
+.AvatarVariants_multiVariantStyles_size_md__1h7waq83 {
   --size__n2nsgo2: var(--sizes-md-size__n2nsgo1h);
   --initialsFontSize__n2nsgo4: var(--sizes-md-initialsFontSize__n2nsgo1j);
   --initialsFontWeight__n2nsgo5: var(--sizes-md-initialsFontWeight__n2nsgo1k);
   --iconFontSize__n2nsgo6: var(--sizes-md-iconFontSize__n2nsgo1l);
 }
-.AvatarVariants_multiVariantStyles_size_lg__4ilptg4 {
+.AvatarVariants_multiVariantStyles_size_lg__1h7waq84 {
   --size__n2nsgo2: var(--sizes-lg-size__n2nsgo1m);
   --initialsFontSize__n2nsgo4: var(--sizes-lg-initialsFontSize__n2nsgo1o);
   --initialsFontWeight__n2nsgo5: var(--sizes-lg-initialsFontWeight__n2nsgo1p);
   --iconFontSize__n2nsgo6: var(--sizes-lg-iconFontSize__n2nsgo1q);
 }
-.AvatarVariants_multiVariantStyles_size_xl__4ilptg5 {
+.AvatarVariants_multiVariantStyles_size_xl__1h7waq85 {
   --size__n2nsgo2: var(--sizes-xl-size__n2nsgo1r);
   --initialsFontSize__n2nsgo4: var(--sizes-xl-initialsFontSize__n2nsgo1t);
   --initialsFontWeight__n2nsgo5: var(--sizes-xl-initialsFontWeight__n2nsgo1u);
   --iconFontSize__n2nsgo6: var(--sizes-xl-iconFontSize__n2nsgo1v);
 }
-.AvatarVariants_multiVariantStyles_size_2xl__4ilptg6 {
+.AvatarVariants_multiVariantStyles_size_2xl__1h7waq86 {
   --size__n2nsgo2: var(--sizes-2xl-size__n2nsgo1w);
   --initialsFontSize__n2nsgo4: var(--sizes-2xl-initialsFontSize__n2nsgo1y);
   --initialsFontWeight__n2nsgo5: var(--sizes-2xl-initialsFontWeight__n2nsgo1z);
   --iconFontSize__n2nsgo6: var(--sizes-2xl-iconFontSize__n2nsgo20);
 }
-.AvatarVariants_multiVariantStyles_background_neutral__4ilptg7 {
+.AvatarVariants_multiVariantStyles_background_neutral__1h7waq87 {
   --bgColor__n2nsgo0: var(--colors-neutral-bgColor__n2nsgo8);
   --pattern__n2nsgo7: var(--colors-neutral-pattern__n2nsgo9);
   --textColor__n2nsgo1: var(--colors-neutral-textColor__n2nsgoa);
 }
-.AvatarVariants_multiVariantStyles_background_orange__4ilptg8 {
+.AvatarVariants_multiVariantStyles_background_orange__1h7waq88 {
   --bgColor__n2nsgo0: var(--colors-orange-bgColor__n2nsgob);
   --pattern__n2nsgo7: var(--colors-orange-pattern__n2nsgoc);
   --textColor__n2nsgo1: var(--colors-orange-textColor__n2nsgod);
 }
-.AvatarVariants_multiVariantStyles_background_green__4ilptg9 {
+.AvatarVariants_multiVariantStyles_background_green__1h7waq89 {
   --bgColor__n2nsgo0: var(--colors-green-bgColor__n2nsgoe);
   --pattern__n2nsgo7: var(--colors-green-pattern__n2nsgof);
   --textColor__n2nsgo1: var(--colors-green-textColor__n2nsgog);
 }
-.AvatarVariants_multiVariantStyles_background_teal__4ilptga {
+.AvatarVariants_multiVariantStyles_background_teal__1h7waq8a {
   --bgColor__n2nsgo0: var(--colors-teal-bgColor__n2nsgoh);
   --pattern__n2nsgo7: var(--colors-teal-pattern__n2nsgoi);
   --textColor__n2nsgo1: var(--colors-teal-textColor__n2nsgoj);
 }
-.AvatarVariants_multiVariantStyles_background_blue__4ilptgb {
+.AvatarVariants_multiVariantStyles_background_blue__1h7waq8b {
   --bgColor__n2nsgo0: var(--colors-blue-bgColor__n2nsgok);
   --pattern__n2nsgo7: var(--colors-blue-pattern__n2nsgol);
   --textColor__n2nsgo1: var(--colors-blue-textColor__n2nsgom);
 }
-.AvatarVariants_multiVariantStyles_background_slate__4ilptgc {
+.AvatarVariants_multiVariantStyles_background_slate__1h7waq8c {
   --bgColor__n2nsgo0: var(--colors-slate-bgColor__n2nsgon);
   --pattern__n2nsgo7: var(--colors-slate-pattern__n2nsgoo);
   --textColor__n2nsgo1: var(--colors-slate-textColor__n2nsgop);
 }
-.AvatarVariants_multiVariantStyles_background_pink__4ilptgd {
+.AvatarVariants_multiVariantStyles_background_pink__1h7waq8d {
   --bgColor__n2nsgo0: var(--colors-pink-bgColor__n2nsgoq);
   --pattern__n2nsgo7: var(--colors-pink-pattern__n2nsgor);
   --textColor__n2nsgo1: var(--colors-pink-textColor__n2nsgos);
 }
-.AvatarVariants_multiVariantStyles_background_purple__4ilptge {
+.AvatarVariants_multiVariantStyles_background_purple__1h7waq8e {
   --bgColor__n2nsgo0: var(--colors-purple-bgColor__n2nsgot);
   --pattern__n2nsgo7: var(--colors-purple-pattern__n2nsgou);
   --textColor__n2nsgo1: var(--colors-purple-textColor__n2nsgov);
 }
-.AvatarVariants_multiVariantStyles_background_lilac__4ilptgf {
+.AvatarVariants_multiVariantStyles_background_lilac__1h7waq8f {
   --bgColor__n2nsgo0: var(--colors-lilac-bgColor__n2nsgow);
   --pattern__n2nsgo7: var(--colors-lilac-pattern__n2nsgox);
   --textColor__n2nsgo1: var(--colors-lilac-textColor__n2nsgoy);
 }
-.AvatarVariants_multiVariantStyles_background_gray__4ilptgg {
+.AvatarVariants_multiVariantStyles_background_gray__1h7waq8g {
   --bgColor__n2nsgo0: var(--colors-gray-bgColor__n2nsgoz);
   --pattern__n2nsgo7: var(--colors-gray-pattern__n2nsgo10);
   --textColor__n2nsgo1: var(--colors-gray-textColor__n2nsgo11);
 }
-.AvatarVariants_multiVariantStyles_shape_circle__4ilptgh {
+.AvatarVariants_multiVariantStyles_shape_circle__1h7waq8h {
   --borderRadius__n2nsgo3: var(--shapes-circle-borderRadius__n2nsgo21);
 }
-.AvatarVariants_multiVariantStyles_compound_0__4ilptgj {
+.AvatarVariants_multiVariantStyles_compound_0__1h7waq8j {
   --borderRadius__n2nsgo3: var(--sizes-2xs-borderRadius__n2nsgo13);
 }
-.AvatarVariants_multiVariantStyles_compound_1__4ilptgk {
+.AvatarVariants_multiVariantStyles_compound_1__1h7waq8k {
   --borderRadius__n2nsgo3: var(--sizes-xs-borderRadius__n2nsgo18);
 }
-.AvatarVariants_multiVariantStyles_compound_2__4ilptgl {
+.AvatarVariants_multiVariantStyles_compound_2__1h7waq8l {
   --borderRadius__n2nsgo3: var(--sizes-sm-borderRadius__n2nsgo1d);
 }
-.AvatarVariants_multiVariantStyles_compound_3__4ilptgm {
+.AvatarVariants_multiVariantStyles_compound_3__1h7waq8m {
   --borderRadius__n2nsgo3: var(--sizes-md-borderRadius__n2nsgo1i);
 }
-.AvatarVariants_multiVariantStyles_compound_4__4ilptgn {
+.AvatarVariants_multiVariantStyles_compound_4__1h7waq8n {
   --borderRadius__n2nsgo3: var(--sizes-lg-borderRadius__n2nsgo1n);
 }
-.AvatarVariants_multiVariantStyles_compound_5__4ilptgo {
+.AvatarVariants_multiVariantStyles_compound_5__1h7waq8o {
   --borderRadius__n2nsgo3: var(--sizes-xl-borderRadius__n2nsgo1s);
 }
-.AvatarVariants_multiVariantStyles_compound_6__4ilptgp {
+.AvatarVariants_multiVariantStyles_compound_6__1h7waq8p {
   --borderRadius__n2nsgo3: var(--sizes-2xl-borderRadius__n2nsgo1x);
 }

package/amd/AvatarVariants.styles2.css

@@ -1,116 +1,116 @@
-.AvatarVariants_multiVariantStyles_size_2xs__1h7waq80 {
+.AvatarVariants_multiVariantStyles_size_2xs__4ilptg0 {
   --size__n2nsgo2: var(--sizes-2xs-size__n2nsgo12);
   --initialsFontSize__n2nsgo4: var(--sizes-2xs-initialsFontSize__n2nsgo14);
   --initialsFontWeight__n2nsgo5: var(--sizes-2xs-initialsFontWeight__n2nsgo15);
   --iconFontSize__n2nsgo6: var(--sizes-2xs-iconFontSize__n2nsgo16);
 }
-.AvatarVariants_multiVariantStyles_size_xs__1h7waq81 {
+.AvatarVariants_multiVariantStyles_size_xs__4ilptg1 {
   --size__n2nsgo2: var(--sizes-xs-size__n2nsgo17);
   --initialsFontSize__n2nsgo4: var(--sizes-xs-initialsFontSize__n2nsgo19);
   --initialsFontWeight__n2nsgo5: var(--sizes-xs-initialsFontWeight__n2nsgo1a);
   --iconFontSize__n2nsgo6: var(--sizes-xs-iconFontSize__n2nsgo1b);
 }
-.AvatarVariants_multiVariantStyles_size_sm__1h7waq82 {
+.AvatarVariants_multiVariantStyles_size_sm__4ilptg2 {
   --size__n2nsgo2: var(--sizes-sm-size__n2nsgo1c);
   --initialsFontSize__n2nsgo4: var(--sizes-sm-initialsFontSize__n2nsgo1e);
   --initialsFontWeight__n2nsgo5: var(--sizes-sm-initialsFontWeight__n2nsgo1f);
   --iconFontSize__n2nsgo6: var(--sizes-sm-iconFontSize__n2nsgo1g);
 }
-.AvatarVariants_multiVariantStyles_size_md__1h7waq83 {
+.AvatarVariants_multiVariantStyles_size_md__4ilptg3 {
   --size__n2nsgo2: var(--sizes-md-size__n2nsgo1h);
   --initialsFontSize__n2nsgo4: var(--sizes-md-initialsFontSize__n2nsgo1j);
   --initialsFontWeight__n2nsgo5: var(--sizes-md-initialsFontWeight__n2nsgo1k);
   --iconFontSize__n2nsgo6: var(--sizes-md-iconFontSize__n2nsgo1l);
 }
-.AvatarVariants_multiVariantStyles_size_lg__1h7waq84 {
+.AvatarVariants_multiVariantStyles_size_lg__4ilptg4 {
   --size__n2nsgo2: var(--sizes-lg-size__n2nsgo1m);
   --initialsFontSize__n2nsgo4: var(--sizes-lg-initialsFontSize__n2nsgo1o);
   --initialsFontWeight__n2nsgo5: var(--sizes-lg-initialsFontWeight__n2nsgo1p);
   --iconFontSize__n2nsgo6: var(--sizes-lg-iconFontSize__n2nsgo1q);
 }
-.AvatarVariants_multiVariantStyles_size_xl__1h7waq85 {
+.AvatarVariants_multiVariantStyles_size_xl__4ilptg5 {
   --size__n2nsgo2: var(--sizes-xl-size__n2nsgo1r);
   --initialsFontSize__n2nsgo4: var(--sizes-xl-initialsFontSize__n2nsgo1t);
   --initialsFontWeight__n2nsgo5: var(--sizes-xl-initialsFontWeight__n2nsgo1u);
   --iconFontSize__n2nsgo6: var(--sizes-xl-iconFontSize__n2nsgo1v);
 }
-.AvatarVariants_multiVariantStyles_size_2xl__1h7waq86 {
+.AvatarVariants_multiVariantStyles_size_2xl__4ilptg6 {
   --size__n2nsgo2: var(--sizes-2xl-size__n2nsgo1w);
   --initialsFontSize__n2nsgo4: var(--sizes-2xl-initialsFontSize__n2nsgo1y);
   --initialsFontWeight__n2nsgo5: var(--sizes-2xl-initialsFontWeight__n2nsgo1z);
   --iconFontSize__n2nsgo6: var(--sizes-2xl-iconFontSize__n2nsgo20);
 }
-.AvatarVariants_multiVariantStyles_background_neutral__1h7waq87 {
+.AvatarVariants_multiVariantStyles_background_neutral__4ilptg7 {
   --bgColor__n2nsgo0: var(--colors-neutral-bgColor__n2nsgo8);
   --pattern__n2nsgo7: var(--colors-neutral-pattern__n2nsgo9);
   --textColor__n2nsgo1: var(--colors-neutral-textColor__n2nsgoa);
 }
-.AvatarVariants_multiVariantStyles_background_orange__1h7waq88 {
+.AvatarVariants_multiVariantStyles_background_orange__4ilptg8 {
   --bgColor__n2nsgo0: var(--colors-orange-bgColor__n2nsgob);
   --pattern__n2nsgo7: var(--colors-orange-pattern__n2nsgoc);
   --textColor__n2nsgo1: var(--colors-orange-textColor__n2nsgod);
 }
-.AvatarVariants_multiVariantStyles_background_green__1h7waq89 {
+.AvatarVariants_multiVariantStyles_background_green__4ilptg9 {
   --bgColor__n2nsgo0: var(--colors-green-bgColor__n2nsgoe);
   --pattern__n2nsgo7: var(--colors-green-pattern__n2nsgof);
   --textColor__n2nsgo1: var(--colors-green-textColor__n2nsgog);
 }
-.AvatarVariants_multiVariantStyles_background_teal__1h7waq8a {
+.AvatarVariants_multiVariantStyles_background_teal__4ilptga {
   --bgColor__n2nsgo0: var(--colors-teal-bgColor__n2nsgoh);
   --pattern__n2nsgo7: var(--colors-teal-pattern__n2nsgoi);
   --textColor__n2nsgo1: var(--colors-teal-textColor__n2nsgoj);
 }
-.AvatarVariants_multiVariantStyles_background_blue__1h7waq8b {
+.AvatarVariants_multiVariantStyles_background_blue__4ilptgb {
   --bgColor__n2nsgo0: var(--colors-blue-bgColor__n2nsgok);
   --pattern__n2nsgo7: var(--colors-blue-pattern__n2nsgol);
   --textColor__n2nsgo1: var(--colors-blue-textColor__n2nsgom);
 }
-.AvatarVariants_multiVariantStyles_background_slate__1h7waq8c {
+.AvatarVariants_multiVariantStyles_background_slate__4ilptgc {
   --bgColor__n2nsgo0: var(--colors-slate-bgColor__n2nsgon);
   --pattern__n2nsgo7: var(--colors-slate-pattern__n2nsgoo);
   --textColor__n2nsgo1: var(--colors-slate-textColor__n2nsgop);
 }
-.AvatarVariants_multiVariantStyles_background_pink__1h7waq8d {
+.AvatarVariants_multiVariantStyles_background_pink__4ilptgd {
   --bgColor__n2nsgo0: var(--colors-pink-bgColor__n2nsgoq);
   --pattern__n2nsgo7: var(--colors-pink-pattern__n2nsgor);
   --textColor__n2nsgo1: var(--colors-pink-textColor__n2nsgos);
 }
-.AvatarVariants_multiVariantStyles_background_purple__1h7waq8e {
+.AvatarVariants_multiVariantStyles_background_purple__4ilptge {
   --bgColor__n2nsgo0: var(--colors-purple-bgColor__n2nsgot);
   --pattern__n2nsgo7: var(--colors-purple-pattern__n2nsgou);
   --textColor__n2nsgo1: var(--colors-purple-textColor__n2nsgov);
 }
-.AvatarVariants_multiVariantStyles_background_lilac__1h7waq8f {
+.AvatarVariants_multiVariantStyles_background_lilac__4ilptgf {
   --bgColor__n2nsgo0: var(--colors-lilac-bgColor__n2nsgow);
   --pattern__n2nsgo7: var(--colors-lilac-pattern__n2nsgox);
   --textColor__n2nsgo1: var(--colors-lilac-textColor__n2nsgoy);
 }
-.AvatarVariants_multiVariantStyles_background_gray__1h7waq8g {
+.AvatarVariants_multiVariantStyles_background_gray__4ilptgg {
   --bgColor__n2nsgo0: var(--colors-gray-bgColor__n2nsgoz);
   --pattern__n2nsgo7: var(--colors-gray-pattern__n2nsgo10);
   --textColor__n2nsgo1: var(--colors-gray-textColor__n2nsgo11);
 }
-.AvatarVariants_multiVariantStyles_shape_circle__1h7waq8h {
+.AvatarVariants_multiVariantStyles_shape_circle__4ilptgh {
   --borderRadius__n2nsgo3: var(--shapes-circle-borderRadius__n2nsgo21);
 }
-.AvatarVariants_multiVariantStyles_compound_0__1h7waq8j {
+.AvatarVariants_multiVariantStyles_compound_0__4ilptgj {
   --borderRadius__n2nsgo3: var(--sizes-2xs-borderRadius__n2nsgo13);
 }
-.AvatarVariants_multiVariantStyles_compound_1__1h7waq8k {
+.AvatarVariants_multiVariantStyles_compound_1__4ilptgk {
   --borderRadius__n2nsgo3: var(--sizes-xs-borderRadius__n2nsgo18);
 }
-.AvatarVariants_multiVariantStyles_compound_2__1h7waq8l {
+.AvatarVariants_multiVariantStyles_compound_2__4ilptgl {
   --borderRadius__n2nsgo3: var(--sizes-sm-borderRadius__n2nsgo1d);
 }
-.AvatarVariants_multiVariantStyles_compound_3__1h7waq8m {
+.AvatarVariants_multiVariantStyles_compound_3__4ilptgm {
   --borderRadius__n2nsgo3: var(--sizes-md-borderRadius__n2nsgo1i);
 }
-.AvatarVariants_multiVariantStyles_compound_4__1h7waq8n {
+.AvatarVariants_multiVariantStyles_compound_4__4ilptgn {
   --borderRadius__n2nsgo3: var(--sizes-lg-borderRadius__n2nsgo1n);
 }
-.AvatarVariants_multiVariantStyles_compound_5__1h7waq8o {
+.AvatarVariants_multiVariantStyles_compound_5__4ilptgo {
   --borderRadius__n2nsgo3: var(--sizes-xl-borderRadius__n2nsgo1s);
 }
-.AvatarVariants_multiVariantStyles_compound_6__1h7waq8p {
+.AvatarVariants_multiVariantStyles_compound_6__4ilptgp {
   --borderRadius__n2nsgo3: var(--sizes-2xl-borderRadius__n2nsgo1x);
 }

package/amd/Badge-7661241a.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './hooks/UNSAFE_useComponentTheme', './UNSAFE_Badge/themes/redwood/BadgeTheme'], (function(e,s,n,o){"use strict";e.Badge=function({variant:e,size:t,edge:d,children:a}){const{classes:i}=n.useComponentTheme(o.BadgeRedwoodTheme,{variant:e,size:t,edge:d});return s.jsx("span",{class:i,children:a})}}));
+//# sourceMappingURL=Badge-7661241a.js.map

package/amd/Badge-7661241a.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Badge-7661241a.js","sources":["../../src/UNSAFE_Badge/Badge.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 { useComponentTheme } from '../hooks/UNSAFE_useComponentTheme';\nimport { BadgeStyles, BadgeVariantOptions } from './themes/BadgeStyles.css';\nimport { BadgeRedwoodTheme } from './themes/redwood/BadgeTheme';\n\nexport type Props = {\n  /**\n   * Sets the variant for the badge. Badge can be subtle or solid with different colors. The default value of this property is theme driven.\n   */\n  variant?:\n    | 'neutral'\n    | 'neutralSubtle'\n    | 'danger'\n    | 'dangerSubtle'\n    | 'success'\n    | 'successSubtle'\n    | 'warning'\n    | 'warningSubtle'\n    | 'info'\n    | 'infoSubtle';\n  /**\n   * Specifies the size of the badge. Consists of two options: Medium and small. The default value of this property is theme driven.\n   */\n  size?: 'sm' | 'md';\n  /**\n   * Specifies the edge of the badge. Badges can be attached to the end edge of another component. They lose their default corner rounding on right side for ltr direction or left side for rtl direction.\n   */\n  edge?: 'none' | 'end';\n  /**\n   * Specifies the string that will be rendered in the badge.\n   */\n  children: string;\n};\n\nexport function Badge({ variant, size, edge, children }: Props) {\n  const { classes } = useComponentTheme<BadgeVariantOptions, BadgeStyles>(BadgeRedwoodTheme, {\n    variant,\n    size,\n    edge\n  });\n\n  return <span class={classes}>{children}</span>;\n}\n"],"names":["variant","size","edge","children","classes","useComponentTheme","BadgeRedwoodTheme","_jsx","class"],"mappings":"8JAwCM,UAAgBA,QAAEA,EAAOC,KAAEA,EAAIC,KAAEA,EAAIC,SAAEA,IAC3C,MAAMC,QAAEA,GAAYC,EAAiBA,kBAAmCC,oBAAmB,CACzFN,UACAC,OACAC,SAGF,OAAOK,EAAAA,YAAMC,MAAOJ,EAAUD,SAAAA,GAChC"}

package/amd/BaseButton-4ad2e1a7.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './hooks/UNSAFE_usePress', './hooks/UNSAFE_useHover', './hooks/UNSAFE_useActive', './utils/UNSAFE_classNames', 'preact/compat', 'module', './utils/UNSAFE_interpolations/dimensions', './utils/UNSAFE_mergeInterpolations', './utils/PRIVATE_clientHints', './hooks/UNSAFE_useTabbableMode', './utils/UNSAFE_mergeProps', './clientHints-243241bd', './classNames-111575ef'], (function(e,t,s,o,n,a,i,r,u,l,c,d,b,p,h){"use strict";const m="_1y7aj1u",_="x0yykv",v="_1rybf6h",f="_9nxx9u",y="_1cctmsl",A="_3jks10",E="_14kd67i",k="_1wbh3zg",N="_4bi7wz",S="wboi1u",g="_1wgtcl4",x="_8z0k92",F="eknbie",j="_1njbgbf",P=[...Object.values(u.dimensionInterpolations)],T=l.mergeInterpolations(P),U="ios"===p.getClientHints().platform?{ontouchstart:function(){}}:{},H="events"===p.getClientHints().hoverSupport,w=i.forwardRef((({variant:e="outlined",isDisabled:a=!1,isRepeat:i=!1,size:r="md",elementDetails:u={type:"button"},styling:l=["default"],edge:c="none","aria-label":p,"aria-hidden":P,"aria-expanded":w,"aria-roledescription":B,"aria-haspopup":M,"aria-describedby":R,onBlur:I,onFocus:z,onMouseEnter:D,onMouseLeave:C,onTouchEnd:L,onTouchStart:O,...$},q)=>{const{pressProps:V}=s.usePress((e=>{$.onAction&&$.onAction({reason:"keyup"==e.type?"keyboard":"pointer"})}),{isDisabled:a,isRepeat:i}),G=e=>l.indexOf(e)>-1,{hoverProps:J,isHover:K}=o.useHover({isDisabled:!H}),{activeProps:Q,isActive:W}=n.useActive(),{class:X,...Y}=T($),{type:Z="button",...ee}={...u},te=((e,t)=>{switch(e){case"link":return{role:"link"};case"button":return{};default:return t?{role:"none"}:{role:"button"}}})(Z,P??!1),se=u.type,oe="span"==se,ne="button"==se,{isTabbable:ae}=d.useTabbableMode(),ie=h.classNames([!G("unstyled")&&m,G("unstyled")&&A,G("embedded")&&S,G("container")&&N,G("noBorderRadiusStart")&&g,G("noBorderRadiusEnd")&&x,G("active")&&v,G("fill")&&k,G("min")&&E,`oj-c-base-button-${e}`,`oj-c-base-button-${r}`,a&&F,"bottom"===c&&j,!H&&!oe&&!W&&f,!H&&oe&&!W&&!a&&!G("container")&&y,H&&K&&!W&&!a&&!G("container")&&_,!G("container")&&W&&!a&&v,"qe2t7e"]),re={onBlur:I,onFocus:z,onMouseEnter:D,onMouseLeave:C,onTouchEnd:L,onTouchStart:O},ue=b.mergeProps(ee,V,U,J,G("container")?{}:Q,ne?{}:{"aria-disabled":a},re),le=h.classNames([X,ie]);return t.jsx(se,{ref:q,disabled:a,class:le,style:Y,autofocus:$.autofocus,title:$.title,tabIndex:a||!ae?-1:0,"aria-label":p,"aria-haspopup":M?"menu":void 0,"aria-describedby":R,"aria-hidden":P,"aria-roledescription":B,"aria-expanded":w,...ue,...te,children:$.children})}));e.BaseButton=w}));
+//# sourceMappingURL=BaseButton-4ad2e1a7.js.map

package/amd/BaseButton-4ad2e1a7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseButton-4ad2e1a7.js","sources":["../../src/UNSAFE_BaseButton/BaseButton.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 { ComponentChildren } from 'preact';\nimport { usePress } from '../hooks/UNSAFE_usePress';\nimport { useHover } from '../hooks/UNSAFE_useHover';\nimport { useActive } from '../hooks/UNSAFE_useActive';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { forwardRef, ForwardedRef } from 'preact/compat';\nimport { cssProps } from '@oracle/oraclejet-cssprops';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { dimensionInterpolations } from '../utils/UNSAFE_interpolations/dimensions';\nimport { mergeInterpolations } from '../utils/UNSAFE_mergeInterpolations';\nimport { getClientHints } from '../utils/PRIVATE_clientHints';\nimport { useTabbableMode } from '../hooks/UNSAFE_useTabbableMode';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\n\nexport type ActionDetail = {\n  reason: 'pointer' | 'keyboard';\n};\n\ntype BaseButtonElementDetails =\n  | { type: 'button' }\n  | { type: 'a'; href: string; target?: string; rel?: string }\n  | { type: 'span' };\n\ntype IntrinsicProps = Pick<\n  HTMLAttributesSignalExcluded<HTMLElement>,\n  | 'autofocus'\n  | 'title'\n  | 'onBlur'\n  | 'onFocus'\n  | 'onMouseEnter'\n  | 'onMouseLeave'\n  | 'onTouchEnd'\n  | 'onTouchStart'\n>;\nexport type StylingOptions =\n  | 'default'\n  | 'min'\n  | 'embedded'\n  | 'container'\n  | 'unstyled'\n  | 'fill'\n  | 'noBorderRadiusEnd'\n  | 'noBorderRadiusStart'\n  | 'active';\n\ntype AriaProps = {\n  'aria-hidden'?: boolean;\n  'aria-expanded'?: boolean;\n  'aria-roledescription'?: string;\n  'aria-describedby'?: string;\n  'aria-haspopup'?: string;\n};\n\nexport type Props = IntrinsicProps &\n  AriaProps &\n  DimensionProps & {\n    /**\n     *The default slot is the button's text label. The oj-c-base-button element accepts plain text or DOM nodes as children for the default slot.\"\n     */\n    children?: 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     *\n     * Indicates in what states the button has chrome (background and border).\n     *     \"ghost\": \"Ghost buttons are the least prominent variation.  Ghost buttons are\n     * useful for performing low-priority tasks, such as manipulating the UI.\",\n     *     \"borderless\"': \"Borderless buttons are a more prominent variation. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"solid\"': \"Solid buttons stand out, and direct the user's attention to the\n     *  most important actions in the UI.\",\n     *     \"callToAction\"': \"A Call To Action (CTA) button guides the user to take or\n     * complete the action that is the main goal of the page or page section. There\n     * should only be one CTA button on a page at any given time.\",\n     *     \"danger\"': \"A Danger button alerts the user to a dangerous situation.\"\n     */\n    variant?: 'ghost' | 'borderless' | 'outlined' | 'solid' | 'callToAction' | 'danger';\n\n    /**\n     * The size indicates how large the button is rendered: 'xs', \"sm\", \"md\" (default), \"lg\".\n     */\n    size?: 'xs' | 'sm' | 'md' | 'lg';\n\n    /**\n     * 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: \"bottom\" or \"none\" (default).\n     */\n    edge?: 'none' | 'bottom';\n\n    /**\n     * The aria-label is used to provide guidance for screen readers.\n     */\n    'aria-label'?: string;\n\n    /**\n     * Styling can be used for customizing buttons by removing label padding (\"min\") or\n     * removing all styling (\"unstyled\").\n     */\n    styling?: StylingOptions[];\n\n    /**\n     * Triggered when a button is clicked, whether by keyboard, mouse, or touch events.\n     */\n    onAction?: (details: ActionDetail) => void;\n\n    /**\n     * Indicate element type and associated details\n     */\n    elementDetails?: BaseButtonElementDetails;\n  };\n\nconst activeStyles = {\n  backgroundImage:\n    'linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-overlay-active), var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-overlay-active))',\n  borderColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-color-active)',\n  color: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-color-active)'\n};\n\nconst hoverStyles = {\n  backgroundImage:\n    'linear-gradient(var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-overlay-hover),var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-overlay-hover))',\n  borderColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-color-hover)',\n  color: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-color-hover)'\n};\n\nconst compStyles = {\n  base: cssProps`${{\n    alignItems: 'center',\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-color)',\n    borderColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-color)',\n    borderRadius: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-radius)',\n    borderStyle: 'solid',\n    borderWidth: '1px',\n    boxSizing: 'border-box',\n    color: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-color)',\n    cursor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-cursor-clickable)',\n    display: 'inline-block',\n    fontFamily: 'inherit',\n    fontSize: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-font-size)',\n    fontWeight: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-font-weight)',\n    height: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-height)',\n    justifyContent: 'center',\n    minWidth: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-height)',\n    overflowX: 'hidden',\n    overflowY: 'hidden',\n    paddingInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-to-edge-padding)',\n    paddingInlineEnd: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-to-edge-padding)',\n    paddingTop: 0,\n    paddingBottom: 0,\n    pointerEvents: 'auto',\n    textOverflow: 'ellipsis',\n    verticalAlign: 'top',\n    WebkitTapHighlightColor: 'rgba(0,0,0,0)',\n    whiteSpace: 'nowrap',\n\n    // @ts-ignore\n    '&:active': activeStyles,\n\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\n  hover: cssProps`${{\n    // @ts-ignore\n    '&:not(:active)': hoverStyles\n  }}`,\n\n  active: cssProps`${activeStyles}`,\n\n  pseudohover: cssProps`${{\n    // @ts-ignore\n    '@media(hover: hover)': {\n      '&:hover:enabled:not(:active)': hoverStyles\n    }\n  }}`,\n\n  pseudohoverSpan: cssProps`${{\n    // @ts-ignore\n    '@media(hover: hover)': {\n      '&:hover:not(:active)': hoverStyles\n    }\n  }}`,\n\n  unstyled: cssProps`${{\n    boxSizing: 'border-box',\n    cursor: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-cursor-clickable)',\n    height: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-height)'\n  }}`,\n\n  min: cssProps`${{\n    paddingInlineStart: '0',\n    paddingInlineEnd: '0'\n  }}`,\n\n  fill: cssProps`${{\n    width: '100%'\n  }}`,\n\n  container: cssProps`\n   ${{\n     backgroundColor: 'transparent',\n     borderStyle: 'hidden',\n     cursor: 'none',\n     display: 'flex',\n     '&:active': {\n       backgroundColor: 'transparent',\n       borderColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-color)'\n     }\n   }}\n `,\n\n  embedded: cssProps`\n   ${{\n     height: '100%',\n     display: 'flex',\n     '&:focus-visible': {\n       outlineStyle: 'none'\n     }\n   }}\n `,\n\n  noBorderRadiusStart: cssProps`\n ${{\n   borderStartStartRadius: 0,\n   borderEndStartRadius: 0,\n   borderInlineStartWidth: '0px'\n }}\n `,\n\n  noBorderRadiusEnd: cssProps`\n ${{\n   borderEndEndRadius: 0,\n   borderStartEndRadius: 0,\n   borderInlineEndWidth: '0px'\n }}\n `,\n\n  disabled: cssProps`${{\n    pointerEvents: 'none',\n    backgroundColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-bg-color-disabled)',\n    borderColor: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-border-color-disabled)',\n    color: 'var(--oj-c-PRIVATE-DO-NOT-USE-base-button-text-color-disabled)'\n  }}`,\n\n  bottom: cssProps`${{\n    borderLeftWidth: '0',\n    borderRightWidth: '0',\n    borderBlockEndWidth: '0',\n    width: '100%',\n    borderTopLeftRadius: '0',\n    borderTopRightRadius: '0'\n  }}`\n};\n\nconst childrenStyles = cssProps`${{\n  /* @ts-ignore */\n  '& > *': {\n    marginTop: '0 !important',\n    marginBottom: '0 !important',\n    marginLeft: '0 !important',\n    marginRight: '0 !important'\n  }\n}}`;\n\nconst interpolations = [...Object.values(dimensionInterpolations)];\n\nconst styleInterpolations = mergeInterpolations<Props>(interpolations);\n\nconst clientHints = getClientHints();\n// :active only works on IOS devices if a touch handler exists\nconst iosProps = clientHints.platform === 'ios' ? { ontouchstart: function () {} } : {};\nconst isHybrid = getClientHints().hoverSupport === 'events';\n\nconst roleProps = (\n  elType: string,\n  hidden: boolean\n): { role?: HTMLAttributesSignalExcluded['role'] } => {\n  switch (elType) {\n    case 'link':\n      return { role: 'link' };\n    case 'button':\n      return {};\n    default:\n      return hidden ? { role: 'none' } : { role: 'button' };\n  }\n};\n\nexport const BaseButton = forwardRef(\n  (\n    {\n      variant = 'outlined',\n      isDisabled = false,\n      isRepeat = false,\n      size = 'md',\n      elementDetails = { type: 'button' },\n      styling = ['default'],\n      edge = 'none',\n      'aria-label': accessibleLabel,\n      'aria-hidden': ariaHidden,\n      'aria-expanded': ariaExpanded,\n      'aria-roledescription': ariaRoledescription,\n      'aria-haspopup': ariaHasPopup,\n      'aria-describedby': ariaDescribedBy,\n      onBlur,\n      onFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onTouchEnd,\n      onTouchStart,\n      ...props\n    }: Props,\n    ref?:\n      | ForwardedRef<HTMLButtonElement>\n      | ForwardedRef<HTMLAnchorElement>\n      | ForwardedRef<HTMLSpanElement>\n  ) => {\n    const pressHandler = (e: Event) => {\n      if (props.onAction) {\n        props.onAction({\n          reason: e.type == 'keyup' ? 'keyboard' : 'pointer'\n        });\n      }\n    };\n\n    const { pressProps } = usePress(pressHandler, {\n      isDisabled,\n      isRepeat\n    });\n    const isStyled = (name: StylingOptions) => {\n      return styling.indexOf(name) > -1;\n    };\n    const { hoverProps, isHover } = useHover({ isDisabled: !isHybrid });\n    const { activeProps, isActive } = useActive();\n    const { class: cls, ...styles } = styleInterpolations(props);\n    const { type: elementType = 'button', ...elementProps } = { ...elementDetails };\n    const role = roleProps(elementType, ariaHidden ?? false);\n    const ElementType = elementDetails.type;\n    const isSpan = ElementType == 'span';\n    const isBaseButton = ElementType == 'button';\n    const { isTabbable } = useTabbableMode();\n    const rootStyles = classNames([\n      !isStyled('unstyled') && compStyles.base,\n      isStyled('unstyled') && compStyles.unstyled,\n      isStyled('embedded') && compStyles.embedded,\n      isStyled('container') && compStyles.container,\n      isStyled('noBorderRadiusStart') && compStyles.noBorderRadiusStart,\n      isStyled('noBorderRadiusEnd') && compStyles.noBorderRadiusEnd,\n      isStyled('active') && compStyles.active,\n      isStyled('fill') && compStyles.fill,\n      isStyled('min') && compStyles.min,\n      `oj-c-base-button-${variant}`,\n      `oj-c-base-button-${size}`,\n      isDisabled && compStyles.disabled,\n      edge === 'bottom' && compStyles.bottom,\n      !isHybrid && !isSpan && !isActive && compStyles.pseudohover,\n      !isHybrid &&\n        isSpan &&\n        !isActive &&\n        !isDisabled &&\n        !isStyled('container') &&\n        compStyles.pseudohoverSpan,\n      isHybrid && isHover && !isActive && !isDisabled && !isStyled('container') && compStyles.hover,\n      !isStyled('container') && isActive && !isDisabled && compStyles.active,\n      childrenStyles\n    ]);\n\n    const globalEventProps = {\n      onBlur,\n      onFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onTouchEnd,\n      onTouchStart\n    };\n\n    const mergedProps = mergeProps(\n      elementProps,\n      pressProps,\n      iosProps,\n      hoverProps,\n      isStyled('container') ? {} : activeProps,\n      isBaseButton ? {} : { 'aria-disabled': isDisabled },\n      globalEventProps\n    );\n\n    const wrapperClasses = classNames([cls, rootStyles]);\n\n    return (\n      <ElementType\n        // The ref casting was done to satisfy TS compiler, when the forwardRef had to be updated to ForwardedRef.\n        ref={\n          ref as ForwardedRef<HTMLButtonElement> &\n            ForwardedRef<HTMLAnchorElement> &\n            ForwardedRef<HTMLSpanElement>\n        }\n        disabled={isDisabled}\n        class={wrapperClasses}\n        style={styles}\n        autofocus={props['autofocus']}\n        title={props.title}\n        tabIndex={isDisabled || !isTabbable ? -1 : 0}\n        aria-label={accessibleLabel}\n        aria-haspopup={ariaHasPopup ? 'menu' : undefined}\n        aria-describedby={ariaDescribedBy}\n        aria-hidden={ariaHidden}\n        aria-roledescription={ariaRoledescription}\n        aria-expanded={ariaExpanded}\n        {...mergedProps}\n        {...role}>\n        {props.children}\n      </ElementType>\n    );\n  }\n);\n"],"names":["compStyles","interpolations","Object","values","dimensionInterpolations","styleInterpolations","mergeInterpolations","iosProps","getClientHints","platform","ontouchstart","isHybrid","hoverSupport","BaseButton","forwardRef","variant","isDisabled","isRepeat","size","elementDetails","type","styling","edge","accessibleLabel","ariaHidden","ariaExpanded","ariaRoledescription","ariaHasPopup","ariaDescribedBy","onBlur","onFocus","onMouseEnter","onMouseLeave","onTouchEnd","onTouchStart","props","ref","pressProps","usePress","e","reason","isStyled","name","hoverProps","isHover","useHover","class","cls","styles","elementType","elementProps","roleProps","elType","hidden","role","ElementType","isSpan","isBaseButton","isTabbable","useTabbableMode","isActive","globalEventProps","mergedProps","mergeProps","activeProps","disabled","wrapperClasses","style","autofocus","title","tabIndex","undefined","children"],"mappings":"+bAkIA,MAcAA,aAAAA,WAAAA,EA8CkB,WA9ClBA,YAAAA,aAAAA,YAAAA,aAAAA,aAAAA,EAwFE,UAxFFA,EAkGE,SAlGFA,EA0GE,WA1GFA,EAkHE,UAlHFA,WAAAA,aA+IAC,EAAA,IAAAC,OAAAC,OAAAC,EAAAA,0BAEAC,EAAAC,EAAAA,oBAAAL,GAIAM,EAAA,QAFAC,EAAAA,iBAEAC,SAAA,CAAAC,aAAA,WAAA,GAAA,GACAC,EAAA,WAAAH,EAAAA,iBAAAI,aAgBAC,EAAAC,EAAAA,YAAA,EAAAC,UAAA,WAAAC,cAAA,EAAAC,YAAA,EAAAC,OAAA,KAAAC,iBAAA,CAAAC,KAAA,UAAAC,UAAA,CAAA,WAAAC,OAAA,OAAA,aAAAC,EAAA,cAAAC,EAAA,gBAAAC,EAAA,uBAAAC,EAAA,gBAAAC,EAAA,mBAAAC,EAAAC,SAAAC,UAAAC,eAAAC,eAAAC,aAAAC,kBAAAC,GAAAC,KA6BI,MAQAC,WAAAA,GAAAC,EAAAA,UARAC,4BAGMC,OAAA,SAAAD,EAAAnB,KAAA,WAAA,WAEH,GAGH,2BAIAqB,EAAAC,oBAGAC,WAAAA,EAAAC,QAAAA,GAAAC,WAAA,CAAA7B,YAAAL,8CAEAmC,MAAAC,KAAAC,GAAA3C,EAAA8B,IACAf,KAAA6B,EAAA,YAAAC,IAAA,IAAA/B,MA7DJgC,EAAAC,EAAAC,KAIE,OAAAD,GACE,IAAA,OACE,MAAA,CAAAE,KAAA,QACF,IAAA,SACE,MAAA,GACF,QACE,OAAAD,EAAA,CAAAC,KAAA,QAAA,CAAAA,KAAA,UACH,YAoDCC,GAAApC,EAAAC,KACAoC,GAAA,QAAAD,GACAE,GAAA,UAAAF,IACAG,WAAAA,IAAAC,EAAAA,oCAEElB,EAAA,aAAAzC,EACAyC,EAAA,aAAAzC,EACAyC,EAAA,aAAAzC,EACAyC,EAAA,cAAAzC,EACAyC,EAAA,wBAAAzC,EACAyC,EAAA,sBAAAzC,EACAyC,EAAA,WAAAzC,EACAyC,EAAA,SAAAzC,EACAyC,EAAA,QAAAzC,EACA,oBAAAe,IACA,oBAAAG,SAEA,WAAAI,GAAAtB,kBAEAW,QAEEiD,IACA5C,oBAEAhB,EACFW,GAAAiC,IAAAgB,IAAA5C,IAAAyB,EAAA,cAAAzC,GACAyC,EAAA,cAAAmB,IAAA5C,GAAAhB,EApGL,WAwGG6D,GAAA,+EASAC,GAAAC,EAAAA,WAAAb,GAAAb,EAAA9B,EAAAoC,EAAAF,EAAA,aAAA,CAAA,EAAAuB,EAAAP,GAAA,CAAA,EAAA,CAAA,gBAAAzC,GAAA6C,6CAeIzB,IAAAA,EAAA6B,SAAAjD,EAAA8B,MAAAoB,GAAAC,MAAAnB,EAAAoB,UAAAjC,EAAA,UAAAkC,MAAAlC,EAAAkC,MAAAC,SAAAtD,IAAA0C,IAAA,EAAA,EAAA,aAAAnC,EAAA,gBAAAI,EAAA,YAAA4C,EAAA,mBAAA3C,EAAA,cAAAJ,EAAA,uBAAAE,EAAA,gBAAAD,KAAAqC,MAAAR,GAAAkB,SAAArC,EAAAqC,UAAA"}

package/amd/Button-aa58e172.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './UNSAFE_BaseButton', './UNSAFE_ButtonLayout', 'preact/compat', './ButtonLayout-34033f1d', './BaseButton-4ad2e1a7'], (function(e,o,t,n,a,s,i){"use strict";const u=a.forwardRef((({variant:e="outlined",isDisabled:t=!1,isRepeat:n=!1,size:a="md",display:u="all",endIcon:r,startIcon:c,autofocus:d,edge:l,onAction:B,label:b="","aria-label":f,"aria-describedby":h,width:p,onBlur:y,onFocus:E,onMouseEnter:L,onMouseLeave:m,onTouchEnd:v,onTouchStart:x},A)=>{const F=!c&&!r||"label"===u,I=F?b:o.jsx(s.ButtonLayout,{display:u,startIcon:c,endIcon:r,size:a,children:b});return o.jsx(i.BaseButton,{ref:A,isDisabled:t,isRepeat:n,size:a,width:p,autofocus:d,edge:l,variant:e,styling:[F?"default":"min"],onAction:B,"aria-label":f??b,"aria-describedby":h,onBlur:y,onFocus:E,onMouseEnter:L,onMouseLeave:m,onTouchEnd:v,onTouchStart:x,children:I})}));e.Button=u}));
+//# sourceMappingURL=Button-aa58e172.js.map

package/amd/Button-aa58e172.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-aa58e172.js","sources":["../../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, Ref } from 'preact';\nimport { BaseButton } from '../UNSAFE_BaseButton';\nimport { ButtonLayout } from '../UNSAFE_ButtonLayout';\nimport type { DimensionProps } from '../utils/UNSAFE_interpolations/dimensions';\nimport { forwardRef } from 'preact/compat';\nimport { HTMLAttributesSignalExcluded } from '../utils/UNSAFE_attributeUtils';\n\ntype IntrinsicProps = Pick<\n  HTMLAttributesSignalExcluded<HTMLElement>,\n  | 'autofocus'\n  | 'onBlur'\n  | 'onFocus'\n  | 'onMouseEnter'\n  | 'onMouseLeave'\n  | 'onTouchEnd'\n  | 'onTouchStart'\n>;\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     * aria-label - override label for accessibility\n     */\n    'aria-label'?: string;\n\n    /**\n     * Indicates in what states the button has chrome (background and border).\n     *     \"ghost\": \"Ghost buttons are the least prominent variation. Ghost buttons are\n     * useful for performing low-priority tasks, such as manipulating the UI.\",\n     *     \"borderless\"': \"Borderless buttons are a more prominent variation. Borderless\n     * buttons are useful for supplemental actions that require minimal emphasis.\",\n     *     \"outlined\"': \"Outlined buttons are salient, but lighter weight than\n     * solid buttons. Outlined buttons are useful for secondary actions.\",\n     *     \"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?: 'sm' | 'md' | 'lg';\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 only the label or all elements should be rendered by the button.\n     */\n    display?: 'label' | 'all';\n\n    /**\n     * The ID of an element (or space separated IDs of multiple elements) that\n     * describes the button.\n     */\n    'aria-describedby'?: string;\n  };\n/**\n * A button is a pressable element that invokes an action.\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      'aria-label': accessibleLabel,\n      'aria-describedby': ariaDescribedBy,\n      width,\n      onBlur,\n      onFocus,\n      onMouseEnter,\n      onMouseLeave,\n      onTouchEnd,\n      onTouchStart\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        aria-label={accessibleLabel ?? label}\n        aria-describedby={ariaDescribedBy}\n        onBlur={onBlur}\n        onFocus={onFocus}\n        onMouseEnter={onMouseEnter}\n        onMouseLeave={onMouseLeave}\n        onTouchEnd={onTouchEnd}\n        onTouchStart={onTouchStart}>\n        {content}\n      </BaseButton>\n    );\n  }\n);\n"],"names":["Button","forwardRef","variant","isDisabled","isRepeat","size","display","endIcon","startIcon","autofocus","edge","onAction","label","accessibleLabel","ariaDescribedBy","width","onBlur","onFocus","onMouseEnter","onMouseLeave","onTouchEnd","onTouchStart","ref","labelOnly","content","_jsx","jsx","ButtonLayout","children","BaseButton","styling"],"mappings":"8LA0GO,MAAMA,EAASC,EAAUA,YAC9B,EAEIC,UAAU,WACVC,cAAa,EACbC,YAAW,EACXC,OAAO,KACPC,UAAU,MACVC,UACAC,YACAC,YACAC,OACAC,WACAC,QAAQ,GACR,aAAcC,EACd,mBAAoBC,EACpBC,QACAC,SACAC,UACAC,eACAC,eACAC,aACAC,gBAEFC,KAEA,MAAMC,GAAcf,IAAcD,GAAwB,UAAZD,EACxCkB,EAAUD,IAGdE,EAAAC,IAACC,eAAa,CAAArB,QAASA,EAASE,UAAWA,EAAWD,QAASA,EAASF,KAAMA,EAAIuB,SAC/EhB,IAGL,OACEa,EAACC,IAAAG,cACCP,IAAKA,EACLnB,WAAYA,EACZC,SAAUA,EACVC,KAAMA,EACNU,MAAOA,EACPN,UAAWA,EACXC,KAAMA,EACNR,QAASA,EACT4B,QAAS,CAACP,EAAY,UAAY,OAClCZ,SAAUA,EAAQ,aACNE,GAAmBD,qBACbE,EAClBE,OAAQA,EACRC,QAASA,EACTC,aAAcA,EACdC,aAAcA,EACdC,WAAYA,EACZC,aAAcA,WACbG,GAEH"}

package/amd/ButtonLayout-34033f1d.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', 'module', './utils/UNSAFE_classNames', './UNSAFE_Text', './classNames-111575ef', './Text-ffce2777'], (function(s,n,e,t,c,l,a){"use strict";const i="xrkttb",o="_18h8wuy",d="_3ubesl",r="_13dwipn",u="jvh2qn",x="_188wimb",f="wtv1i6",h="_1bve61n",j="_1c35x4n",b=s=>null==s;s.ButtonLayout=function({size:s="md",display:e="all",styling:t="default",...c}){const m="all"===e||"icons"===e,p="all"===e||"label"===e,I=j,_=c.startIcon&&("icons"===e||!c.children)&&!c.endIcon,y="embedded"===t,N=!b(c.startIcon)&&"all"===e,w=!b(c.endIcon)&&"all"===e,$=!b(c.startIcon)&&!b(c.endIcon),v=$&&"icons"===e,T=`${d} oj-c-button-layout-${s} ${h}`,g=l.classNames([d,y?`oj-c-button-layout-embedded-${s}`:`oj-c-button-layout-${s}`,!_&&x,v&&f]),A=l.classNames([i,N&&!c.suffix&&!$&&u,w&&!$&&r]),E=l.classNames([o,N&&!$&&u]);return n.jsxs("span",{class:I,children:[m&&c.startIcon&&n.jsx("span",{class:g,children:c.startIcon}),p&&c.children&&n.jsxs("span",{class:A,children:[" ",c.children," "]}),p&&c.suffix&&n.jsx("span",{class:E,children:n.jsx(a.Text,{truncation:"ellipsis",weight:"inherit",children:c.suffix})}),m&&c.endIcon&&n.jsx("span",{class:T,children:c.endIcon})]})}}));
+//# sourceMappingURL=ButtonLayout-34033f1d.js.map

package/amd/ButtonLayout-34033f1d.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ButtonLayout-34033f1d.js","sources":["../../src/UNSAFE_ButtonLayout/ButtonLayout.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';\nimport { Text } from '../UNSAFE_Text';\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 suffix is appended to the text label, used for menu buttons.\n   */\n  suffix?: 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   * 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-block'\n    }}\n  `,\n  suffix: cssProps`\n    ${{\n      fontWeight: '300',\n      overflowX: 'hidden',\n      overflowY: 'hidden',\n      textOverflow: 'ellipsis',\n      whiteSpace: 'nowrap',\n      marginInlineStart: 'var(--oj-c-PRIVATE-DO-NOT-USE-core-spacing-1x)',\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  startIconWhenBothIconsOnly: cssProps`\n  ${{\n    marginInlineEnd: 0,\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 = !isNullOrUndefined(props.startIcon) && !isNullOrUndefined(props.endIcon);\n  const isTwoIconsOnly = isTwoIcons && display === 'icons';\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.startIcon,\n    isTwoIconsOnly && compStyles.startIconWhenBothIconsOnly\n  ]);\n  const textStyles = classNames([\n    compStyles.text,\n    textStartIcon && !props.suffix && !isTwoIcons && compStyles.endText,\n    textEndIcon && !isTwoIcons && compStyles.startText\n  ]);\n  const suffixStyles = classNames([\n    compStyles.suffix,\n    textStartIcon && !isTwoIcons && compStyles.endText\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      {showText && props.suffix && (\n        <span class={suffixStyles}>\n          <Text truncation={'ellipsis'} weight={'inherit'}>\n            {props.suffix}\n          </Text>\n        </span>\n      )}\n      {showIcons && props.endIcon && <span class={endIconClass}>{props.endIcon}</span>}\n    </span>\n  );\n}\n"],"names":["compStyles","isNullOrUndefined","value","size","display","styling","props","labelClass","isEmbedded","textStartIcon","startIcon","textEndIcon","endIcon","isTwoIcons","isTwoIconsOnly","endIconClass","isOnlyIcon","_jsxs","class","children","showIcons","_jsx","startIconStyles","showText","textStyles","suffix","suffixStyles","jsx","Text","truncation","weight"],"mappings":"8KAoDA,MAAAA,EASG,SATHA,EAoBG,WApBHA,EA8BG,UA9BHA,EAoCG,WApCHA,EA0CG,SA1CHA,EAiDC,WAjDDA,EAwDG,SAxDHA,EA+DC,WA/DDA,aA6EAC,EAAAC,GAGEA,uBAGF,UAAAC,KAAAA,EAAA,KAAAC,QAAAA,EAAA,MAAAC,QAAAA,EAAA,aAAAC,4DAQEC,EAAAP,wDAEAQ,EAAA,aAAAH,EACAI,GAAAR,EAAAK,EAAAI,YAAA,QAAAN,EACAO,GAAAV,EAAAK,EAAAM,UAAA,QAAAR,EACAS,GAAAZ,EAAAK,EAAAI,aAAAT,EAAAK,EAAAM,SACAE,EAAAD,GAAA,UAAAT,EAEAW,EAAA,GAAAf,wBAAAG,KAAAH,oBAEEA,kEAEAgB,GAAAhB,yBAIAA,sBAEAW,IAAAE,GAAAb,oBAGAA,EACAS,IAAAI,GAAAb,IAGF,OAAAiB,EAAAA,KAAA,OAAA,CAAAC,MAAAX,EAAAY,SAAA,CAAAC,GAAAd,EAAAI,WAAAW,EAAAA,IAAA,OAAA,CAAAH,MAAAI,EAAAH,SAAAb,EAAAI,YAAAa,GAAAjB,EAAAa,UAAAF,EAAAA,KAAA,OAAA,CAAAC,MAAAM,EAAAL,SAAA,CAAA,IAAAb,EAAAa,SAAA,OAAAI,GAAAjB,EAAAmB,QAAAJ,EAAAA,IAAA,OAAA,CAAAH,MAAAQ,EAAAP,SAAAE,EAAAM,IAAAC,OAAA,CAAAC,WAAA,WAAAC,OAAA,UAAAX,SAAAb,EAAAmB,WAAAL,GAAAd,EAAAM,SAAAS,EAAAA,IAAA,OAAA,CAAAH,MAAAH,EAAAI,SAAAb,EAAAM,YAcF"}

package/amd/CardGrid-470fcdcd.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', 'preact/hooks', './utils/UNSAFE_mergeProps', './utils/UNSAFE_keys', './utils/PRIVATE_collectionUtils', './hooks/UNSAFE_useId', './hooks/PRIVATE_useCurrentKey', './hooks/PRIVATE_useCollectionFocusRing', './hooks/PRIVATE_useTabbableModeSet', './hooks/PRIVATE_useSelection', './UNSAFE_Grid', './UNSAFE_Selector', './UNSAFE_Skeleton', './SkeletonContainer-1e690820', './PRIVATE_LoadMoreCollection', 'preact/compat', './utils/UNSAFE_classNames', './utils/PRIVATE_refUtils', './hooks/UNSAFE_useAnimation', './hooks/UNSAFE_useTabbableMode', './UNSAFE_FocusTrap', './UNSAFE_CardGrid/themes/CardGridStyles.css', './classNames-111575ef', './useAnimation-a7663391', './FocusTrap-8f7605f9', './LoadMoreCollection-c91aac19', './Skeleton-995f4d9a'], (function(e,t,i,o,n,s,r,a,l,c,u,d,y,m,f,h,p,b,g,x,A,S,k,C,w,E,v,F){"use strict";const R="oj-cardgrid-item",K="."+R;const T=e=>({animationStates:{slideUp:{from:{translateY:"50px"},to:{translateY:"0px"},options:{duration:300,delay:50*e,easing:[0,0,.2,1]}},slideDown:{from:{translateY:"-50px"},to:{translateY:"0"},options:{duration:300,delay:50*e,easing:[0,0,.2,1]}}},isAnimatedOnMount:!0}),M=e=>({animationStates:{opacity:{from:{opacity:0},to:{opacity:1},options:{duration:150,delay:50*e,easing:"linear"}}},isAnimatedOnMount:!0}),N=p.memo((function({children:e,itemKey:o,itemIndex:n,isTabbable:s,isFocused:a,isFocusRingVisible:l,isSelected:c,selectionMode:u,initialAnimation:d,setCardDimension:y}){const m=i.useRef(null),f=k.multiVariantStyles({itemFocused:a&&l?"isItemFocused":"isNotItemFocused",itemInitialOpacity:d?"isTransparent":"isNotTransparent"}),h=C.classNames([R,k.styles.itemStyle,f]);i.useLayoutEffect((()=>{const e=m.current?.firstElementChild;y&&e&&y({width:e.offsetWidth,height:e.offsetHeight})}),[]);const{nodeRef:p}=w.useAnimation(d||"none",T(n)),{nodeRef:b}=w.useAnimation(d?"opacity":"none",M(n)),x=i.useMemo((()=>g.mergeRefs(m,p,b)),[m,p,b,d]);return t.jsx("div",{id:r.useId(),ref:x,class:h,role:"gridcell","data-oj-key":o,onKeyDown:e=>{!s||"ArrowDown"!==e.key&&"ArrowUp"!==e.key&&"ArrowLeft"!==e.key&&"ArrowRight"!==e.key||e.stopPropagation()},"aria-selected":"none"===u?void 0:c,..."number"==typeof o&&{"data-oj-key-type":"number"},children:t.jsx(A.TabbableModeContext.Provider,{value:{isTabbable:s},children:t.jsx(E.FocusTrap,{isDisabled:!s,restoreFocusRef:!1,children:e})})})}),((e,t)=>!(!e||!t)&&(e.itemKey===t.itemKey&&e.itemIndex===t.itemIndex&&e.itemData===t.itemData&&e.isTabbable===t.isTabbable&&e.isFocused===t.isFocused&&e.isFocusRingVisible===t.isFocusRingVisible&&e.isSelected===t.isSelected&&e.initialAnimation===t.initialAnimation)));const I={all:!1,keys:new Set},P={xs:12,sm:16,md:24,lg:48,xl:64},_=260,j=(e,i,o)=>[...Array(e)].map((()=>t.jsx(f.SkeletonContainer,{minimumCount:1,children:()=>t.jsx(F.Skeleton,{height:`calc(${o||300}px)`})},i&&r.useId()+(new Date).getTime()))),U=e=>t.jsx(d.Grid,{...e,children:j(25)}),D=(e,i,o,n)=>{if(!o)return;const s={...e};o&&!i&&(s.gridTemplateColumns=`repeat(auto-fit, ${_}px)`);const r=[],a=[],l=o-i%o;if(l>0){const e=j(l,!0,n);r.push(e),a.push(l)}const c=o;if(l<c){const e=j(c,!0,n);r.push(e),a.push(c)}return r.map(((e,i)=>t.jsx("div",{...0==i&&{class:v.LOADMORE_STYLE_CLASS},style:{gridColumn:`span ${a[i]}`},children:t.jsx(d.Grid,{...s,children:e})})))},V=(e,t,i)=>{if(!t||!i)return 0;return Math.floor((i+e)/(e+t))};e.CardGrid=function({children:e,data:r,onLoadMore:m=(()=>{}),hasMore:f=!1,getRowKey:h,currentKey:p,onCurrentKeyChange:b,selectionMode:g="none",selectedKeys:x=I,onSelectionChange:A,viewportConfig:S,"aria-label":C,"aria-labelledby":w,initialAnimation:E="slideUp",gutterSize:F="sm"}){const R=i.useRef(null),T=i.useRef(),M=i.useRef(),j=i.useRef(!0),[L,B]=i.useState(0),[G,O]=i.useState({width:0,height:0}),Y=P[F],$={gap:Y/4+"x",gridTemplateColumns:G.width?`repeat(auto-fit, ${G.width}px)`:void 0},z="none"===g?void 0:"multiple"===g,W=f||!r||0===L?-1:Math.ceil(r?.length/L);i.useEffect((()=>{G.width&&L&&(j.current=!1)}),[G.width&&L]);const H=i.useCallback((e=>{const t=V(Y,G.width||_,e);t>0&&B(t)}),[Y,G.width]);i.useEffect((()=>{const e=R?.current;e&&H(e.offsetWidth)}),[H]);const q=i.useCallback((e=>{for(const t of e)H(t.contentRect.width)}),[H]);i.useEffect((()=>{const e=R.current;if(e){const t=new ResizeObserver((e=>{q(e)}));return t.observe(e),()=>{t.unobserve(e)}}}),[q]);const J=e=>!!R.current?.contains(e);let Q=!1;const[X,Z]=c.useTabbableModeSet(J,(e=>s.keyExtractor(e,K)),p,((e,t)=>{J(e)&&(t?(Q=!0,setTimeout((()=>{R.current?.focus()}),0)):R.current?.focus())}),(e=>{b&&b({value:e})})),{currentKeyProps:ee}=a.useCurrentKey((e=>s.keyExtractor(e,K)),"multiple"!==g,(()=>s.getPrevNextKeyByCount(r,h,p,-L)),(()=>s.getPrevNextKeyByCount(r,h,p,L)),(()=>s.getPrevNextKeyByCount(r,h,p,-1)),(()=>s.getPrevNextKeyByCount(r,h,p,1)),p,b),[te,ie]=l.useCollectionFocusRing(J,["ArrowUp","ArrowDown","ArrowLeft","ArrowRight"]);i.useEffect((()=>{if(null!=p&&R.current){const e=s.findElementByKey(R.current,p,K);if(e){e.scrollIntoView({block:"nearest"});const t=e.closest("[role=gridcell]");t&&R.current.setAttribute("aria-activedescendant",t.id)}}}),[p,r]);const oe=i.useCallback((e=>{A&&(!1===e.value.all&&e.value.keys.size>0&&(T.current=Array.from(e.value.keys.values()).pop()),A(e))}),[T,A]),ne=i.useCallback((e=>{if(r&&A){const t=s.handleSelectionRange(e,r,h);Array.isArray(t)&&A({value:{all:!1,keys:new Set(t)},target:null})}}),[r,A,m]),{selectionProps:se}=u.useSelection((e=>e===R.current?void 0===p?null:p:s.keyExtractor(e,K)),x,g,!1,"replace",!1,oe,T.current,p,((e,t)=>()=>s.getPrevNextKeyByCount(r,h,e,t?-L:L)),((e,t)=>()=>s.getPrevNextKeyByCount(r,h,e,t?-1:1)),(e=>{if(R.current){const t=s.findElementByKey(R.current,e,K);t&&t.scrollIntoView({block:"nearest"})}}),ne),re=i.useCallback((e=>{const i=h(e.data),o="multiple"===g?()=>t.jsx(y.Selector,{onChange:A,rowKey:i,selectedKeys:x}):void 0;return{index:e.index,data:e.data,metadata:{key:i},selector:o,isSelected:n.containsKey(x,i)}}),[g,x,A]),ae=D($,r?.length||0,L,G.height);S=s.getViewportConfig(R,S);const le=t.jsx("div",{role:"row",children:t.jsx(d.Grid,{...$,children:t.jsx(v.LoadMoreCollection,{data:r,hasMore:f,onLoadMore:m,loadMoreIndicator:ae,loadMoreThreshold:Y+4,viewportConfig:S,children:i=>{const o=re(i),n=X(o.metadata.key),s=p===o.metadata.key&&!n,r=s&&te&&!Q,a=o.isSelected;return(i=>t.jsx(N,{itemKey:o.metadata.key,itemIndex:o.index,itemData:o.data,isTabbable:n,isFocused:s,isFocusRingVisible:r,isSelected:a,selectionMode:g,...j.current&&{initialAnimation:E},...0===i.index&&{setCardDimension:O},children:e(i)},o.metadata.key))(o)}})})});return t.jsx("div",{...o.mergeProps(Z,ee,ie,se,{onFocus:()=>{if(!n.isKeyDefined(p)&&b&&X(void 0)&&R.current){const e=M.current||s.getFirstVisibleKey(R.current,K);n.isKeyDefined(e)&&b({value:e})}},onPointerDown:e=>{const t=s.keyExtractor(e.target,K);n.isKeyDefined(t)&&(M.current=t)}}),ref:R,role:"grid",class:k.styles.baseStyle,tabIndex:0,"aria-label":C,"aria-labelledby":w,"aria-multiselectable":z,"aria-rowcount":W,"aria-colcount":L,children:null==r?U($):le})}}));
+//# sourceMappingURL=CardGrid-470fcdcd.js.map

package/amd/CardGrid-470fcdcd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CardGrid-470fcdcd.js","sources":["../../src/UNSAFE_CardGrid/CardGridItem.tsx","../../src/UNSAFE_CardGrid/CardGrid.tsx"],"sourcesContent":["/**\n * @license\n * Copyright (c) %FIRST_YEAR% %CURRENT_YEAR%, Oracle and/or its affiliates.\n * The Universal Permissive License (UPL), Version 1.0\n * as shown at https://oss.oracle.com/licenses/upl/\n * @ignore\n */\nimport { ComponentChildren } from 'preact';\nimport { memo } from 'preact/compat';\nimport { useRef, useLayoutEffect, useMemo, StateUpdater } from 'preact/hooks';\nimport { classNames } from '../utils/UNSAFE_classNames';\nimport { mergeRefs } from '../utils/PRIVATE_refUtils';\nimport { useId } from '../hooks/UNSAFE_useId';\nimport { useAnimation, UseAnimationConfig } from '../hooks/UNSAFE_useAnimation';\nimport { TabbableModeContext } from '../hooks/UNSAFE_useTabbableMode';\nimport { FocusTrap } from '../UNSAFE_FocusTrap';\nimport { SelectionMode } from '../UNSAFE_Collection';\nimport { multiVariantStyles, styles } from './themes/CardGridStyles.css';\n\nexport const ITEM_STYLE_CLASS = 'oj-cardgrid-item';\nexport const ITEM_SELECTOR = '.' + ITEM_STYLE_CLASS;\n\n/**\n * Props for the CardGridItem Component\n */\nexport type Props<K, D> = {\n  children: ComponentChildren;\n  itemKey: K;\n  itemIndex: number;\n  itemData: D;\n  isTabbable: boolean;\n  isFocused: boolean;\n  isFocusRingVisible: boolean;\n  isSelected: boolean;\n  selectionMode: SelectionMode;\n  initialAnimation?: 'slideUp' | 'slideDown';\n  setCardDimension?: StateUpdater<{ width: number; height: number }>;\n};\n\n/**\n * The internal component used to render a single item in CardGrid.\n */\nexport function CardGridItem<K extends string | number, D>({\n  children,\n  itemKey,\n  itemIndex,\n  isTabbable,\n  isFocused,\n  isFocusRingVisible,\n  isSelected,\n  selectionMode,\n  initialAnimation,\n  setCardDimension\n}: Props<K, D>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  const variantClasses = multiVariantStyles({\n    itemFocused: isFocused && isFocusRingVisible ? 'isItemFocused' : 'isNotItemFocused',\n    itemInitialOpacity: initialAnimation ? 'isTransparent' : 'isNotTransparent'\n  });\n  const classes = classNames([ITEM_STYLE_CLASS, styles.itemStyle, variantClasses]);\n\n  // don't bubble Arrow Up/Down/Left/Right events to parent when in isTabbable mode\n  // this bubbling causes the outer CollectionFocus ring to change index while in the isTabbable mode.\n  const handleKeyDown = (event: KeyboardEvent) => {\n    if (\n      isTabbable &&\n      (event.key === 'ArrowDown' ||\n        event.key === 'ArrowUp' ||\n        event.key === 'ArrowLeft' ||\n        event.key === 'ArrowRight')\n    ) {\n      event.stopPropagation();\n    }\n  };\n\n  useLayoutEffect(() => {\n    const firstCard = rootRef.current?.firstElementChild as HTMLElement;\n    if (setCardDimension && firstCard) {\n      setCardDimension({ width: firstCard.offsetWidth, height: firstCard.offsetHeight });\n    }\n  }, []);\n\n  // todo: issue track in JET-57681, we currently have two useAnimation() because the opacity and\n  // slide up/down have different durations, and the current API couldn't handle this case, we will\n  // update this once the API is updated\n\n  // animation for slide up/down\n  const { nodeRef: nodeRefSlide } = useAnimation<'slideUp' | 'slideDown' | 'none', HTMLDivElement>(\n    initialAnimation || 'none',\n    animationConfigSlide(itemIndex)\n  );\n  // animation for opacity change\n  const { nodeRef: nodeRefOpacity } = useAnimation<'opacity' | 'none', HTMLDivElement>(\n    (initialAnimation && 'opacity') || 'none',\n    animationConfigOpacity(itemIndex)\n  );\n\n  const itemRefs = useMemo(\n    () => mergeRefs(rootRef, nodeRefSlide, nodeRefOpacity),\n    // spot an issue when we click the cards during animation is processing, the cards would not finish\n    // the current animations and stay as what it is, e.g. leave itself as half transparent.\n    // add initialAnimation to the dependency to prevent this issue.\n    [rootRef, nodeRefSlide, nodeRefOpacity, initialAnimation]\n  );\n\n  return (\n    <div\n      id={useId()}\n      ref={itemRefs}\n      class={classes}\n      role=\"gridcell\"\n      data-oj-key={itemKey}\n      onKeyDown={handleKeyDown}\n      aria-selected={selectionMode === 'none' ? undefined : isSelected}\n      {...(typeof itemKey === 'number' && { 'data-oj-key-type': 'number' })}>\n      <TabbableModeContext.Provider value={{ isTabbable }}>\n        <FocusTrap isDisabled={!isTabbable} restoreFocusRef={false}>\n          {children}\n        </FocusTrap>\n      </TabbableModeContext.Provider>\n    </div>\n  );\n}\n\nconst animationConfigSlide = (\n  index: number\n): UseAnimationConfig<'slideUp' | 'slideDown' | 'none', HTMLDivElement> => {\n  return {\n    animationStates: {\n      slideUp: {\n        from: {\n          translateY: '50px'\n        },\n        to: {\n          translateY: '0px'\n        },\n        options: {\n          duration: 300,\n          delay: index * 50,\n          easing: [0, 0, 0.2, 1]\n        }\n      },\n      slideDown: {\n        from: {\n          translateY: '-50px'\n        },\n        to: {\n          translateY: '0'\n        },\n        options: {\n          duration: 300,\n          delay: index * 50,\n          easing: [0, 0, 0.2, 1]\n        }\n      }\n    },\n    isAnimatedOnMount: true\n  };\n};\n\nconst animationConfigOpacity = (\n  index: number\n): UseAnimationConfig<'opacity' | 'none', HTMLDivElement> => {\n  return {\n    animationStates: {\n      opacity: {\n        from: {\n          opacity: 0\n        },\n        to: {\n          opacity: 1\n        },\n        options: {\n          duration: 150,\n          delay: index * 50,\n          easing: 'linear'\n        }\n      }\n    },\n    isAnimatedOnMount: true\n  };\n};\n\nexport const MemoizeCardGridItem = memo(\n  CardGridItem,\n  <K, D>(prev: Props<K, D>, next: Props<K, D>) => {\n    if (prev && next) {\n      return (\n        prev.itemKey === next.itemKey &&\n        prev.itemIndex === next.itemIndex &&\n        prev.itemData === next.itemData &&\n        prev.isTabbable === next.isTabbable &&\n        prev.isFocused === next.isFocused &&\n        prev.isFocusRingVisible === next.isFocusRingVisible &&\n        prev.isSelected === next.isSelected &&\n        prev.initialAnimation === next.initialAnimation\n      );\n    }\n    return false;\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 */\nimport { ComponentChildren } from 'preact';\nimport { useRef, useCallback, useEffect, useState } from 'preact/hooks';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\nimport { containsKey, Keys, isKeyDefined } from '../utils/UNSAFE_keys';\nimport { Size } from '../utils/UNSAFE_size';\nimport {\n  getPrevNextKeyByCount,\n  getFirstVisibleKey,\n  getViewportConfig,\n  findElementByKey,\n  keyExtractor,\n  handleSelectionRange\n} from '../utils/PRIVATE_collectionUtils';\nimport { useId } from '../hooks/UNSAFE_useId';\nimport { useCurrentKey } from '../hooks/PRIVATE_useCurrentKey';\nimport { useCollectionFocusRing } from '../hooks/PRIVATE_useCollectionFocusRing';\nimport { useTabbableModeSet } from '../hooks/PRIVATE_useTabbableModeSet';\nimport { useSelection, SelectionRangeDetail } from '../hooks/PRIVATE_useSelection';\nimport { ViewportConfig } from '../hooks/UNSAFE_useViewportIntersect';\nimport {\n  ItemContext,\n  ListItemContext,\n  CurrentKeyDetail,\n  SelectionDetail,\n  SelectionMode\n} from '../UNSAFE_Collection';\nimport { Grid } from '../UNSAFE_Grid';\nimport { Selector } from '../UNSAFE_Selector';\nimport { Skeleton } from '../UNSAFE_Skeleton';\nimport { SkeletonContainer } from '../PRIVATE_List/SkeletonContainer';\nimport { LoadMoreCollection, LOADMORE_STYLE_CLASS } from '../PRIVATE_LoadMoreCollection';\nimport { MemoizeCardGridItem, ITEM_SELECTOR } from './CardGridItem';\nimport { styles } from './themes/CardGridStyles.css';\n\n/**\n * Props for the GradGrid Component, which consist of some props from ListView\n */\ntype CardGridProps<K, D> = {\n  /**\n   * An array of shaped data that provide information to this CardGrid.\n   * If the value is null, then CardGrid will show loading indicator until the value is set.\n   */\n  data: D[] | null;\n  /**\n   * Callback function to handle when viewport has changed, including the case\n   * where user scrolls to the end of the component and there are more items to load.\n   */\n  onLoadMore?: () => void;\n  /**\n   * A boolean that indicates whether there are still more data to load.\n   */\n  hasMore?: boolean;\n  /**\n   * A callback function to get the key for a given row\n   */\n  getRowKey: (data: D) => K;\n  /**\n   * A function to render each item\n   */\n  children: (context: ListItemContext<K, D>) => ComponentChildren;\n  /**\n   * The key of the item that currently have keyboard focus. Ignored if the current item is not\n   * currently in the viewport.\n   */\n  currentKey?: K;\n  /**\n   * Callback function to handle when current focused item has changed.  The function should\n   * update the currentKey prop with a new current key.\n   */\n  onCurrentKeyChange?: (detail: CurrentKeyDetail<K>) => void;\n  /**\n   * The type of selection behavior that is enabled on the CardGrid. This property controls the number\n   * of selections that can be made via selection gestures at any given time.\n   */\n  selectionMode?: SelectionMode;\n  /**\n   * The keys of the current selected items in the CardGrid.\n   */\n  selectedKeys?: Keys<K>;\n  /**\n   * Callback function to handle when selection has changed.  The function should update\n   * the selectedKeys prop with a new set of selected keys.\n   */\n  onSelectionChange?: (detail: SelectionDetail<K>) => void;\n  /**\n   * The ViewportConfig currently contains only one property which allows application to specify what the scroller element should be.\n   * If not specified, then the root element of CardGrid itself will be the scroller element.\n   */\n  viewportConfig?: ViewportConfig;\n  /**\n   * An aria-label which defines a string value that labels this CardGrid.\n   * Either aria-label or aria-labelledby should be specified in order to make CardGrid accessible.\n   */\n  'aria-label'?: string;\n  /**\n   * An aria-labelledby which identifies the element(s) that labels this CardGrid.\n   * Either aria-label or aria-labelledby should be specified in order to make CardGrid accessible.\n   */\n  'aria-labelledby'?: string;\n  /**\n   * Specify animation when cards are initially rendered.\n   */\n  initialAnimation?: 'slideUp' | 'slideDown';\n  /**\n   * Size of the gutter between columns.\n   */\n  gutterSize?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';\n};\n\nexport function CardGrid<K extends string | number, D>({\n  children,\n  data,\n  onLoadMore = () => {},\n  hasMore = false,\n  getRowKey,\n  currentKey,\n  onCurrentKeyChange,\n  selectionMode = 'none',\n  selectedKeys = emptyKeys as Keys<K>,\n  onSelectionChange,\n  viewportConfig,\n  'aria-label': ariaLabel,\n  'aria-labelledby': ariaLabelledBy,\n  initialAnimation = 'slideUp',\n  gutterSize = 'sm'\n}: CardGridProps<K, D>) {\n  const rootRef = useRef<HTMLDivElement>(null);\n\n  // tracking the anchor key which is used for shift+click selection\n  const anchorKey = useRef<K | undefined>();\n  // tracking pending current key in pointer down event\n  const pendingCurrentKey = useRef<K>();\n\n  const isInitialAnimation = useRef(true);\n  const [colCount, setColCount] = useState(0);\n  const [cardDimension, setCardDimension] = useState({ width: 0, height: 0 });\n\n  const gutterSizePX = gutterSizeMappings[gutterSize];\n  const gap = `${gutterSizePX / 4}x` as Size;\n  const gridTemplateColumns = cardDimension.width\n    ? `repeat(auto-fit, ${cardDimension.width}px)`\n    : undefined;\n  const gridProps = { gap, gridTemplateColumns };\n\n  const ariaMultiSelectable = selectionMode === 'none' ? undefined : selectionMode === 'multiple';\n  const ariaRowcount = hasMore || !data || colCount === 0 ? -1 : Math.ceil(data?.length / colCount);\n\n  /*****************************************************************************************/\n  /********************************* cardWidth and colCount ********************************/\n  /*****************************************************************************************/\n\n  // cards are fully rendered for the first time, only when cardWidth and colCount have defined and non-zero values\n  // for the first time, so the initial animation should not happen until this render.\n  useEffect(() => {\n    if (cardDimension.width && colCount) {\n      isInitialAnimation.current = false;\n    }\n  }, [cardDimension.width && colCount]);\n\n  const handleColCount = useCallback(\n    (rootWidth: number) => {\n      const newColCount = getColCount(\n        gutterSizePX,\n        cardDimension.width || DEFAULT_SKELETON_WIDTH,\n        rootWidth\n      );\n      if (newColCount > 0) {\n        setColCount(newColCount);\n      }\n    },\n    [gutterSizePX, cardDimension.width]\n  );\n\n  useEffect(() => {\n    const root = rootRef?.current;\n    if (root) {\n      handleColCount(root.offsetWidth);\n    }\n  }, [handleColCount]);\n\n  const handleResize = useCallback(\n    (entries: ResizeObserverEntry[]) => {\n      for (const entry of entries) {\n        // update colCount during resize\n        handleColCount(entry.contentRect.width);\n      }\n    },\n    [handleColCount]\n  );\n\n  /**\n   * Set up resize observer and update the colCount, to ensure keyboard navigation is correct\n   * after the resize\n   */\n  useEffect(() => {\n    const root = rootRef.current;\n    if (root) {\n      const resizeObserver = new ResizeObserver((entries: ResizeObserverEntry[]) => {\n        handleResize(entries);\n      });\n      resizeObserver.observe(root);\n      return () => {\n        resizeObserver.unobserve(root);\n      };\n    }\n    return undefined;\n  }, [handleResize]);\n\n  /*****************************************************************************************/\n  /************************************* Tabbable Mode *************************************/\n  /*****************************************************************************************/\n\n  const cardGridContains = (elem: Element | null) => {\n    return !!rootRef.current?.contains(elem);\n  };\n\n  let pendingFocusRingChange = false;\n  const [isCurrentTabbableKey, tabbableModeProps] = useTabbableModeSet(\n    cardGridContains,\n    (element) => {\n      return keyExtractor(element, ITEM_SELECTOR) as K;\n    },\n    currentKey,\n    // handle clean-up on disabling of the mode\n    (target: EventTarget | null, isKeyboardEvent) => {\n      if (cardGridContains(target as Element)) {\n        // delay focus reset for keyboard disable so focus is reset to CardGrid after the FocusTrap blur lifecycle completes.\n        // pointer initiated changes will fire the onBlur organically and delaying the focus, just generates an unwanted second blur\n        if (isKeyboardEvent) {\n          // do not show a focus ring during this timeOut\n          pendingFocusRingChange = true;\n          setTimeout(() => {\n            rootRef.current?.focus();\n          }, 0);\n        } else {\n          rootRef.current?.focus();\n        }\n      }\n      // otherwise target is not in list (including body, which target should be null in that case)\n    },\n    // set currentKey when mode is enabled\n    (key: K) => {\n      onCurrentKeyChange && onCurrentKeyChange({ value: key });\n    }\n  );\n\n  /*****************************************************************************************/\n  /********************************* Current Key and Focus *********************************/\n  /*****************************************************************************************/\n\n  const { currentKeyProps } = useCurrentKey(\n    (element) => keyExtractor(element, ITEM_SELECTOR),\n    selectionMode !== 'multiple',\n    // init a function every time to make sure we pass in the latest colCount.current,\n    // otherwise the new key might be wrong after resize\n    () => getPrevNextKeyByCount(data, getRowKey, currentKey, -colCount),\n    () => getPrevNextKeyByCount(data, getRowKey, currentKey, colCount),\n    () => getPrevNextKeyByCount(data, getRowKey, currentKey, -1),\n    () => getPrevNextKeyByCount(data, getRowKey, currentKey, 1),\n    currentKey,\n    onCurrentKeyChange\n  );\n\n  const [showFocusRing, focusRingProps] = useCollectionFocusRing(cardGridContains, [\n    'ArrowUp',\n    'ArrowDown',\n    'ArrowLeft',\n    'ArrowRight'\n  ]);\n\n  const handleInitialFocus = () => {\n    if (\n      !isKeyDefined(currentKey) &&\n      onCurrentKeyChange &&\n      isCurrentTabbableKey(undefined) &&\n      rootRef.current\n    ) {\n      const firstKey =\n        pendingCurrentKey.current || (getFirstVisibleKey(rootRef.current, ITEM_SELECTOR) as K);\n      if (isKeyDefined(firstKey)) {\n        onCurrentKeyChange({ value: firstKey });\n      }\n    }\n  };\n\n  /**\n   * Need to track pointer down element to set currentItem when initial focus happens\n   */\n  const handlePointerDown = (event: PointerEvent) => {\n    const key = keyExtractor(event.target as HTMLElement, ITEM_SELECTOR);\n    if (isKeyDefined(key)) {\n      pendingCurrentKey.current = key as K;\n    }\n  };\n\n  useEffect(() => {\n    if (currentKey != null && rootRef.current) {\n      const elem = findElementByKey(rootRef.current, currentKey, ITEM_SELECTOR);\n      if (elem) {\n        // make sure item is visible\n        elem.scrollIntoView({ block: 'nearest' });\n        const cell = elem.closest(`[role=gridcell]`);\n        if (cell) {\n          // update aria-activedescendant for screen reader\n          rootRef.current.setAttribute('aria-activedescendant', cell.id);\n        }\n      }\n    }\n    // listen to data because the current item would re-render when data is updated, i.e. the id\n    // of current item would be updated, so the currentKey itself couldn't guarantee the root has\n    // the latest aria-activedescendant\n  }, [currentKey, data]);\n\n  /*****************************************************************************************/\n  /*************************************** Selection ***************************************/\n  /*****************************************************************************************/\n\n  const handleSelectionChange = useCallback(\n    (detail: SelectionDetail<K>) => {\n      if (onSelectionChange) {\n        if (detail.value.all === false && detail.value.keys.size > 0) {\n          // the last key selected by a user gesture is the anchor key\n          anchorKey.current = Array.from(detail.value.keys.values()).pop();\n        }\n        onSelectionChange(detail);\n      }\n    },\n    [anchorKey, onSelectionChange]\n  );\n\n  const handleSelectionRangeChange = useCallback(\n    (detail: SelectionRangeDetail<K>) => {\n      if (data && onSelectionChange) {\n        const value = handleSelectionRange(detail, data, getRowKey);\n        // for non-virtualized CardGrid, value should always be an array\n        if (Array.isArray(value)) {\n          onSelectionChange({ value: { all: false, keys: new Set(value) }, target: null });\n        }\n      }\n    },\n    [data, onSelectionChange, onLoadMore]\n  );\n\n  const { selectionProps } = useSelection(\n    (element: HTMLElement) => {\n      if (element === rootRef.current) {\n        return currentKey === undefined ? null : currentKey;\n      }\n      return keyExtractor(element, ITEM_SELECTOR) as K;\n    },\n    selectedKeys,\n    selectionMode,\n    false,\n    'replace',\n    false,\n    handleSelectionChange,\n    anchorKey.current,\n    currentKey,\n    (currentKey: K | undefined, isPrev: boolean) => () =>\n      getPrevNextKeyByCount(data, getRowKey, currentKey, isPrev ? -colCount : colCount),\n    (currentKey: K | undefined, isPrev: boolean) => () =>\n      getPrevNextKeyByCount(data, getRowKey, currentKey, isPrev ? -1 : 1),\n    (key: K) => {\n      if (rootRef.current) {\n        const elem = findElementByKey(rootRef.current, key, ITEM_SELECTOR);\n        if (elem) {\n          elem.scrollIntoView({ block: 'nearest' });\n        }\n      }\n    },\n    handleSelectionRangeChange\n  );\n\n  /*****************************************************************************************/\n  /************************************ Child Component ************************************/\n  /*****************************************************************************************/\n\n  const getItemContext = useCallback(\n    (context: ItemContext<D>) => {\n      const key = getRowKey(context.data);\n      const selectorRenderer =\n        selectionMode === 'multiple'\n          ? () => (\n              <Selector\n                onChange={onSelectionChange}\n                rowKey={key}\n                selectedKeys={selectedKeys}></Selector>\n            )\n          : undefined;\n\n      return {\n        index: context.index,\n        data: context.data,\n        metadata: { key: key },\n        selector: selectorRenderer,\n        isSelected: containsKey(selectedKeys, key)\n      };\n    },\n    [selectionMode, selectedKeys, onSelectionChange]\n  );\n\n  const childrenComponent = (context: ItemContext<D>) => {\n    const cardItemContext = getItemContext(context);\n    const isTabbable = isCurrentTabbableKey(cardItemContext.metadata.key);\n    const isFocused = currentKey === cardItemContext.metadata.key && !isTabbable;\n    const isFocusRingVisible = isFocused && showFocusRing && !pendingFocusRingChange;\n    const isSelected = cardItemContext.isSelected;\n    const cardGridFunc = (context: ListItemContext<K, D>) => (\n      <MemoizeCardGridItem\n        key={cardItemContext.metadata.key}\n        itemKey={cardItemContext.metadata.key}\n        itemIndex={cardItemContext.index}\n        itemData={cardItemContext.data}\n        isTabbable={isTabbable}\n        isFocused={isFocused}\n        isFocusRingVisible={isFocusRingVisible}\n        isSelected={isSelected}\n        selectionMode={selectionMode}\n        {...(isInitialAnimation.current && { initialAnimation })}\n        {...(context.index === 0 && { setCardDimension })}>\n        {children(context)}\n      </MemoizeCardGridItem>\n    );\n    return cardGridFunc(cardItemContext);\n  };\n\n  // todo: issue track in JET-57952, need a way to show the skeletons in keyboard navigation\n  const skeletons = findDefaultLoadMoreIndicator(\n    gridProps,\n    data?.length || 0,\n    colCount,\n    cardDimension.height\n  );\n\n  viewportConfig = getViewportConfig(rootRef, viewportConfig);\n  const collectionComponent = (\n    <div role=\"row\">\n      <Grid {...gridProps}>\n        <LoadMoreCollection\n          data={data}\n          hasMore={hasMore}\n          onLoadMore={onLoadMore}\n          loadMoreIndicator={skeletons}\n          loadMoreThreshold={gutterSizePX + 4} // gap size + padding\n          viewportConfig={viewportConfig}>\n          {childrenComponent}\n        </LoadMoreCollection>\n      </Grid>\n    </div>\n  );\n\n  return (\n    <div\n      {...mergeProps(tabbableModeProps, currentKeyProps, focusRingProps, selectionProps, {\n        onFocus: handleInitialFocus,\n        onPointerDown: handlePointerDown\n      })}\n      ref={rootRef}\n      role=\"grid\"\n      class={styles.baseStyle}\n      tabIndex={0}\n      aria-label={ariaLabel}\n      aria-labelledby={ariaLabelledBy}\n      aria-multiselectable={ariaMultiSelectable}\n      aria-rowcount={ariaRowcount}\n      aria-colcount={colCount}>\n      {data == null ? defaultLoadingIndicator(gridProps) : collectionComponent}\n    </div>\n  );\n}\n\nconst emptyKeys = { all: false, keys: new Set() };\n\n/**\n * A mapping of gutterSize to concrete size that can be passed into Grid component\n * (specifically, in the format of `${number}x`)\n */\nconst gutterSizeMappings: Record<string, number> = {\n  xs: 12,\n  sm: 16,\n  md: 24,\n  lg: 48,\n  xl: 64\n};\n\n// these are arbitrary values by now, might update them with definite values in the future\nconst DEFAULT_SKELETON_NUMBER = 25;\nconst DEFAULT_SKELETON_WIDTH = 260;\nconst DEFAULT_SKELETON_HEIGHT = 300;\n\n/**\n * A function that returns an array of skeletons based on count\n * @param count the number of skeletons\n */\nconst getSkeletonsByCount = (count: number, isUnique?: boolean, height?: number) =>\n  [...Array(count)].map(() => (\n    // this map function keeps generating the same copy of skeletons with same keys even with useId() hook,\n    // so combine id with time to make the key unique. create unique skeletons if needed, otherwise the\n    // animations won't start at the same time\n    <SkeletonContainer key={isUnique && useId() + new Date().getTime()} minimumCount={1}>\n      {() => {\n        return <Skeleton height={`calc(${height || DEFAULT_SKELETON_HEIGHT}px)` as Size} />;\n      }}\n    </SkeletonContainer>\n  ));\n\n/**\n * The default loading indicator will display 25 card skeletons\n * @param gridProps the Grid props\n */\nconst defaultLoadingIndicator = (gridProps: any) => (\n  <Grid {...gridProps}>{getSkeletonsByCount(DEFAULT_SKELETON_NUMBER)}</Grid>\n);\n\n/**\n * A function that will return the load more skeletons based on the number of columns and items, and return\n * the corresponding number of columns that is used to layout the skeletons.\n * @param gridProps the Grid props\n * @param totalCount the number of all items\n * @param colCount the number of columns in a row\n */\nconst findDefaultLoadMoreIndicator = (\n  gridProps: any,\n  totalCount: number,\n  colCount: number,\n  skeletonHeight: number\n): ComponentChildren => {\n  // if the number of columns is unknown, return nothing\n  if (!colCount) {\n    return undefined;\n  }\n\n  const skeletonGridProps = { ...gridProps };\n  if (colCount && !totalCount) {\n    skeletonGridProps.gridTemplateColumns = `repeat(auto-fit, ${DEFAULT_SKELETON_WIDTH}px)`;\n  }\n\n  const skeletons = [];\n  const gridColumns: number[] = [];\n\n  const firstCount = colCount - (totalCount % colCount);\n  if (firstCount > 0) {\n    const firstSkeletons = getSkeletonsByCount(firstCount, true, skeletonHeight);\n    skeletons.push(firstSkeletons);\n    gridColumns.push(firstCount);\n  }\n  const secondCount = colCount;\n  if (firstCount < secondCount) {\n    const secondSkeletons = getSkeletonsByCount(secondCount, true, skeletonHeight);\n    skeletons.push(secondSkeletons);\n    gridColumns.push(secondCount);\n  }\n\n  // only apply LOADMORE_STYLE_CLASS on the first row, to avoid onLoadMore\n  // get called multiple times\n  const skeletonRows = skeletons.map((s, i) => (\n    <div\n      {...(i == 0 && { class: LOADMORE_STYLE_CLASS })}\n      style={{ gridColumn: `span ${gridColumns[i]}` }}>\n      <Grid {...skeletonGridProps}>{s}</Grid>\n    </div>\n  ));\n  return skeletonRows;\n};\n\nconst getColCount = (gapWidth: number, cardWidth?: number, rootWidth?: number) => {\n  if (!cardWidth || !rootWidth) return 0;\n\n  // if we have n cards, we have n-1 gaps\n  const colCount = Math.floor((rootWidth + gapWidth) / (gapWidth + cardWidth));\n  return colCount;\n};\n"],"names":["ITEM_STYLE_CLASS","ITEM_SELECTOR","animationConfigSlide","index","animationStates","slideUp","from","translateY","to","options","duration","delay","easing","slideDown","isAnimatedOnMount","animationConfigOpacity","opacity","MemoizeCardGridItem","memo","children","itemKey","itemIndex","isTabbable","isFocused","isFocusRingVisible","isSelected","selectionMode","initialAnimation","setCardDimension","rootRef","useRef","variantClasses","multiVariantStyles","itemFocused","itemInitialOpacity","classes","classNames","styles","itemStyle","useLayoutEffect","firstCard","current","firstElementChild","width","offsetWidth","height","offsetHeight","nodeRef","nodeRefSlide","useAnimation","nodeRefOpacity","itemRefs","useMemo","mergeRefs","_jsx","id","useId","ref","class","role","onKeyDown","event","key","stopPropagation","undefined","TabbableModeContext","Provider","value","FocusTrap","isDisabled","restoreFocusRef","prev","next","itemData","emptyKeys","all","keys","Set","gutterSizeMappings","xs","sm","md","lg","xl","DEFAULT_SKELETON_WIDTH","getSkeletonsByCount","count","isUnique","Array","map","jsxRuntime","jsx","SkeletonContainer","minimumCount","Skeleton","Date","getTime","defaultLoadingIndicator","gridProps","Grid","findDefaultLoadMoreIndicator","totalCount","colCount","skeletonHeight","skeletonGridProps","gridTemplateColumns","skeletons","gridColumns","firstCount","firstSkeletons","push","secondCount","secondSkeletons","s","i","LOADMORE_STYLE_CLASS","style","gridColumn","getColCount","gapWidth","cardWidth","rootWidth","Math","floor","data","onLoadMore","hasMore","getRowKey","currentKey","onCurrentKeyChange","selectedKeys","onSelectionChange","viewportConfig","ariaLabel","ariaLabelledBy","gutterSize","anchorKey","pendingCurrentKey","isInitialAnimation","setColCount","useState","cardDimension","gutterSizePX","gap","ariaMultiSelectable","ariaRowcount","ceil","length","useEffect","handleColCount","useCallback","newColCount","root","handleResize","entries","entry","contentRect","resizeObserver","ResizeObserver","observe","unobserve","cardGridContains","elem","contains","pendingFocusRingChange","isCurrentTabbableKey","tabbableModeProps","useTabbableModeSet","element","keyExtractor","target","isKeyboardEvent","setTimeout","focus","currentKeyProps","useCurrentKey","getPrevNextKeyByCount","showFocusRing","focusRingProps","useCollectionFocusRing","findElementByKey","scrollIntoView","block","cell","closest","setAttribute","handleSelectionChange","detail","size","values","pop","handleSelectionRangeChange","handleSelectionRange","isArray","selectionProps","useSelection","isPrev","getItemContext","context","selectorRenderer","Selector","onChange","rowKey","metadata","selector","containsKey","getViewportConfig","collectionComponent","LoadMoreCollection","loadMoreIndicator","loadMoreThreshold","cardItemContext","cardGridFunc","mergeProps","onFocus","isKeyDefined","firstKey","getFirstVisibleKey","onPointerDown","baseStyle","tabIndex"],"mappings":"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"}

package/amd/CheckboxRadioContext-70c004eb.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact', 'preact/hooks'], (function(e,t,o){"use strict";const c=t.createContext({});e.CheckboxRadioContext=c,e.useCheckboxRadioContext=()=>o.useContext(c)}));
+//# sourceMappingURL=CheckboxRadioContext-70c004eb.js.map

package/amd/CheckboxRadioContext-70c004eb.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxRadioContext-70c004eb.js","sources":["../../src/PRIVATE_CheckboxRadioField/CheckboxRadioContext.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 */\n\nimport { createContext } from 'preact';\nimport { useContext } from 'preact/hooks';\n\ntype CheckboxRadioContextValue = {\n  isFocusRingShown?: boolean;\n};\n\nconst CheckboxRadioContext = createContext<CheckboxRadioContextValue>(\n  {} as CheckboxRadioContextValue\n);\nconst useCheckboxRadioContext = () => useContext(CheckboxRadioContext);\n\nexport { CheckboxRadioContext, useCheckboxRadioContext };\n"],"names":["CheckboxRadioContext","createContext","useContext"],"mappings":"yEAeA,MAAMA,EAAuBC,EAAaA,cACxC,uDAE8B,IAAMC,EAAAA,WAAWF"}

package/amd/Chip-7e6564dd.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', './hooks/UNSAFE_useActionable', 'preact/hooks', './hooks/UNSAFE_useTabbableMode', './UNSAFE_Chip/themes/ChipStyles.css', './hooks/UNSAFE_useInteractionStyle', './utils/UNSAFE_mergeProps'], (function(e,s,o,i,t,a,l,r){"use strict";e.Chip=function({isSelected:e,isDisabled:c,"aria-label":n,children:u,onToggle:b}){const d=i.useCallback((()=>{b?.({previousValue:e,value:!e})}),[e,b]),{actionableProps:p}=o.useActionable(d),{interactionProps:v,applyActiveStyle:h,applyHoverStyle:S,applyPseudoHoverStyle:y}=l.useInteractionStyle(),A=r.mergeProps(p,v),H=a.multiVariantStyles({disabled:c?"isDisabled":"notDisabled",hover:!S||c||e?"notHover":"isHover",pseudoHover:!y||c||e?"notPseudoHover":"isPseudoHover",active:e||h?"isActive":"notActive"}),{isTabbable:P}=t.useTabbableMode();return c?s.jsx("div",{class:H,children:u}):s.jsx("div",{...A,class:H,tabIndex:P?0:-1,"aria-label":n,role:"switch","aria-checked":e?"true":"false",children:u})}}));
+//# sourceMappingURL=Chip-7e6564dd.js.map

package/amd/Chip-7e6564dd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Chip-7e6564dd.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 { useCallback } from 'preact/hooks';\nimport { useTabbableMode } from '../hooks/UNSAFE_useTabbableMode';\nimport { multiVariantStyles } from './themes/ChipStyles.css';\nimport { useInteractionStyle } from '../hooks/UNSAFE_useInteractionStyle';\nimport { mergeProps } from '../utils/UNSAFE_mergeProps';\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  'aria-label'?: 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({\n  isSelected,\n  isDisabled,\n  'aria-label': accessibleLabel,\n  children,\n  onToggle\n}: Props) {\n  const handleAction = useCallback(() => {\n    onToggle?.({ previousValue: isSelected, value: !isSelected });\n  }, [isSelected, onToggle]);\n  const { actionableProps } = useActionable(handleAction);\n  const { interactionProps, applyActiveStyle, applyHoverStyle, applyPseudoHoverStyle } =\n    useInteractionStyle();\n\n  const mergedProps = mergeProps(actionableProps, interactionProps);\n\n  const classes = multiVariantStyles({\n    disabled: isDisabled ? 'isDisabled' : 'notDisabled',\n    hover: applyHoverStyle && !isDisabled && !isSelected ? 'isHover' : 'notHover',\n    pseudoHover:\n      applyPseudoHoverStyle && !isDisabled && !isSelected ? 'isPseudoHover' : 'notPseudoHover',\n    active: isSelected || applyActiveStyle ? 'isActive' : 'notActive'\n  });\n\n  const { isTabbable } = useTabbableMode();\n\n  return isDisabled ? (\n    <div class={classes}>{children}</div>\n  ) : (\n    <div\n      {...mergedProps}\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":["isSelected","isDisabled","accessibleLabel","children","onToggle","handleAction","useCallback","previousValue","value","actionableProps","useActionable","interactionProps","applyActiveStyle","applyHoverStyle","applyPseudoHoverStyle","useInteractionStyle","mergedProps","mergeProps","classes","multiVariantStyles","disabled","hover","pseudoHover","active","isTabbable","useTabbableMode","_jsx","class","jsx","tabIndex","role"],"mappings":"6QAqCgB,UAAKA,WACnBA,EAAUC,WACVA,EACA,aAAcC,EAAeC,SAC7BA,EAAQC,SACRA,IAEA,MAAMC,EAAeC,EAAAA,aAAY,KAC/BF,IAAW,CAAEG,cAAeP,EAAYQ,OAAQR,GAAa,GAC5D,CAACA,EAAYI,KACVK,gBAAEA,GAAoBC,EAAaA,cAACL,IACpCM,iBAAEA,EAAgBC,iBAAEA,EAAgBC,gBAAEA,EAAeC,sBAAEA,GAC3DC,EAAAA,sBAEIC,EAAcC,EAAAA,WAAWR,EAAiBE,GAE1CO,EAAUC,EAAAA,mBAAmB,CACjCC,SAAUnB,EAAa,aAAe,cACtCoB,OAAOR,GAAoBZ,GAAeD,EAAyB,WAAZ,UACvDsB,aACER,GAA0Bb,GAAeD,EAA+B,iBAAlB,gBACxDuB,OAAQvB,GAAcY,EAAmB,WAAa,eAGlDY,WAAEA,GAAeC,EAAAA,kBAEvB,OAAOxB,EACLyB,EAAAA,IAAK,MAAA,CAAAC,MAAOT,EAAUf,SAAAA,IAEtBuB,EAAAE,IAAA,MAAA,IACMZ,EACJW,MAAOT,EACPW,SAAUL,EAAa,GAAK,EAAC,aACjBtB,EACZ4B,KAAK,SAAQ,eACC9B,EAAa,OAAS,QACnCG,SAAAA,GAGP"}

package/amd/ClearIcon-4df5a4fa.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', 'preact/hooks', './hooks/UNSAFE_usePress', './hooks/UNSAFE_useTranslationBundle', 'css!./ClearIconStyles.styles.css'], (function(e,s,n,t,l,o){"use strict";const r=()=>{};e.ClearIcon=function({onClick:e}){const o=n.useCallback((e=>{e.preventDefault()}),[]),{pressProps:a}=t.usePress(e??r),c=l.useTranslationBundle("@oracle/oraclejet-preact").formControl_clear();return s.jsx("span",{"aria-hidden":"true",class:"ClearIconStyles_clearIconStyles__8wwy0m0",tabIndex:-1,onMouseDown:o,title:c,...a,children:s.jsx("svg",{height:"24",viewBox:"0 0 24 24",width:"24",xmlns:"http://www.w3.org/2000/svg",children:s.jsx("path",{d:"m12 1c6.065 0 11 4.935 11 11s-4.935 11-11 11-11-4.935-11-11 4.935-11 11-11zm3.4979817 6-3.4979817 3.498-3.49798173-3.498-1.50201827 1.50201827 3.498 3.49798173-3.498 3.4979817 1.50201827 1.5020183 3.49798173-3.498 3.4979817 3.498 1.5020183-1.5020183-3.498-3.4979817 3.498-3.49798173z",fill:"#100f0e","fill-rule":"evenodd"})})})}}));
+//# sourceMappingURL=ClearIcon-4df5a4fa.js.map

package/amd/ClearIcon-4df5a4fa.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ClearIcon-4df5a4fa.js","sources":["../../src/UNSAFE_InputText/ClearIcon.tsx"],"sourcesContent":["import { useCallback } from 'preact/hooks';\nimport { usePress } from '../hooks/UNSAFE_usePress';\nimport { useTranslationBundle } from '../hooks/UNSAFE_useTranslationBundle';\nimport { BundleType } from '../resources/nls/bundle';\nimport { clearIconStyles } from './ClearIconStyles.css';\n\ntype Props = {\n  onClick?: () => void;\n};\n\nconst noop = () => {};\n\nexport function ClearIcon({ onClick }: Props) {\n  const killEvent = useCallback((event: Event) => {\n    event.preventDefault();\n  }, []);\n  const { pressProps } = usePress(onClick ?? noop);\n  const translations = useTranslationBundle<BundleType>('@oracle/oraclejet-preact');\n  const clearStr = translations.formControl_clear();\n\n  return (\n    <span\n      aria-hidden=\"true\"\n      class={clearIconStyles}\n      tabIndex={-1}\n      onMouseDown={killEvent}\n      title={clearStr}\n      {...pressProps}>\n      <svg height=\"24\" viewBox=\"0 0 24 24\" width=\"24\" xmlns=\"http://www.w3.org/2000/svg\">\n        <path\n          d=\"m12 1c6.065 0 11 4.935 11 11s-4.935 11-11 11-11-4.935-11-11 4.935-11 11-11zm3.4979817 6-3.4979817 3.498-3.49798173-3.498-1.50201827 1.50201827 3.498 3.49798173-3.498 3.4979817 1.50201827 1.5020183 3.49798173-3.498 3.4979817 3.498 1.5020183-1.5020183-3.498-3.4979817 3.498-3.49798173z\"\n          fill=\"#100f0e\"\n          fill-rule=\"evenodd\"\n        />\n      </svg>\n    </span>\n  );\n}\n"],"names":["noop","onClick","killEvent","useCallback","event","preventDefault","pressProps","usePress","clearStr","useTranslationBundle","formControl_clear","_jsx","jsx","class","tabIndex","onMouseDown","title","children","height","viewBox","width","xmlns","d","fill"],"mappings":"0LAUA,MAAMA,EAAO,mBAEG,UAAUC,QAAEA,IAC1B,MAAMC,EAAYC,eAAaC,IAC7BA,EAAMC,gBAAgB,GACrB,KACGC,WAAEA,GAAeC,EAAQA,SAACN,GAAWD,GAErCQ,EADeC,uBAAiC,4BACxBC,oBAE9B,OACEC,EACcC,IAAA,OAAA,CAAA,cAAA,OACZC,iDACAC,UAAW,EACXC,YAAab,EACbc,MAAOR,KACHF,EAAUW,SACdN,EAAAA,IAAK,MAAA,CAAAO,OAAO,KAAKC,QAAQ,YAAYC,MAAM,KAAKC,MAAM,6BACpDJ,SAAAN,MAAA,OAAA,CACEW,EAAE,8RACFC,KAAK,UACK,YAAA,eAKpB"}

package/amd/Collapsible-257c03de.js

@@ -0,0 +1,2 @@
+define(['exports', 'preact/jsx-runtime', 'preact/hooks', './hooks/UNSAFE_useId', 'preact', './utils/UNSAFE_classNames', './hooks/UNSAFE_useComponentTheme', './UNSAFE_Flex', './UNSAFE_Divider', './PRIVATE_ThemedIcons/ExpandIcon', './PRIVATE_ThemedIcons/CollapseIcon', './PRIVATE_ThemedIcons/CollapseUpIcon', './index-5b4c065a', './index-2260a0d1', './hooks/UNSAFE_usePress', './UNSAFE_Collapsible/themes/redwood/CollapsibleTheme', './classNames-111575ef', './Flex-0219fca5', './Divider-74731351', './hooks/UNSAFE_useAnimation', './useAnimation-a7663391'], (function(e,n,s,i,a,o,t,l,d,r,c,u,h,b,p,x,m,g,v,E,S){"use strict";const C=({isExpanded:e,isDisabled:s,iconPosition:i})=>{const a=s?"disabled":"primary",o="start"===i&&e?h.SvgChevronDown:c.CollapseIcon,t="end"===i&&e?b.SvgChevronUp:h.SvgChevronDown,l="start"===i?o:t;return n.jsx(l,{size:"6x",color:a})},f=({children:e,id:i,contentId:o,isDisabled:l,isExpanded:d,iconPosition:r,variant:c="basic",toggleHandler:u,accessibleLabel:h,accessibleLabelId:b})=>{const[E,S]=s.useState(!1),f=s.useRef(!1),{classes:j,styles:I}=t.useComponentTheme(x.CollapsibleRedwoodTheme,{disabled:l?"isDisabled":"notDisabled",divider:"horizontal-rule"===c?"hasDivider":"noDivider",focused:E?"isFocused":"notFocused"}),F=m.classNames([I.headerChildrenStyle,"end"===r&&I.iconEndStyle,"start"===r&&I.iconStartStyle]),D=s.useCallback((e=>{if(u(e.target),E){(window&&"PointerEvent"in window&&e instanceof PointerEvent||e instanceof MouseEvent)&&S(!1)}}),[u]),{pressProps:N}=p.usePress(D,{isDisabled:l,isRepeat:!1}),T=s.useCallback((e=>{"focusin"!==e.type||f.current?S(!1):S(!0)}),[]),y=()=>{f.current=!0},A=()=>{f.current=!1},P=h?{"aria-label":h}:b?{"aria-labelledby":b}:{"aria-labelledby":i};return n.jsxs(n.Fragment,{children:[n.jsx("div",{id:i,className:j,...N,children:n.jsx(g.Flex,{align:"center",justify:"start"===r?"start":"between",children:n.jsxs(a.Fragment,{children:["end"===r&&n.jsx("div",{className:F,children:e}),n.jsx("div",{tabIndex:0,role:"button","aria-controls":o,"aria-expanded":d,onFocus:T,onBlur:T,onMouseDown:y,onMouseUp:A,className:I.chevronStyle,...P,children:n.jsx(C,{iconPosition:r,isExpanded:d,isDisabled:l})}),"start"===r&&n.jsx("div",{className:F,children:e})]})})}),"horizontal-rule"===c&&n.jsx(v.Divider,{})]})},j=({children:e,id:i,isExpanded:a,onTransitionEnd:o})=>{const[l,d]=s.useState(a?"expanding":"unmounted"),{styles:r}=t.useComponentTheme(x.CollapsibleRedwoodTheme),c=s.useRef({overflowY:"hidden",maxHeight:a?"none":"0"});s.useEffect((()=>{("unmounted"!==l||a)&&d(a?"expanding":"collapsing")}),[a,l]);const{nodeRef:u}=S.useAnimation(l,{animationStates:I,onAnimationEnd:({animationState:e})=>{"collapsing"===e&&d("unmounted"),o?.()}});return n.jsx("div",{className:r.contentChildrenStyle,ref:u,id:i,tabIndex:-1,style:c.current,"aria-hidden":!a||void 0,children:"unmounted"!==l&&e})},I={expanding:e=>({to:{maxHeight:`${e.scrollHeight}px`},options:{duration:400},end:{maxHeight:"none"}}),collapsing:e=>({..."none"===e.style.maxHeight&&{from:{maxHeight:`${e.scrollHeight}px`}},to:{maxHeight:"0"},options:{duration:400}})};e.Collapsible=({header:e,children:a,isDisabled:o=!1,isExpanded:t=!1,iconPosition:l="start",variant:d="basic",onToggle:r,onTransitionEnd:c,"aria-label":u,"aria-labelledby":h})=>{const b=i.useId(),p=`oj-collapsible-header-${b}`,x=`oj-collapsible-content-${b}`,m=s.useCallback((e=>{o||r?.({value:!t,target:e})}),[o,r,t]),g=s.useCallback((()=>{c?.({value:t})}),[c,t]);return n.jsxs(n.Fragment,{children:[n.jsx(f,{id:p,contentId:x,toggleHandler:m,isDisabled:o,isExpanded:t,iconPosition:l,variant:d,accessibleLabel:u,accessibleLabelId:h,children:e}),n.jsx(j,{id:x,isExpanded:t,onTransitionEnd:g,children:a})]})}}));
+//# sourceMappingURL=Collapsible-257c03de.js.map