@oracle/oraclejet 12.1.8 → 12.1.9

package/dist/js/libs/oraclejet-preact/es/UNSAFE_Collapsible/index.js

@@ -11,7 +11,6 @@ const styles$2 = {
 /**
  * Header icon subcomponent
  */
-
 const CollapsibleHeaderIcon = ({
   contentId,
   disabled,
@@ -21,9 +20,8 @@ const CollapsibleHeaderIcon = ({
   onClick
 }) => {
   var _a;
-
-  const classes = classNames([styles$2.base, disabled && styles$2.disabled]); // TODO - replace by RTL API (https://jira.oraclecorp.com/jira/browse/JET-47572)
-
+  const classes = classNames([styles$2.base, disabled && styles$2.disabled]);
+  // TODO - replace by RTL API (https://jira.oraclecorp.com/jira/browse/JET-47572)
   const dir = (_a = document.documentElement.getAttribute('dir')) === null || _a === void 0 ? void 0 : _a.toLowerCase();
   const transform = expanded ? {} : {
     transform: dir === 'rtl' ? 'rotate(90, 12, 12)' : 'rotate(270, 12, 12)'
@@ -53,7 +51,6 @@ const styles$1 = {
 /**
  * Header subcomponent
  */
-
 const CollapsibleHeader = ({
   children,
   id,
@@ -102,7 +99,6 @@ const styles = {
  *    after the transition completes, as the collapsed content is not visible
  *    and thus does not reflow.
  */
-
 const CollapsibleContent = ({
   children,
   id,
@@ -111,8 +107,8 @@ const CollapsibleContent = ({
 }) => {
   // The state hook is used in order to track animation status and
   // implement conditional rendering of the content.
-  const [state, setState] = useState(expanded ? 'mounted' : 'unmounted'); // Previous state is tracked to determine when component should start animation
-
+  const [state, setState] = useState(expanded ? 'mounted' : 'unmounted');
+  // Previous state is tracked to determine when component should start animation
   const [prevExpanded, setPrevExpanded] = useState(expanded);
   const isAnimating = expanded !== prevExpanded || ['mounting', 'unmounting'].includes(state);
   const contentRef = useRef(null);
@@ -126,11 +122,11 @@ const CollapsibleContent = ({
     setPrevExpanded(expanded);
     onTransitionEnd === null || onTransitionEnd === void 0 ? void 0 : onTransitionEnd(event);
   }, [expanded, onTransitionEnd]);
-  const node = contentRef.current; // When expanding, we start from a max-height=0 and animate up
+  const node = contentRef.current;
+  // When expanding, we start from a max-height=0 and animate up
   // to the scroll height. When collapsing, we do the opposite.
   // When component is expanded, content can reflow freely without restrictions.
   // When component is collapsed, we set max-height to 0.
-
   const maxHeight = {
     mounting: isAnimating && node ? `${node.scrollHeight}px` : 'none',
     mounted: isAnimating && node ? `${node.scrollHeight}px` : 'none',

package/dist/js/libs/oraclejet-preact/es/UNSAFE_Flex/index.js

@@ -155,9 +155,8 @@ _curry1(function keys(obj) {
 });
 var keys$1 = keys;
 
-const coerceArray = xs => Array.isArray(xs) ? xs : [xs]; // This will be themable in the future, but is hard coded for this initial release.  These are the Redwood values.
-
-
+const coerceArray = xs => Array.isArray(xs) ? xs : [xs];
+// This will be themable in the future, but is hard coded for this initial release.  These are the Redwood values.
 const spaceStyles = {
   none: '0',
   xs: '0.25rem',
@@ -253,16 +252,14 @@ const interpolations = [...Object.values(dimensionInterpolations), ...Object.val
 const styleInterpolations = mergeInterpolations(interpolations);
 const Flex = _a => {
   var {
-    children
-  } = _a,
-      props = __rest(_a, ["children"]);
-
+      children
+    } = _a,
+    props = __rest(_a, ["children"]);
   const _b = styleInterpolations(props),
-        {
-    class: cls
-  } = _b,
-        styles = __rest(_b, ["class"]);
-
+    {
+      class: cls
+    } = _b,
+    styles = __rest(_b, ["class"]);
   return h("div", {
     class: `${baseStyles} ${cls}`,
     style: styles

package/dist/js/libs/oraclejet-preact/es/UNSAFE_HiddenAccessible/index.js

@@ -6,7 +6,6 @@ const hiddenAccessibleStyle = "oj-hidden-accessible-hiddenAccessibleStyle-10xavs
  * but keeps them visible to screen readers.
  *
  */
-
 function HiddenAccessible({
   children
 }) {

package/dist/js/libs/oraclejet-preact/es/UNSAFE_LiveRegion/index.js

@@ -8,7 +8,6 @@ const offScreenStyle = "oj-live-region-offScreenStyle-14cpbki";
  * TODO: Create a more centralized component that can handle aria-live region for
  * the whole application and use context api to communicate
  */
-
 function LiveRegion({
   atomic = 'false',
   text = '',
@@ -29,8 +28,6 @@ function LiveRegion({
  * @param timeout The timeout for setting the aria-live text async
  * @returns The aria-live text
  */
-
-
 function useLiveText(text, timeout) {
   const [liveText, setLiveText] = useState();
   const updateText = useCallback(() => setLiveText(text), [text]);

package/dist/js/libs/oraclejet-preact/es/UNSAFE_Message/index.js

@@ -22,14 +22,14 @@ const messageCloseButtonStyles = {
 /**
  * A Component for rendering the message close button
  */
-
 function MessageCloseButton({
   onAction,
   buttonRenderer,
   title = 'Close',
   variant = 'banner'
 }) {
-  const renderedButton = buttonRenderer ? buttonRenderer(title, onAction, variant) : // we should ultimately be able to create an oj-button (or rather its preact
+  const renderedButton = buttonRenderer ? buttonRenderer(title, onAction, variant) :
+  // we should ultimately be able to create an oj-button (or rather its preact
   // equivalent) here, but for now just create a regular HTML button if a renderer
   // is not passed in from the core JET layer
   h("button", {
@@ -37,8 +37,8 @@ function MessageCloseButton({
     onClick: onAction,
     title: title
   }, "X");
-  const classes = `oj-message${variant}-close-icon ${messageCloseButtonStyles[variant]}`; // Otherwise, render the close icon
-
+  const classes = `oj-message${variant}-close-icon ${messageCloseButtonStyles[variant]}`;
+  // Otherwise, render the close icon
   return h("div", {
     class: classes
   }, renderedButton);
@@ -174,32 +174,28 @@ const messageDetailStyles = {
  * @param item The template item object
  * @returns Rendered detail content
  */
-
 function defaultDetailRenderer(item) {
   const {
     detail
-  } = item.data; // If the detail is null or an empty string, do not render the
+  } = item.data;
+  // If the detail is null or an empty string, do not render the
   // content row
-
   if (!isValidValueForProp(detail)) {
     return null;
   }
-
   return h(Fragment, null, detail);
 }
 /**
  * Detail Component for rendering the detail content of the Message
  */
-
-
 function MessageDetail({
   item,
   renderer = defaultDetailRenderer,
   variant = 'banner'
 }) {
   const renderedContent = renderer(item);
-  if (renderedContent == null) return null; // If detail content is rendered, then wrap it in a div with specified style classes
-
+  if (renderedContent == null) return null;
+  // If detail content is rendered, then wrap it in a div with specified style classes
   const classes = `oj-message${variant}-detail ${messageDetailStyles.base} ${messageDetailStyles[variant]}`;
   return h("div", {
     class: classes
@@ -224,17 +220,14 @@ function classNames(values) {
  * as shown at https://oss.oracle.com/licenses/upl/
  * @ignore
  */
-
+// TODO: replace with id generated from environment
 let counter = 0;
-
 function useSvgId() {
   return useRef(`svg-${++counter}`).current;
-} // TODO: replace with real image component when that is available
+}
+// TODO: replace with real image component when that is available
 // tracked by JET-47348 - set images in a component
-
-
 const svgStyles = "oj-message-svgStyles-8z03w3";
-
 const Svg = ({
   class: className,
   children,
@@ -254,7 +247,6 @@ const Svg = ({
     id: id
   }, title), children);
 };
-
 const ConfirmationIcon = ({
   class: className,
   height,
@@ -270,7 +262,6 @@ const ConfirmationIcon = ({
   d: "m12 23c-6.07513225 0-11-4.9248677-11-11 0-6.07513225 4.92486775-11 11-11 6.0751323 0 11 4.92486775 11 11 0 6.0751323-4.9248677 11-11 11zm-4.29289322-10.7071068c-.39052429-.3905243-1.02368927-.3905243-1.41421356 0s-.39052429 1.0236893 0 1.4142136l3 3c.39052429.3905243 1.02368928.3905243 1.41421358 0l7-7.00000002c.3905243-.39052429.3905243-1.02368927 0-1.41421356s-1.0236893-.39052429-1.4142136 0l-6.2928932 6.29289318z",
   fill: fill
 }));
-
 const ErrorIcon = ({
   class: className,
   height = 24,
@@ -286,7 +277,6 @@ const ErrorIcon = ({
   d: "m12 1c6.0751322 0 11 4.92486775 11 11 0 6.0751322-4.9248678 11-11 11-6.07513225 0-11-4.9248678-11-11 0-6.07513225 4.92486775-11 11-11zm-3.29289322 6.29289322-1.41421356 1.41421356 7.99999998 8.00000002 1.4142136-1.4142136z",
   fill: fill
 }));
-
 const InfoIcon = ({
   class: className,
   height = 24,
@@ -302,7 +292,6 @@ const InfoIcon = ({
   d: "m12 1c6.0751322 0 11 4.92486775 11 11 0 6.0751322-4.9248678 11-11 11-6.07513225 0-11-4.9248678-11-11 0-6.07513225 4.92486775-11 11-11zm.0245053 9h-.0490003c-.5365027 0-.975505.439-.975505.9755v6.0485c0 .537.4390023.976.975505.976h.0490003c.5365027 0 .975505-.439.975505-.976v-6.0485c0-.5365-.4390023-.9755-.975505-.9755zm.975505-4h-2v2h2z",
   fill: fill
 }));
-
 const WarningIcon = ({
   class: className,
   height = 24,
@@ -339,7 +328,6 @@ const severityIcons = {
 /**
  * StartIcon Component for rendering the severity based icon in Message
  */
-
 function MessageStartIcon({
   severity,
   variant = 'banner',
@@ -370,7 +358,6 @@ const messageSummaryStyles = {
 /**
  * Summary Component for rendering the summary text of the Message
  */
-
 function MessageSummary({
   text,
   variant = 'banner'
@@ -395,13 +382,12 @@ const messageTimestampStyles = {
 /**
  * Timestamp Component for rendering timestamp in Message
  */
-
 function MessageTimestamp({
   value,
   variant = 'banner'
 }) {
-  const classes = `oj-message${variant}-timestamp ${messageTimestampStyles[variant]}`; // Otherwise, render the timestamp
-
+  const classes = `oj-message${variant}-timestamp ${messageTimestampStyles[variant]}`;
+  // Otherwise, render the timestamp
   const formattedTimestamp = formatTimestamp(value);
   return h("div", {
     class: classes
@@ -503,7 +489,6 @@ function getRenderer(message, rendererIdentifier, renderers, type) {
  * @param severity The message severity
  * @returns calculated style class based on the severity
  */
-
 function getSeverityStyleClass(severity) {
   const isValidSeverity = isValidValueForProp(severity, 'severity');
   return classNames$1([isValidSeverity && severity !== 'none' && `oj-messagebanner-${severity}`]);
@@ -514,8 +499,6 @@ function getSeverityStyleClass(severity) {
  * @param severity The component severity
  * @returns Whether or not to render the severity icon
  */
-
-
 function isSeverityIconNeeded(severity) {
   const isValidSeverity = isValidValueForProp(severity, 'severity');
   return isValidSeverity && severity !== 'none';
@@ -523,8 +506,6 @@ function isSeverityIconNeeded(severity) {
 /**
  * CSS styles for various components
  */
-
-
 const messageStyles = {
   base: "oj-message-base-ph7f1",
   section: "oj-message-section-y709vw",
@@ -537,7 +518,6 @@ const messageStyles = {
  * @param param0 Props
  * @returns MessageHeader component instance
  */
-
 function StyledMessageHeader({
   children
 }) {
@@ -549,8 +529,6 @@ function StyledMessageHeader({
 /**
  * Component that renders an individual message
  */
-
-
 function Message({
   closeButtonRenderer,
   detailRenderer,
@@ -569,31 +547,27 @@ function Message({
     timestamp
   } = item.data;
   const severityClass = getSeverityStyleClass(severity);
-  const containerDivRef = useRef(null); // Add methods to the ref object
-
+  const containerDivRef = useRef(null);
+  // Add methods to the ref object
   useImperativeHandle(messageRef, () => ({
     focus: () => {
       var _a;
-
       return (_a = containerDivRef.current) === null || _a === void 0 ? void 0 : _a.focus();
     },
     contains: element => {
       var _a, _b;
-
       return containerDivRef.current === element || ((_b = element && ((_a = containerDivRef.current) === null || _a === void 0 ? void 0 : _a.contains(element))) !== null && _b !== void 0 ? _b : false);
     }
   }));
   /**
    * Handles clicking on the close icon of the message
    */
-
   const handleClose = useCallback(() => {
     onClose === null || onClose === void 0 ? void 0 : onClose(item);
   }, [item, onClose]);
   /**
    * Handles closing the message on pressing Esc
    */
-
   const handleCloseOnEsc = useCallback(event => {
     // Close the message only when closeAffordance is on
     if (event.key === 'Escape' && closeAffordance === 'on') {
@@ -607,12 +581,11 @@ function Message({
       playSound(sound);
     }
   }, []); // No deps to run this only on mount
-
-  const rootClasses = classNames$1([messageStyles.base, severityClass, type === 'section' && messageStyles.section]); // We will be animating the root div, so add padding to an inner wrapper div so that
+  const rootClasses = classNames$1([messageStyles.base, severityClass, type === 'section' && messageStyles.section]);
+  // We will be animating the root div, so add padding to an inner wrapper div so that
   // when animating height looks smooth. If padding were to be added to the root
   // div, the animation will not be smooth as height will never reach 0 due to the
   // padding.
-
   return h("div", {
     ref: containerDivRef,
     class: rootClasses,