@jsenv/navi 0.21.2 → 0.21.4

package/dist/jsenv_navi.js

@@ -6325,12 +6325,14 @@ const DIMENSION_PROPS = {
     }
     const inVerticalFlexFlow =
       parentBoxFlow === "flex-y" || parentBoxFlow === "inline-flex-y";
+    const inHorizontalFlexFlow =
+      parentBoxFlow === "flex-x" || parentBoxFlow === "inline-flex-x";
     const selfVerticalFlexFlow =
       boxFlow === "flex-y" || boxFlow === "inline-flex-y";
     if (selfVerticalFlexFlow || inVerticalFlexFlow) {
       if (!inVerticalFlexFlow) {
-        if (parentBoxFlow === "flex-x" || parentBoxFlow === "inline-flex-x") {
-          return { minHeight: "100%", height: "auto" };
+        if (inHorizontalFlexFlow) {
+          return { alignSelf: "stretch" };
         }
         return {
           flexGrow: 1,
@@ -6341,8 +6343,8 @@ const DIMENSION_PROPS = {
       }
       return { flexGrow: 1, flexBasis: "0%" }; // Grow vertically in row
     }
-    if (parentBoxFlow === "flex-x") {
-      return { minHeight: "100%", height: "auto" }; // Take full height in column
+    if (inHorizontalFlexFlow) {
+      return { alignSelf: "stretch" }; // Stretch to cross-axis height in flex-x
     }
     return { minHeight: "100%", height: "auto" }; // Take full height outside flex
   },
@@ -18882,6 +18884,27 @@ const css$3 = /* css */`
     }
   }
 
+  .navi_text_skeleton {
+    display: inline-block;
+    width: 100%;
+    height: 1em;
+    background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%);
+    background-size: 200% 100%;
+    border-radius: 4px;
+
+    &[data-loading] {
+      animation: navi_text_skeleton_shimmer 1.2s infinite;
+    }
+  }
+  @keyframes navi_text_skeleton_shimmer {
+    0% {
+      background-position: 200% 0;
+    }
+    100% {
+      background-position: -200% 0;
+    }
+  }
+
   .navi_custom_space {
   }
 
@@ -19041,8 +19064,16 @@ const Text = props => {
   import.meta.css = [css$3, "@jsenv/navi/src/text/text.jsx"];
   const {
     overflowEllipsis,
+    loading,
+    skeleton,
     ...rest
   } = props;
+  if (loading || skeleton) {
+    return jsx(TextSkeleton, {
+      loading: loading,
+      ...rest
+    });
+  }
   if (overflowEllipsis) {
     return jsx(TextOverflow, {
       ...rest
@@ -19062,6 +19093,20 @@ const Text = props => {
     ...props
   });
 };
+const TextSkeleton = ({
+  loading,
+  ...props
+}) => {
+  return jsx(Box, {
+    ...props,
+    baseClassName: "navi_text_skeleton",
+    "data-loading": loading ? "" : undefined
+    // eslint-disable-next-line react/no-children-prop
+    ,
+
+    children: undefined
+  });
+};
 const TextOverflow = ({
   noWrap,
   spacing,
@@ -31376,39 +31421,6 @@ const Paragraph = props => {
   });
 };
 
-installImportMetaCssBuild(import.meta);import.meta.css = [/* css */`
-  .navi_text_placeholder {
-    display: inline-block;
-    width: 100%;
-    height: 1em;
-    background: linear-gradient(90deg, #e0e0e0 25%, #f0f0f0 50%, #e0e0e0 75%);
-    background-size: 200% 100%;
-    border-radius: 4px;
-
-    &[data-loading] {
-      animation: shimmer 1.2s infinite;
-    }
-  }
-  @keyframes shimmer {
-    0% {
-      background-position: 200% 0;
-    }
-    100% {
-      background-position: -200% 0;
-    }
-  }
-`, "@jsenv/navi/src/text/text_placeholder.jsx"];
-const TextPlaceholder = ({
-  loading,
-  ...props
-}) => {
-  return jsx(Box, {
-    ...props,
-    baseClassName: "navi_text_placeholder",
-    "data-loading": loading ? "" : undefined
-  });
-};
-
 const Image = props => {
   return jsx(Box, {
     ...props,
@@ -32052,5 +32064,5 @@ const UserSvg = () => jsx("svg", {
   })
 });
 
-export { ActionRenderer, ActiveKeyboardShortcuts, Address, Badge, BadgeCount, Box, Button, ButtonCopyToClipboard, Caption, CheckSvg, Checkbox, CheckboxList, CloseSvg, Code, Col, Colgroup, ConstructionSvg, Details, DialogLayout, Editable, ErrorBoundary, ErrorBoundaryContext, ExclamationSvg, EyeClosedSvg, EyeSvg, Form, Group, Head, HeartSvg, HomeSvg, Icon, Image, Input, Label, Link, LinkAnchorSvg, LinkBlankTargetSvg, LinkCurrentSvg, Loading, MessageBox, Meter, Nav, Paragraph, Quantity, QuantityIntl, Radio, RadioList, Route, RowNumberCol, RowNumberTableCell, SINGLE_SPACE_CONSTRAINT, SVGMaskOverlay, SearchSvg, Select, SelectionContext, Separator, SettingsSvg, SidePanel, StarSvg, SummaryMarker, Svg, Table, TableCell, Tbody, Text, TextPlaceholder, Thead, Title, Tr, UITransition, UserSvg, ViewportLayout, actionIntegratedVia, actionRunEffect, addCustomMessage, arraySignalMembership, compareTwoJsValues, createAction, createAvailableConstraint, createIntl, createRequestCanceller, createSelectionKeyboardShortcuts, enableDebugActions, enableDebugOnDocumentLoading, filterTableSelection, forwardActionRequested, installCustomConstraintValidation, isCellSelected, isColumnSelected, isRowSelected, localStorageSignal, navBack, navForward, navTo, openCallout, rawUrlPart, reload, removeCustomMessage, requestAction, rerunActions, resource, route, routeAction, setBaseUrl, setupRoutes, stateSignal, stopLoad, stringifyTableSelectionValue, syncOwnedResourceToSignals, syncResourceToSignals, updateActions, useActionStatus, useArraySignalMembership, useAsyncData, useCalloutClose, useCancelPrevious, useCellGridFromRows, useConstraintValidityState, useDarkBackgroundAttribute, useDependenciesDiff, useDocumentResource, useDocumentState, useDocumentUrl, useEditionController, useFocusGroup, useKeyboardShortcuts, useNavState$1 as useNavState, useOrderedColumns, useRouteStatus, useRunOnMount, useSelectableElement, useSelectionController, useSidePanelClose, useSignalSync, useStateArray, useTitleLevel, useUrlSearchParam, valueInLocalStorage };
+export { ActionRenderer, ActiveKeyboardShortcuts, Address, Badge, BadgeCount, Box, Button, ButtonCopyToClipboard, Caption, CheckSvg, Checkbox, CheckboxList, CloseSvg, Code, Col, Colgroup, ConstructionSvg, Details, DialogLayout, Editable, ErrorBoundary, ErrorBoundaryContext, ExclamationSvg, EyeClosedSvg, EyeSvg, Form, Group, Head, HeartSvg, HomeSvg, Icon, Image, Input, Label, Link, LinkAnchorSvg, LinkBlankTargetSvg, LinkCurrentSvg, Loading, MessageBox, Meter, Nav, Paragraph, Quantity, QuantityIntl, Radio, RadioList, Route, RowNumberCol, RowNumberTableCell, SINGLE_SPACE_CONSTRAINT, SVGMaskOverlay, SearchSvg, Select, SelectionContext, Separator, SettingsSvg, SidePanel, StarSvg, SummaryMarker, Svg, Table, TableCell, Tbody, Text, Thead, Title, Tr, UITransition, UserSvg, ViewportLayout, actionIntegratedVia, actionRunEffect, addCustomMessage, arraySignalMembership, compareTwoJsValues, createAction, createAvailableConstraint, createIntl, createRequestCanceller, createSelectionKeyboardShortcuts, enableDebugActions, enableDebugOnDocumentLoading, filterTableSelection, forwardActionRequested, installCustomConstraintValidation, isCellSelected, isColumnSelected, isRowSelected, localStorageSignal, navBack, navForward, navTo, openCallout, rawUrlPart, reload, removeCustomMessage, requestAction, rerunActions, resource, route, routeAction, setBaseUrl, setupRoutes, stateSignal, stopLoad, stringifyTableSelectionValue, syncOwnedResourceToSignals, syncResourceToSignals, updateActions, useActionStatus, useArraySignalMembership, useAsyncData, useCalloutClose, useCancelPrevious, useCellGridFromRows, useConstraintValidityState, useDarkBackgroundAttribute, useDependenciesDiff, useDocumentResource, useDocumentState, useDocumentUrl, useEditionController, useFocusGroup, useKeyboardShortcuts, useNavState$1 as useNavState, useOrderedColumns, useRouteStatus, useRunOnMount, useSelectableElement, useSelectionController, useSidePanelClose, useSignalSync, useStateArray, useTitleLevel, useUrlSearchParam, valueInLocalStorage };
 //# sourceMappingURL=jsenv_navi.js.map