@linzjs/windows 16.1.0 → 16.2.0

package/README.md

@@ -7,6 +7,7 @@
 > Reusable promise based windowing component for LINZ / Toitū te whenua.
 
 React state based modals/windows are painful because they require:
+
 - shared states for open/closed.
 - callbacks/states for return values.
 - inline modal/window includes, which prevent you from closing the invoking component before the modal/window has completed.
@@ -15,6 +16,7 @@ This module gives you promise based modals/windows which don't require all the s
 based boilerplate / inline-components.
 
 So you can simply do this in your react-app:
+
 ```
 const result = await showModal(TestModal, { props... })
 
@@ -24,22 +26,28 @@ const result = await showModal(TestModal, { props... })
 ```
 
 ## Features
+
 - Async HTML dialog based Modals.
 - Draggable and resizeable, pop-in/out Panels/Windows.
 
 ## Install
+
 ```
 npm install @linzjs/windows
 ```
+
 or with Yarn
+
 ```
 yarn add @linzjs/windows
 ```
 
 ## Debug log
+
 To enable debug logs set:
+
 ```javascript
-localStorage.setItem("@linzjs/windows.debugEnabled", "true");
+localStorage.setItem('@linzjs/windows.debugEnabled', 'true');
 ```
 
 ## Demo
@@ -123,11 +131,7 @@ export const TestModalUsage = () => {
   const { showModal, modalOwnerRef } = useShowAsyncModal();
 
   const showModalHandler = async () => {
-    const result = await showModal(
-      TestModal,
-      { text: "I'm generic modal content" },
-      { showOnAllWindows: true },
-    );
+    const result = await showModal(TestModal, { text: "I'm generic modal content" }, { showOnAllWindows: true });
 
     if (!result) return alert('Modal closed');
     alert(`Modal result is: ${String(result)}`);
@@ -148,12 +152,12 @@ export const TestModalUsage = () => {
 
 Pre-built modals for common use cases: `outline`, `info`, `warning`, `error`, `success`, `progress`, and `blocked`.
 
-| Outline | Info | Warning | Error |
-|---------|------|---------|-------|
+| Outline                                                                                                          | Info                                                                                                       | Warning                                                                                                          | Error                                                                                                        |
+| ---------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------ |
 | ![Outline modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-outline.png) | ![Info modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-info.png) | ![Warning modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-warning.png) | ![Error modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-error.png) |
 
-| Success | Progress | Blocked | Custom buttons |
-|---------|----------|---------|----------------|
+| Success                                                                                                          | Progress                                                                                                           | Blocked                                                                                                          | Custom buttons                                                                                                         |
+| ---------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------- |
 | ![Success modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-success.png) | ![Progress modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-progress.png) | ![Blocked modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-blocked.png) | ![Custom buttons modal](https://github.com/matsondawson/windows-doc-images/raw/HEAD/docimages/prefab-modal-custom.png) |
 
 **Setup** — same `LuiModalAsyncContextProvider` as above.
@@ -282,6 +286,7 @@ export const PrefabModalUsage = () => {
 ```
 
 To clear a "don't show again" session key programmatically:
+
 ```tsx
 import { LuiModalDontShowSessionRemove } from '@linzjs/windows';
 
@@ -357,14 +362,8 @@ import { Panel, PanelContent, PanelHeader } from '@linzjs/windows';
 
 export const ShowPanelComponent = ({ data }: { data: number }) => (
   <Panel title={`Panel demo ${data}`} size={{ width: 640, height: 'auto' }}>
-    <PanelHeader
-      helpUrl={'#help'}
-      icon={'ic_add_adopt'}
-      onHelpClick={() => alert('Help!')}
-    />
-    <PanelContent>
-      {/* panel body content */}
-    </PanelContent>
+    <PanelHeader helpUrl={'#help'} icon={'ic_add_adopt'} onHelpClick={() => alert('Help!')} />
+    <PanelContent>{/* panel body content */}</PanelContent>
   </Panel>
 );
 
@@ -372,9 +371,7 @@ export const ShowPanelComponent = ({ data }: { data: number }) => (
 export const ShowPanelModalComponent = ({ data }: { data: number }) => (
   <Panel title={`Panel demo ${data}`} size={{ width: 640, height: 400 }} modal={true}>
     <PanelHeader icon={'ic_add_adopt'} disablePopout={true} />
-    <PanelContent>
-      {/* panel body content */}
-    </PanelContent>
+    <PanelContent>{/* panel body content */}</PanelContent>
   </Panel>
 );
 ```
@@ -399,10 +396,7 @@ export const TestShowPanel = () => (
       componentFn={() => <ShowPanelComponent data={2} />}
       uniqueId="panel2"
     />
-    <OpenPanelButton
-      buttonText={'Panel as a Modal'}
-      componentFn={() => <ShowPanelModalComponent data={3} />}
-    />
+    <OpenPanelButton buttonText={'Panel as a Modal'} componentFn={() => <ShowPanelModalComponent data={3} />} />
     {/* Panel with dynamic bounds — recalculated on resize */}
     <OpenPanelButton
       buttonText={'Dynamic bounds panel'}
@@ -425,17 +419,17 @@ export const TestShowPanel = () => (
 
 **Panel props:**
 
-| Prop | Type | Description |
-|------|------|-------------|
-| `title` | `string` | Panel title bar text |
-| `size` | `{ width: number, height: number \| 'auto' }` | Initial panel size |
-| `modal` | `boolean` | Disable dragging and popout, center on screen |
-| `resizeable` | `boolean` | Allow user resizing (default `true`) |
-| `maxHeight` | `number` | Maximum height in px |
-| `maxWidth` | `number` | Maximum width in px |
-| `minHeight` | `number` | Minimum height in px |
-| `minWidth` | `number` | Minimum width in px |
-| `dynamicBounds` | `() => { x, y, width, height }` | Callback to recalculate position/size dynamically |
+| Prop            | Type                                          | Description                                       |
+| --------------- | --------------------------------------------- | ------------------------------------------------- |
+| `title`         | `string`                                      | Panel title bar text                              |
+| `size`          | `{ width: number, height: number \| 'auto' }` | Initial panel size                                |
+| `modal`         | `boolean`                                     | Disable dragging and popout, center on screen     |
+| `resizeable`    | `boolean`                                     | Allow user resizing (default `true`)              |
+| `maxHeight`     | `number`                                      | Maximum height in px                              |
+| `maxWidth`      | `number`                                      | Maximum width in px                               |
+| `minHeight`     | `number`                                      | Minimum height in px                              |
+| `minWidth`      | `number`                                      | Minimum width in px                               |
+| `dynamicBounds` | `() => { x, y, width, height }`               | Callback to recalculate position/size dynamically |
 
 **Saving panel state** — pass `panelStateOptions` to `PanelsContextProvider` or `OpenPanelButton`:
 
@@ -464,9 +458,7 @@ import { useState } from 'react';
 export const DockablePanel = ({ data }: { data: number }) => (
   <Panel title={`Panel demo ${data}`} size={{ width: 640, height: 400 }}>
     <PanelHeader dockTo={'leftSide'} />
-    <PanelContent>
-      {/* panel body content */}
-    </PanelContent>
+    <PanelContent>{/* panel body content */}</PanelContent>
   </Panel>
 );
 
@@ -563,12 +555,17 @@ const PanelContents = () => {
 
 export const TestShowPanelWithGlobalModal = () => (
   <>
-    <OpenPanelButton buttonText={'TestPanel 1'} componentFn={() => (
-      <Panel title={'Panel demo 1'} size={{ width: 640, height: 400 }}>
-        <PanelHeader icon={'ic_send'} onHelpClick={() => alert('Help!!!')} />
-        <PanelContent><PanelContents /></PanelContent>
-      </Panel>
-    )} />
+    <OpenPanelButton
+      buttonText={'TestPanel 1'}
+      componentFn={() => (
+        <Panel title={'Panel demo 1'} size={{ width: 640, height: 400 }}>
+          <PanelHeader icon={'ic_send'} onHelpClick={() => alert('Help!!!')} />
+          <PanelContent>
+            <PanelContents />
+          </PanelContent>
+        </Panel>
+      )}
+    />
   </>
 );
 ```
@@ -586,111 +583,127 @@ A toolbar ribbon with buttons, sliders, menus, and separators. Supports horizont
 
 ```tsx
 import {
-    RibbonButton,
-    RibbonButtonLink,
-    RibbonButtonOpenPanel,
-    RibbonButtonSlider,
-    RibbonContainer,
-    RibbonSeparator,
-    RibbonMenu,
-    RibbonMenuOption,
-    RibbonMenuSeparator,
-    Panel,
-    PanelContent,
-    PanelHeader,
+  RibbonButton,
+  RibbonButtonLink,
+  RibbonButtonOpenPanel,
+  RibbonButtonSlider,
+  RibbonContainer,
+  RibbonSeparator,
+  RibbonMenu,
+  RibbonMenuOption,
+  RibbonMenuSeparator,
+  Panel,
+  PanelContent,
+  PanelHeader,
 } from '@linzjs/windows';
 import { useState } from 'react';
 
 export const TestRibbonPanel = () => {
-    const [selectedItem, setSelectedItem] = useState('ic_add_rectangle');
-    const [loading, setLoading] = useState(false);
-    const [processing, setProcessing] = useState(false);
-
-    return (
-        <>
-            <button onClick={() => setLoading(!loading)}>Toggle loading</button>
-            <button onClick={() => setProcessing(!processing)}>Toggle processing</button>
-
-            {/* Horizontal ribbon */}
-            <RibbonContainer style={{ position: 'absolute', left: 220, top: 120 }}>
-
-                {/* Button that opens a panel — disabled state */}
-                <RibbonButtonOpenPanel
-                    disabled
-                    title={'Marks'}
-                    icon={'ic_marks'}
-                    componentFn={() => <Panel title="Marks" size={{ width: 640, height: 400 }}><PanelHeader /><PanelContent /></Panel>}
-                    loading={loading}
-                />
-
-                <RibbonSeparator />
-
-                {/* Button that opens a panel — with processing indicator */}
-                <RibbonButtonOpenPanel
-                    title={'Vectors'}
-                    icon={'ic_line_irregular'}
-                    componentFn={() => <Panel title="Vectors" size={{ width: 640, height: 400 }}><PanelHeader /><PanelContent /></Panel>}
-                    loading={loading}
-                    processing={processing}
-                    processingMessage={'Validating...'}
-                />
-
-                {/* Slider button — opens a sub-panel of options below */}
-                <RibbonButtonSlider title={selectedItem} icon={selectedItem} alignment={'down'} loading={loading}>
-                    <RibbonContainer orientation={'vertical'}>
-                        <RibbonButton
-                            title={'Rectangle'}
-                            icon={'ic_add_rectangle'}
-                            selected={selectedItem === 'ic_add_rectangle'}
-                            onClick={() => setSelectedItem('ic_add_rectangle')}
-                        />
-                        <RibbonButton
-                            title={'Other'}
-                            icon={'ic_polygon_selection'}
-                            selected={selectedItem === 'ic_polygon_selection'}
-                            onClick={() => setSelectedItem('ic_polygon_selection')}
-                        />
-                    </RibbonContainer>
-                </RibbonButtonSlider>
-
-                {/* Slider button — dropdown menu with autoClose */}
-                <RibbonButtonSlider title={'Other'} icon={'ic_more_vert'} alignment={'down'} autoClose={true} loading={loading}>
-                    <RibbonMenu>
-                        <RibbonMenuOption icon={'ic_define_nonprimary_diagram_circle'}>Circle</RibbonMenuOption>
-                        <RibbonMenuOption icon={'ic_define_nonprimary_diagram_rectangle'} disabled={true}>Rectangle</RibbonMenuOption>
-                        <RibbonMenuSeparator />
-                        <RibbonMenuOption>Item 3</RibbonMenuOption>
-                        <RibbonMenuSeparator />
-                        <RibbonMenuOption icon={'ic_clear'}>Cancel</RibbonMenuOption>
-                    </RibbonMenu>
-                </RibbonButtonSlider>
-            </RibbonContainer>
-
-            {/* Vertical ribbon */}
-            <RibbonContainer orientation={'vertical'} style={{ position: 'absolute', left: 220, top: 180 }}>
-                <RibbonButtonOpenPanel
-                    title={'Vectors'}
-                    icon={'ic_timeline'}
-                    componentFn={() => <Panel title="Vectors" size={{ width: 640, height: 400 }}><PanelHeader /><PanelContent /></Panel>}
-                    loading={loading}
-                />
-                {/* Slider opens to the right */}
-                <RibbonButtonSlider title={selectedItem} icon={selectedItem} alignment={'right'} loading={loading}>
-                    <RibbonContainer>
-                        <RibbonButton
-                            title={'Rectangle'}
-                            icon={'ic_add_rectangle'}
-                            selected={selectedItem === 'ic_add_rectangle'}
-                            onClick={() => setSelectedItem('ic_add_rectangle')}
-                        />
-                    </RibbonContainer>
-                </RibbonButtonSlider>
-                {/* External link button */}
-                <RibbonButtonLink href={'https://example.com/'} icon={'ic_link'} loading={loading} />
-            </RibbonContainer>
-        </>
-    );
+  const [selectedItem, setSelectedItem] = useState('ic_add_rectangle');
+  const [loading, setLoading] = useState(false);
+  const [processing, setProcessing] = useState(false);
+
+  return (
+    <>
+      <button onClick={() => setLoading(!loading)}>Toggle loading</button>
+      <button onClick={() => setProcessing(!processing)}>Toggle processing</button>
+
+      {/* Horizontal ribbon */}
+      <RibbonContainer style={{ position: 'absolute', left: 220, top: 120 }}>
+        {/* Button that opens a panel — disabled state */}
+        <RibbonButtonOpenPanel
+          disabled
+          title={'Marks'}
+          icon={'ic_marks'}
+          componentFn={() => (
+            <Panel title="Marks" size={{ width: 640, height: 400 }}>
+              <PanelHeader />
+              <PanelContent />
+            </Panel>
+          )}
+          loading={loading}
+        />
+
+        <RibbonSeparator />
+
+        {/* Button that opens a panel — with processing indicator */}
+        <RibbonButtonOpenPanel
+          title={'Vectors'}
+          icon={'ic_line_irregular'}
+          componentFn={() => (
+            <Panel title="Vectors" size={{ width: 640, height: 400 }}>
+              <PanelHeader />
+              <PanelContent />
+            </Panel>
+          )}
+          loading={loading}
+          processing={processing}
+          processingMessage={'Validating...'}
+        />
+
+        {/* Slider button — opens a sub-panel of options below */}
+        <RibbonButtonSlider title={selectedItem} icon={selectedItem} alignment={'down'} loading={loading}>
+          <RibbonContainer orientation={'vertical'}>
+            <RibbonButton
+              title={'Rectangle'}
+              icon={'ic_add_rectangle'}
+              selected={selectedItem === 'ic_add_rectangle'}
+              onClick={() => setSelectedItem('ic_add_rectangle')}
+            />
+            <RibbonButton
+              title={'Other'}
+              icon={'ic_polygon_selection'}
+              selected={selectedItem === 'ic_polygon_selection'}
+              onClick={() => setSelectedItem('ic_polygon_selection')}
+            />
+          </RibbonContainer>
+        </RibbonButtonSlider>
+
+        {/* Slider button — dropdown menu with autoClose */}
+        <RibbonButtonSlider title={'Other'} icon={'ic_more_vert'} alignment={'down'} autoClose={true} loading={loading}>
+          <RibbonMenu>
+            <RibbonMenuOption icon={'ic_define_nonprimary_diagram_circle'}>Circle</RibbonMenuOption>
+            <RibbonMenuOption icon={'ic_define_nonprimary_diagram_rectangle'} disabled={true}>
+              Rectangle
+            </RibbonMenuOption>
+            <RibbonMenuSeparator />
+            <RibbonMenuOption>Item 3</RibbonMenuOption>
+            <RibbonMenuSeparator />
+            <RibbonMenuOption icon={'ic_clear'}>Cancel</RibbonMenuOption>
+          </RibbonMenu>
+        </RibbonButtonSlider>
+      </RibbonContainer>
+
+      {/* Vertical ribbon */}
+      <RibbonContainer orientation={'vertical'} style={{ position: 'absolute', left: 220, top: 180 }}>
+        <RibbonButtonOpenPanel
+          title={'Vectors'}
+          icon={'ic_timeline'}
+          componentFn={() => (
+            <Panel title="Vectors" size={{ width: 640, height: 400 }}>
+              <PanelHeader />
+              <PanelContent />
+            </Panel>
+          )}
+          loading={loading}
+        />
+        {/* Slider opens to the right */}
+        <RibbonButtonSlider title={selectedItem} icon={selectedItem} alignment={'right'} loading={loading}>
+          <RibbonContainer>
+            <RibbonButton
+              title={'Rectangle'}
+              icon={'ic_add_rectangle'}
+              selected={selectedItem === 'ic_add_rectangle'}
+              onClick={() => setSelectedItem('ic_add_rectangle')}
+            />
+          </RibbonContainer>
+        </RibbonButtonSlider>
+        {/* External link button */}
+        <RibbonButtonLink href={'https://example.com/'} icon={'ic_link'} loading={loading} />
+      </RibbonContainer>
+    </>
+  );
 };
 ```
 
-**`RibbonButtonSlider` alignment options:** `'down'` | `'up'` | `'left'` | `'right'` | `'left-up'` | `'right-up'` | `'right-center'`
+**`RibbonButtonSlider` alignment options:** `'down'` | `'up'` | `'left'` | `'right'` | `'left-up'` | `'right-up'` | `'right-center'`

package/dist/LuiModalAsync/LuiModalAsync.scss

@@ -1,11 +1,12 @@
-@use "@linzjs/lui/dist/scss/Foundation/Variables/ColorVars" as colors;
-@use "@linzjs/lui/dist/scss/Foundation/Utilities/BoxShadow" as shadow;
-@use "@linzjs/lui/dist/scss/Foundation/Variables/SpacingVars" as spacing;
-@use "@linzjs/lui/dist/scss/Foundation/Variables/FormVars" as form;
-@use "@linzjs/lui/dist/scss/Foundation/Variables/FontVars" as fonts;
-@use "@linzjs/lui/dist/scss/Foundation/Utilities/REM" as rem;
-
-dialog.LuiModalAsync, div.LuiModalAsync  {
+@use '@linzjs/lui/dist/scss/Foundation/Variables/ColorVars' as colors;
+@use '@linzjs/lui/dist/scss/Foundation/Utilities/BoxShadow' as shadow;
+@use '@linzjs/lui/dist/scss/Foundation/Variables/SpacingVars' as spacing;
+@use '@linzjs/lui/dist/scss/Foundation/Variables/FormVars' as form;
+@use '@linzjs/lui/dist/scss/Foundation/Variables/FontVars' as fonts;
+@use '@linzjs/lui/dist/scss/Foundation/Utilities/REM' as rem;
+
+dialog.LuiModalAsync,
+div.LuiModalAsync {
   @include fonts.font-regular();
   font-size: fonts.$base-font-size;
   line-height: fonts.$base-line-height;
@@ -26,7 +27,8 @@ dialog.LuiModalAsync::backdrop {
   background: rgb(0 0 0 / 10%);
 }
 
-dialog.LuiModalAsync, div.LuiModalAsync {
+dialog.LuiModalAsync,
+div.LuiModalAsync {
   box-sizing: border-box;
 
   @include shadow.drop-shadow(sm);

package/dist/components/CopyableText.scss

@@ -1,4 +1,4 @@
-@use "@linzjs/lui/dist/scss/Foundation/Variables/ColorVars" as lui;
+@use '@linzjs/lui/dist/scss/Foundation/Variables/ColorVars' as lui;
 
 .CopyToClipboard {
   cursor: pointer;
@@ -12,7 +12,9 @@
 
   .windows_tooltiptext {
     opacity: 0;
-    transition: opacity 0.3s ease, width 0.3s ease;
+    transition:
+      opacity 0.3s ease,
+      width 0.3s ease;
     pointer-events: none;
     background-color: white;
     color: rgb(46 52 56);
@@ -26,11 +28,13 @@
 
     left: calc(100% + 8px);
     transform: translateY(42%);
-    box-shadow: 0 2px 3px #00000040, 0 0 3px #00000026;
+    box-shadow:
+      0 2px 3px #00000040,
+      0 0 3px #00000026;
   }
 
   &:hover .windows_tooltiptext {
     visibility: visible;
     opacity: 1;
   }
-}
+}

package/dist/index.js

@@ -2253,50 +2253,6 @@ const LuiModalAsyncContextProvider = ({ children }) => {
   );
 };
 
-const NoContext = () => {
-  console.error("Missing PanelContext Provider");
-  return void 0;
-};
-const PanelsContext = createContext({
-  openPanels: /* @__PURE__ */ new Set(),
-  hasOpenPanel: () => false,
-  openPanel: NoContext,
-  closePanel: NoContext,
-  hidePanel: NoContext,
-  hideAllPanels: NoContext,
-  unhidePanel: NoContext,
-  unhideAllPanels: NoContext,
-  hasHiddenPanel: NoContext,
-  bringPanelToFront: NoContext,
-  dockElements: {},
-  setDockElement: NoContext,
-  nextStackPosition: () => ({ x: 0, y: 0 })
-});
-
-const OpenPanelButton = ({
-  buttonText,
-  testId,
-  uniqueId = buttonText,
-  ...openPanelOptions
-}) => {
-  const { openPanel, closePanel, hidePanel, unhidePanel, hasOpenPanel, hasHiddenPanel } = useContext(PanelsContext);
-  const open = hasOpenPanel(uniqueId);
-  const hidden = hasHiddenPanel(uniqueId);
-  return /* @__PURE__ */ jsxs("div", { children: [
-    /* @__PURE__ */ jsxs("b", { children: [
-      buttonText,
-      " ",
-      open ? "(Open)" : ""
-    ] }),
-    /* @__PURE__ */ jsx("br", {}),
-    !open && /* @__PURE__ */ jsx("button", { "data-testid": testId + "Open", onClick: () => openPanel({ uniqueId, ...openPanelOptions }), children: "Open" }),
-    open && /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("button", { "data-testid": testId + "Close", onClick: () => closePanel(uniqueId), children: "Close" }),
-      hidden ? /* @__PURE__ */ jsx("button", { "data-testid": testId + "Unhide", onClick: () => unhidePanel(uniqueId), children: "Unhide" }) : /* @__PURE__ */ jsx("button", { "data-testid": testId + "Hide", onClick: () => hidePanel(uniqueId), children: "Hide" })
-    ] })
-  ] });
-};
-
 const NoContextError$1 = () => {
   console.error("Missing PanelInstanceContext Provider");
 };
@@ -2318,6 +2274,26 @@ const PanelInstanceContext = createContext({
   hidden: false
 });
 
+const NoContext = () => {
+  console.error("Missing PanelContext Provider");
+  return void 0;
+};
+const PanelsContext = createContext({
+  openPanels: /* @__PURE__ */ new Set(),
+  hasOpenPanel: () => false,
+  openPanel: NoContext,
+  closePanel: NoContext,
+  hidePanel: NoContext,
+  hideAllPanels: NoContext,
+  unhidePanel: NoContext,
+  unhideAllPanels: NoContext,
+  hasHiddenPanel: NoContext,
+  bringPanelToFront: NoContext,
+  dockElements: {},
+  setDockElement: NoContext,
+  nextStackPosition: () => ({ x: 0, y: 0 })
+});
+
 function getDefaultExportFromCjs (x) {
 	return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, 'default') ? x['default'] : x;
 }
@@ -8010,5 +7986,5 @@ const focusNextRibbonButton = () => {
   button?.focus();
 };
 
-export { ButtonIconHorizontalGroup, ButtonIconSeparator, ButtonIconVerticalGroup, CopyableText, LuiModalAsync, LuiModalAsyncButtonContinue, LuiModalAsyncButtonDismiss, LuiModalAsyncButtonGroup, LuiModalAsyncContent, LuiModalAsyncContext, LuiModalAsyncContextProvider, LuiModalAsyncHeader, LuiModalAsyncInstanceContext, LuiModalAsyncMain, LuiModalDontShowSessionCheck, LuiModalDontShowSessionRemove, LuiModalDontShowSessionSet, LuiModalPrefab, LuiModalUpload, OpenPanelButton, OpenPanelIcon, Panel, PanelContent, PanelContext, PanelDock, PanelFooter, PanelHeader, PanelHeaderButton, PanelInline, PanelInstanceContext, PanelInstanceContextProvider, PanelsContext, PanelsContextProvider, RibbonButton, RibbonButtonLink, RibbonButtonOpenPanel, RibbonButtonSlider, RibbonButtonSliderContext, RibbonContainer, RibbonMenu, RibbonMenuContext, RibbonMenuOption, RibbonMenuSeparator, RibbonSeparator, getIconForLevel, openModalOnAllWindows, ribbonSliderAlignments, tabToNextSiblingElement, tabToPreviousSiblingElement, tabToSiblingElement, useConstFunction, useLuiModalPrefab, useLuiModalUpload, useShowAsyncModal };
+export { ButtonIconHorizontalGroup, ButtonIconSeparator, ButtonIconVerticalGroup, CopyableText, LuiModalAsync, LuiModalAsyncButtonContinue, LuiModalAsyncButtonDismiss, LuiModalAsyncButtonGroup, LuiModalAsyncContent, LuiModalAsyncContext, LuiModalAsyncContextProvider, LuiModalAsyncHeader, LuiModalAsyncInstanceContext, LuiModalAsyncMain, LuiModalDontShowSessionCheck, LuiModalDontShowSessionRemove, LuiModalDontShowSessionSet, LuiModalPrefab, LuiModalUpload, OpenPanelIcon, Panel, PanelContent, PanelContext, PanelDock, PanelFooter, PanelHeader, PanelHeaderButton, PanelInline, PanelInstanceContext, PanelInstanceContextProvider, PanelsContext, PanelsContextProvider, RibbonButton, RibbonButtonLink, RibbonButtonOpenPanel, RibbonButtonSlider, RibbonButtonSliderContext, RibbonContainer, RibbonMenu, RibbonMenuContext, RibbonMenuOption, RibbonMenuSeparator, RibbonSeparator, getIconForLevel, openModalOnAllWindows, ribbonSliderAlignments, tabToNextSiblingElement, tabToPreviousSiblingElement, tabToSiblingElement, useConstFunction, useLuiModalPrefab, useLuiModalUpload, useShowAsyncModal };
 //# sourceMappingURL=index.js.map