@stack-spot/portal-layout 0.0.51 → 0.0.52

package/dist/components/menu/MenuContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"MenuContent.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":";;AAYA,OAAO,EAAa,UAAU,EAAY,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAY7E,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsIrB,CAAA;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIjB,CAAA;AAED,eAAO,MAAM,UAAU,4DAAsE,UAAU,4CAuBtG,CAAA;AAoED,eAAO,MAAM,WAAW,mFAAyF,kBAAkB,4CAsClI,CAAA"}
+{"version":3,"file":"MenuContent.d.ts","sourceRoot":"","sources":["../../../src/components/menu/MenuContent.tsx"],"names":[],"mappings":";;AAYA,OAAO,EAAa,UAAU,EAAY,kBAAkB,EAAE,MAAM,SAAS,CAAA;AAY7E,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAsIrB,CAAA;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAIjB,CAAA;AAED,eAAO,MAAM,UAAU,4DAAsE,UAAU,4CAuBtG,CAAA;AAoED,eAAO,MAAM,WAAW,mFAAyF,kBAAkB,4CAsClI,CAAA"}

package/dist/components/menu/MenuContent.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime.js";
 /* eslint-disable react-refresh/only-export-components */
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import { Flex, IconBox, Text } from '@citric/core';
@@ -12,153 +12,153 @@ import { hideOverlayImmediately } from './MenuSections.js';
 import { PageSelector } from './PageSelector.js';
 import { MENU_CONTENT_ITEM_PADDING as ITEM_PADDING, MENU_CONTENT_PADDING as PADDING } from './constants.js';
 import { useCheckTextOverflow } from './use-check-text-overflow.js';
-const BackLink = styled.a `
-  display: flex;
-  flex-direction: row;
-  align-items: center;
-  margin: ${PADDING}px;
-  margin-bottom: 16px;
-  gap: 6px;
+const BackLink = styled.a `
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  margin: ${PADDING}px;
+  margin-bottom: 16px;
+  gap: 6px;
 `;
-export const MenuGroup = styled.ul `
-  padding: 0 0 0 16px;
-  display: flex;
-  flex-direction: column;
-  visibility: hidden;
-  transition: visibility 0s 0.3s;
-
-  &.no-indentation {
-    padding: 0;
-  }
-
-  .item-row-group > a {
-    padding: 0 16px;
-    margin: 0;
-    border-radius: 0;
-  }
-
-  .item-row-group > a::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    background-color: var(--light-300);
-    opacity: 0.24;
-    border-radius: inherit;
-  }
-
-  .item-row {
-    display: flex;
-    flex-direction: row;
-    gap: 8px;
-    align-items: center;
-
-    .label {
-      flex: 1;
-      &.hidden, &.ellipsis {
-        white-space: nowrap;
-        overflow: hidden;
-      }
-      &.ellipsis {
-        text-overflow: ellipsis;
-      }
-    }
-  }
-  
-  .item-row-group {
-    margin-top: 16px;
-  }
-
-  li a {
-    position: relative;
-    height: 0;
-    overflow: hidden;
-    transition: height 0.3s, background-color 0.2s;
-    margin-left: ${PADDING - ITEM_PADDING}px;
-    padding-left: ${ITEM_PADDING}px;
-
-    &:hover {
-      background-color: ${theme.color.light['500']};
-    }
-    
-    &.action {
-      &:before {
-        content: '';
-        position: absolute;
-        left: 2px;
-        width: 2px;
-        height: 0;
-        background: inherit;
-        transition: height 0.2s;
-      }
-
-      &.active {
-  
-        &:hover {
-          background-color: transparent;
-        }
-  
-        &:before {
-          background: ${theme.color.primary['500']};
-          height: 24px;
-        }
-      }
-
-      &:not(.active):hover:before {
-        background: ${theme.color.light.contrastText};
-        height: 24px;
-      }
-    }
-
-    .chevron {
-      transition: transform 0.3s;
-      &:not(.open) {
-        transform: rotate(-90deg);
-      }
-    }
-
-    .item-row-title {
-      opacity: 0.7;
-    }
-  }
-
-  &.open {
-    visibility: visible;
-    transition: unset;
-    & > li > a, & > li > .item-row-group > a  {
-      height: 40px;
-    }
-  }
-
-  &:not(.open) &.open > li > a {
-    height: 0;
-  }
-
-  &.root {
-    margin-bottom: ${PADDING}px;
-
-    & > li {
-      .group-title {
-        margin-left: ${PADDING}px;
-        margin-bottom: 5px;
-        margin-top: 40px;
-        display: block;
-      }
-
-      &:first-child {
-        .group-title {
-          margin-top: 0;
-        }
-      }
-    }
-  }
+export const MenuGroup = styled.ul `
+  padding: 0 0 0 16px;
+  display: flex;
+  flex-direction: column;
+  visibility: hidden;
+  transition: visibility 0s 0.3s;
+
+  &.no-indentation {
+    padding: 0;
+  }
+
+  .item-row-group > a {
+    padding: 0 16px;
+    margin: 0;
+    border-radius: 0;
+  }
+
+  .item-row-group > a::before {
+    content: '';
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    background-color: var(--light-300);
+    opacity: 0.24;
+    border-radius: inherit;
+  }
+
+  .item-row {
+    display: flex;
+    flex-direction: row;
+    gap: 8px;
+    align-items: center;
+
+    .label {
+      flex: 1;
+      &.hidden, &.ellipsis {
+        white-space: nowrap;
+        overflow: hidden;
+      }
+      &.ellipsis {
+        text-overflow: ellipsis;
+      }
+    }
+  }
+  
+  .item-row-group {
+    margin-top: 16px;
+  }
+
+  li a {
+    position: relative;
+    height: 0;
+    overflow: hidden;
+    transition: height 0.3s, background-color 0.2s;
+    margin-left: ${PADDING - ITEM_PADDING}px;
+    padding-left: ${ITEM_PADDING}px;
+
+    &:hover {
+      background-color: ${theme.color.light['500']};
+    }
+    
+    &.action {
+      &:before {
+        content: '';
+        position: absolute;
+        left: 2px;
+        width: 2px;
+        height: 0;
+        background: inherit;
+        transition: height 0.2s;
+      }
+
+      &.active {
+  
+        &:hover {
+          background-color: transparent;
+        }
+  
+        &:before {
+          background: ${theme.color.primary['500']};
+          height: 24px;
+        }
+      }
+
+      &:not(.active):hover:before {
+        background: ${theme.color.light.contrastText};
+        height: 24px;
+      }
+    }
+
+    .chevron {
+      transition: transform 0.3s;
+      &:not(.open) {
+        transform: rotate(-90deg);
+      }
+    }
+
+    .item-row-title {
+      opacity: 0.7;
+    }
+  }
+
+  &.open {
+    visibility: visible;
+    transition: unset;
+    & > li > a, & > li > .item-row-group > a  {
+      height: 40px;
+    }
+  }
+
+  &:not(.open) &.open > li > a {
+    height: 0;
+  }
+
+  &.root {
+    margin-bottom: ${PADDING}px;
+
+    & > li {
+      .group-title {
+        margin-left: ${PADDING}px;
+        margin-bottom: 5px;
+        margin-top: 40px;
+        display: block;
+      }
+
+      &:first-child {
+        .group-title {
+          margin-top: 0;
+        }
+      }
+    }
+  }
 `;
-export const Title = styled.header `
-  display: flex;
-  flex-direction: column;
-  margin: ${PADDING}px 0 24px ${PADDING}px;
+export const Title = styled.header `
+  display: flex;
+  flex-direction: column;
+  margin: ${PADDING}px 0 24px ${PADDING}px;
 `;
 export const ActionItem = ({ label, onClick, href, active, icon, badge, overflow = 'wrap' }) => {
     const Link = useAnchorTag();

package/dist/components/menu/MenuSections.d.ts

@@ -1,4 +1,4 @@
 import { MenuProps } from './types.js';
 export declare function hideOverlayImmediately(): void;
-export declare const MenuSections: ({ sections, ...props }: MenuProps) => import("react/jsx-runtime").JSX.Element;
+export declare const MenuSections: ({ sections, ...props }: MenuProps) => import("react/jsx-runtime.js").JSX.Element;
 //# sourceMappingURL=MenuSections.d.ts.map

package/dist/components/menu/MenuSections.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime.js";
 import { Flex, IconBox, Text } from '@citric/core';
 import { ChevronRight, Cog, Collapse, Expand } from '@citric/icons';
 import { interpolate, useTranslate } from '@stack-spot/portal-translate';

package/dist/components/menu/PageSelector.d.ts

@@ -1,3 +1,3 @@
 import { Selector } from './types.js';
-export declare const PageSelector: ({ options, value, button, loading, title }: Selector) => import("react/jsx-runtime").JSX.Element;
+export declare const PageSelector: ({ options, value, button, loading, title }: Selector) => import("react/jsx-runtime.js").JSX.Element;
 //# sourceMappingURL=PageSelector.d.ts.map

package/dist/components/menu/PageSelector.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime.js";
 import { IconBox, Text } from '@citric/core';
 import { ArrowRight, Select } from '@citric/icons';
 import { LoadingCircular } from '@citric/ui';
@@ -10,70 +10,70 @@ import { useAnchorTag } from '../../layout-context.js';
 import { SelectionList } from '../SelectionList.js';
 import { MENU_CONTENT_PADDING as PADDING } from './constants.js';
 import { useCheckTextOverflow } from './use-check-text-overflow.js';
-const SelectorBox = styled.div `
-  position: relative;
-  margin: ${PADDING}px;
-  margin-bottom: 28px;
-
-  > a {
-    display: flex;
-    gap: 8px;
-    align-items: center;
-    border-radius: 0.25rem;
-    border: 1px solid ${theme.color.light['500']};
-    padding: 8px;
-    transition: background-color 0.2s;
-
-    &:hover {
-      background-color: ${theme.color.light['500']};
-    }
-
-    .label {
-      flex: 1;
-      white-space: nowrap;
-      overflow: hidden;
-      text-overflow: ellipsis;
-    }
-  }
-
-  .selection-list {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    box-shadow: none;
-    border-radius: 0.25rem;
-
-    .selection-list-content {
-      padding: 8px;
-      border-radius: 0.25rem;
-      border: none;
-      ul {
-        display: flex;
-        flex-direction: column;
-        gap: 8px;
-      }
-    }
-
-    li > a {
-      border: 1px solid ${theme.color.light['500']};
-      background-color: ${theme.color.light['400']};
-
-      &:hover {
-        background-color: ${theme.color.light['500']};
-      }
-    }
-
-    .view-all {
-      background: ${theme.color.light['500']};
-      border-radius: 0.25rem;
-      height: 40px;
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      margin-top: 8px;
-    }
-  }
+const SelectorBox = styled.div `
+  position: relative;
+  margin: ${PADDING}px;
+  margin-bottom: 28px;
+
+  > a {
+    display: flex;
+    gap: 8px;
+    align-items: center;
+    border-radius: 0.25rem;
+    border: 1px solid ${theme.color.light['500']};
+    padding: 8px;
+    transition: background-color 0.2s;
+
+    &:hover {
+      background-color: ${theme.color.light['500']};
+    }
+
+    .label {
+      flex: 1;
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+  }
+
+  .selection-list {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    box-shadow: none;
+    border-radius: 0.25rem;
+
+    .selection-list-content {
+      padding: 8px;
+      border-radius: 0.25rem;
+      border: none;
+      ul {
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+      }
+    }
+
+    li > a {
+      border: 1px solid ${theme.color.light['500']};
+      background-color: ${theme.color.light['400']};
+
+      &:hover {
+        background-color: ${theme.color.light['500']};
+      }
+    }
+
+    .view-all {
+      background: ${theme.color.light['500']};
+      border-radius: 0.25rem;
+      height: 40px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      margin-top: 8px;
+    }
+  }
 `;
 export const PageSelector = ({ options, value, button, loading, title }) => {
     const Link = useAnchorTag();

package/dist/layout-context.d.ts

@@ -5,6 +5,6 @@ export interface LayoutContext {
 }
 export declare const LayoutProvider: ({ children, ...props }: LayoutContext & {
     children: React.ReactNode;
-}) => import("react/jsx-runtime").JSX.Element;
+}) => import("react/jsx-runtime.js").JSX.Element;
 export declare function useAnchorTag(): AnchorComponent;
 //# sourceMappingURL=layout-context.d.ts.map

package/dist/layout-context.js

@@ -1,4 +1,4 @@
-import { jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx } from "react/jsx-runtime.js";
 /* eslint-disable react-refresh/only-export-components */
 import { createContext, useContext } from 'react';
 const context = createContext({});