@vuu-ui/vuu-layout 2.1.17 → 2.1.19-beta.1

package/cjs/palette/Palette.js

@@ -1,115 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var core = require('@salt-ds/core');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var cx = require('clsx');
-var React = require('react');
-var LayoutProvider = require('../layout-provider/LayoutProvider.js');
-require('../layout-provider/LayoutProviderContext.js');
-var View = require('../layout-view/View.js');
-var Palette$1 = require('./Palette.css.js');
-
-const classBase = "vuuPalette";
-const clonePaletteItem = (paletteItem) => {
-  const dolly = paletteItem.cloneNode(true);
-  dolly.id = "";
-  delete dolly.dataset.idx;
-  return dolly;
-};
-const wrapInView = (component, viewProps) => {
-  const id = vuuUtils.uuid();
-  return /* @__PURE__ */ jsxRuntime.jsx(View.View, { id, ...viewProps, children: component }, id);
-};
-const PaletteItem = React.memo(
-  ({
-    className,
-    component,
-    idx,
-    key,
-    value,
-    ViewProps,
-    ...props
-  }) => {
-    const targetWindow = window.useWindow();
-    styles.useComponentCssInjection({
-      testId: "vuu-palette",
-      css: Palette$1,
-      window: targetWindow
-    });
-    const dispatch = LayoutProvider.useLayoutProviderDispatch();
-    const handleMouseDown = React.useCallback(
-      (e) => {
-        const el = vuuUtils.queryClosest(e.target, ".vuuPaletteItem", true);
-        const { height, left, top, width } = el.getBoundingClientRect();
-        dispatch({
-          dragRect: {
-            left,
-            top,
-            right: left + width,
-            bottom: top + 150,
-            width,
-            height
-          },
-          dragElement: clonePaletteItem(el),
-          evt: e.nativeEvent,
-          instructions: {
-            DoNotRemove: true,
-            DoNotTransform: true,
-            DriftHomeIfNoDropTarget: true,
-            RemoveDraggableOnDragEnd: true,
-            dragThreshold: 10
-          },
-          path: "*",
-          payload: wrapInView(component, ViewProps),
-          type: "drag-start"
-        });
-      },
-      [ViewProps, component, dispatch]
-    );
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      core.Option,
-      {
-        className: cx("vuuPaletteItem", className),
-        "data-draggable": true,
-        "data-index": idx,
-        onMouseDown: handleMouseDown,
-        value,
-        ...props
-      }
-    );
-  }
-);
-PaletteItem.displayName = "PaletteItem";
-const Palette = ({
-  ListBoxProps: ListBoxProps2,
-  ViewProps,
-  children,
-  className,
-  orientation = "horizontal",
-  ...props
-}) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    core.ListBox,
-    {
-      ...ListBoxProps2,
-      ...props,
-      className: cx(classBase, className, `${classBase}-${orientation}`),
-      selected: [],
-      children: children.map(
-        (child, idx) => child.type === PaletteItem ? React.cloneElement(child, {
-          idx,
-          key: idx
-          // eslint-disable-next-line @typescript-eslint/no-explicit-any
-        }) : child
-      )
-    }
-  );
-};
-vuuUtils.registerComponent("Palette", Palette, "view");
-
-exports.Palette = Palette;
-exports.PaletteItem = PaletteItem;
-//# sourceMappingURL=Palette.js.map

package/cjs/palette/Palette.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Palette.js","sources":["../../../../packages/vuu-layout/src/palette/Palette.tsx"],"sourcesContent":["import { ListBox, ListBoxProps, Option, OptionProps } from \"@salt-ds/core\";\nimport { queryClosest, registerComponent, uuid } from \"@vuu-ui/vuu-utils\";\n\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n  HTMLAttributes,\n  MouseEventHandler,\n  ReactElement,\n  cloneElement,\n  memo,\n  useCallback,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View } from \"../layout-view/View\";\nimport type { ViewProps } from \"../layout-view/viewTypes\";\n\nimport paletteCss from \"./Palette.css\";\n\nconst classBase = \"vuuPalette\";\n\nconst clonePaletteItem = (paletteItem: HTMLElement) => {\n  const dolly = paletteItem.cloneNode(true) as HTMLElement;\n  dolly.id = \"\";\n  delete dolly.dataset.idx;\n  return dolly;\n};\n\nconst wrapInView = (\n  component: ReactElement,\n  viewProps?: Partial<ViewProps>,\n) => {\n  const id = uuid();\n  return (\n    <View id={id} key={id} {...viewProps}>\n      {component}\n    </View>\n  );\n};\nexport interface PaletteItemProps extends OptionProps {\n  /**\n   * This is the payload that will be created when the\n   * palette item is dropped\n   */\n  ViewProps?: Pick<\n    ViewProps,\n    \"allowRename\" | \"closeable\" | \"header\" | \"resizeable\" | \"resize\" | \"title\"\n  >;\n  component: ReactElement;\n  idx?: number;\n}\n\nexport const PaletteItem = memo(\n  ({\n    className,\n    component,\n    idx,\n    key,\n    value,\n    ViewProps,\n    ...props\n  }: PaletteItemProps) => {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"vuu-palette\",\n      css: paletteCss,\n      window: targetWindow,\n    });\n    const dispatch = useLayoutProviderDispatch();\n\n    const handleMouseDown = useCallback<MouseEventHandler<HTMLDivElement>>(\n      (e) => {\n        const el = queryClosest(e.target, \".vuuPaletteItem\", true);\n        const { height, left, top, width } = el.getBoundingClientRect();\n\n        dispatch({\n          dragRect: {\n            left,\n            top,\n            right: left + width,\n            bottom: top + 150,\n            width,\n            height,\n          },\n          dragElement: clonePaletteItem(el),\n          evt: e.nativeEvent,\n          instructions: {\n            DoNotRemove: true,\n            DoNotTransform: true,\n            DriftHomeIfNoDropTarget: true,\n            RemoveDraggableOnDragEnd: true,\n            dragThreshold: 10,\n          },\n          path: \"*\",\n          payload: wrapInView(component, ViewProps),\n          type: \"drag-start\",\n        });\n      },\n      [ViewProps, component, dispatch],\n    );\n\n    return (\n      <Option\n        className={cx(\"vuuPaletteItem\", className)}\n        data-draggable\n        data-index={idx}\n        onMouseDown={handleMouseDown}\n        value={value}\n        {...props}\n      />\n    );\n  },\n);\n\nPaletteItem.displayName = \"PaletteItem\";\n\nexport interface PaletteProps\n  extends Omit<\n    HTMLAttributes<HTMLDivElement>,\n    \"onDragStart\" | \"onDrop\" | \"onSelect\"\n  > {\n  ListBoxProps?: Partial<ListBoxProps>;\n  ViewProps?: Partial<ViewProps>;\n  children: ReactElement[];\n  orientation: \"horizontal\" | \"vertical\";\n  selection?: string;\n}\n\nexport const Palette = ({\n  ListBoxProps,\n  ViewProps,\n  children,\n  className,\n  orientation = \"horizontal\",\n  ...props\n}: PaletteProps) => {\n  return (\n    <ListBox\n      {...ListBoxProps}\n      {...props}\n      className={cx(classBase, className, `${classBase}-${orientation}`)}\n      selected={[]}\n    >\n      {children.map((child, idx) =>\n        child.type === PaletteItem\n          ? cloneElement(child, {\n              idx,\n              key: idx,\n              // eslint-disable-next-line @typescript-eslint/no-explicit-any\n            } as any)\n          : child,\n      )}\n    </ListBox>\n  );\n};\n\nregisterComponent(\"Palette\", Palette, \"view\");\n"],"names":["uuid","View","memo","useWindow","useComponentCssInjection","paletteCss","useLayoutProviderDispatch","useCallback","queryClosest","jsx","Option","ListBoxProps","ListBox","cloneElement","registerComponent"],"mappings":"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"}

package/cjs/placeholder/LayoutStartPanel.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var layoutStartPanelCss = ".vuuLayoutStartPanel {\n    align-items: center;\n    flex: 0 0 auto !important;\n    display: flex;\n    flex-direction: column;\n    font-weight: 700;\n    gap: 12px;\n}\n\n.vuuLayoutStartPanel-title {\n    color: var(--vuu-color-gray-80);\n    font-size: 28px;\n    line-height: 1.5;\n    text-align: center;\n}\n\n.vuuLayoutStartPanel-text {\n    color: var(--vuu-color-gray-50);\n    font-size: 18px;\n    line-height: 1.5;\n    max-width: 460px;\n}\n\n.vuuLayoutStartPanel-addButton {\n    --vuu-icon-size: 20px;\n    --saltButton-borderRadius: 28px !important;\n    --saltButton-height: 56px;\n    --saltButton-width: 56px;\n    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);\n}";
-
-module.exports = layoutStartPanelCss;
-//# sourceMappingURL=LayoutStartPanel.css.js.map

package/cjs/placeholder/LayoutStartPanel.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutStartPanel.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/cjs/placeholder/LayoutStartPanel.js

@@ -1,56 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var React = require('react');
-var ViewContext = require('../layout-view-actions/ViewContext.js');
-var LayoutStartPanel$1 = require('./LayoutStartPanel.css.js');
-
-const classBase = "vuuLayoutStartPanel";
-const LayoutStartPanel = (htmlAttributes) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-layout-start-panel",
-    css: LayoutStartPanel$1,
-    window: targetWindow
-  });
-  const { dispatch, path } = ViewContext.useViewContext();
-  const [displayState, setDisplayState] = React.useState();
-  React.useMemo(() => {
-    dispatch?.({
-      type: "query",
-      path,
-      query: "PARENT_CONTAINER"
-    }).then((response) => {
-      if (response?.parentContainerId === vuuUtils.VuuShellLocation.Workspace) {
-        setDisplayState("initial");
-      } else {
-        setDisplayState("nested");
-      }
-    });
-  }, [dispatch, path]);
-  if (displayState === void 0) {
-    return null;
-  }
-  const showInitialState = displayState === "initial";
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ...htmlAttributes, className: classBase, children: [
-    showInitialState ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-title`, children: "Start by adding a table" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: `${classBase}-text`, children: "To add a table, drag any of the Vuu Tables to this area or click the button below" })
-    ] }) : null,
-    /* @__PURE__ */ jsxRuntime.jsx(
-      vuuUiControls.IconButton,
-      {
-        className: `${classBase}-addButton`,
-        icon: "add",
-        variant: "cta"
-      }
-    )
-  ] });
-};
-
-exports.LayoutStartPanel = LayoutStartPanel;
-//# sourceMappingURL=LayoutStartPanel.js.map

package/cjs/placeholder/LayoutStartPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutStartPanel.js","sources":["../../../../packages/vuu-layout/src/placeholder/LayoutStartPanel.tsx"],"sourcesContent":["import { IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { VuuShellLocation } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { HTMLAttributes, useMemo, useState } from \"react\";\nimport {\n  QueryResponse,\n  useViewContext,\n} from \"../layout-view-actions/ViewContext\";\n\nimport layoutStartPanelCss from \"./LayoutStartPanel.css\";\n\nconst classBase = \"vuuLayoutStartPanel\";\n\nexport interface LayoutStartPanelProps extends HTMLAttributes<HTMLDivElement> {\n  label?: string;\n}\n\nexport const LayoutStartPanel = (htmlAttributes: LayoutStartPanelProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-layout-start-panel\",\n    css: layoutStartPanelCss,\n    window: targetWindow,\n  });\n\n  const { dispatch, path } = useViewContext();\n  const [displayState, setDisplayState] = useState<\n    \"initial\" | \"nested\" | undefined\n  >();\n\n  useMemo(() => {\n    dispatch?.({\n      type: \"query\",\n      path,\n      query: \"PARENT_CONTAINER\",\n    }).then((response) => {\n      if (\n        (response as QueryResponse)?.parentContainerId ===\n        VuuShellLocation.Workspace\n      ) {\n        setDisplayState(\"initial\");\n      } else {\n        setDisplayState(\"nested\");\n      }\n    });\n  }, [dispatch, path]);\n\n  if (displayState === undefined) {\n    return null;\n  }\n\n  const showInitialState = displayState === \"initial\";\n\n  return (\n    <div {...htmlAttributes} className={classBase}>\n      {showInitialState ? (\n        <>\n          <div className={`${classBase}-title`}>Start by adding a table</div>\n          <div className={`${classBase}-text`}>\n            To add a table, drag any of the Vuu Tables to this area or click the\n            button below\n          </div>\n        </>\n      ) : null}\n      <IconButton\n        className={`${classBase}-addButton`}\n        icon=\"add\"\n        variant=\"cta\"\n      />\n    </div>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","layoutStartPanelCss","useViewContext","useState","useMemo","VuuShellLocation","jsxs","Fragment","jsx","IconButton"],"mappings":";;;;;;;;;;;AAYA,MAAM,SAAY,GAAA,qBAAA;AAML,MAAA,gBAAA,GAAmB,CAAC,cAA0C,KAAA;AACzE,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,wBAAA;AAAA,IACR,GAAK,EAAAC,kBAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,QAAA,EAAU,IAAK,EAAA,GAAIC,0BAAe,EAAA;AAC1C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAIC,cAEtC,EAAA;AAEF,EAAAC,aAAA,CAAQ,MAAM;AACZ,IAAW,QAAA,GAAA;AAAA,MACT,IAAM,EAAA,OAAA;AAAA,MACN,IAAA;AAAA,MACA,KAAO,EAAA;AAAA,KACR,CAAA,CAAE,IAAK,CAAA,CAAC,QAAa,KAAA;AACpB,MACG,IAAA,QAAA,EAA4B,iBAC7B,KAAAC,yBAAA,CAAiB,SACjB,EAAA;AACA,QAAA,eAAA,CAAgB,SAAS,CAAA;AAAA,OACpB,MAAA;AACL,QAAA,eAAA,CAAgB,QAAQ,CAAA;AAAA;AAC1B,KACD,CAAA;AAAA,GACA,EAAA,CAAC,QAAU,EAAA,IAAI,CAAC,CAAA;AAEnB,EAAA,IAAI,iBAAiB,KAAW,CAAA,EAAA;AAC9B,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,MAAM,mBAAmB,YAAiB,KAAA,SAAA;AAE1C,EAAA,uBACGC,eAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SACjC,EAAA,QAAA,EAAA;AAAA,IAAA,gBAAA,mBAEGA,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAAC,cAAA,CAAC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAU,QAAuB,EAAA,yBAAA,EAAA,CAAA;AAAA,qCAC5D,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,SAAS,QAGrC,EAAA,mFAAA,EAAA;AAAA,KAAA,EACF,CACE,GAAA,IAAA;AAAA,oBACJA,cAAA;AAAA,MAACC,wBAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,UAAA,CAAA;AAAA,QACvB,IAAK,EAAA,KAAA;AAAA,QACL,OAAQ,EAAA;AAAA;AAAA;AACV,GACF,EAAA,CAAA;AAEJ;;;;"}

package/cjs/placeholder/Placeholder.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var placeholderCss = ".vuuPlaceholder {\n  --vuuView-justify: center;\n  align-items: center;\n  display: flex;\n  flex-basis: 0;\n  flex-grow: 1;\n  flex-shrink: 1;\n}\n\n.vuuPlaceholder-nested {\n  background-color: red;\n}\n\n.vuuPlaceholder-shim {\n  flex-grow: 0;\n  flex-shrink: 0;\n}\n";
-
-module.exports = placeholderCss;
-//# sourceMappingURL=Placeholder.css.js.map

package/cjs/placeholder/Placeholder.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Placeholder.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/cjs/placeholder/Placeholder.js

@@ -1,34 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var cx = require('clsx');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var LayoutStartPanel = require('./LayoutStartPanel.js');
-var View = require('../layout-view/View.js');
-var Placeholder$1 = require('./Placeholder.css.js');
-
-const classBase = "vuuPlaceholder";
-const PlaceholderCore = ({ showStartMenu = true }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: showStartMenu ? /* @__PURE__ */ jsxRuntime.jsx(LayoutStartPanel.LayoutStartPanel, {}) : null });
-};
-const Placeholder = ({
-  className: classNameProp,
-  showStartMenu,
-  ...viewProps
-}) => {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-placeholder",
-    css: Placeholder$1,
-    window: targetWindow
-  });
-  const className = cx(classBase, classNameProp);
-  return /* @__PURE__ */ jsxRuntime.jsx(View.View, { ...viewProps, className, "data-placeholder": true, resizeable: true, children: /* @__PURE__ */ jsxRuntime.jsx(PlaceholderCore, { showStartMenu }) });
-};
-Placeholder.displayName = "Placeholder";
-vuuUtils.registerComponent("Placeholder", Placeholder, "component");
-
-exports.Placeholder = Placeholder;
-//# sourceMappingURL=Placeholder.js.map

package/cjs/placeholder/Placeholder.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Placeholder.js","sources":["../../../../packages/vuu-layout/src/placeholder/Placeholder.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { registerComponent } from \"@vuu-ui/vuu-utils\";\nimport { LayoutStartPanel } from \"./LayoutStartPanel\";\nimport { View } from \"../layout-view/View\";\nimport type { ViewProps } from \"../layout-view/viewTypes\";\n\nimport placeholderCss from \"./Placeholder.css\";\n\nconst classBase = \"vuuPlaceholder\";\n\nexport interface PlaceholderProps extends ViewProps {\n  closeable?: boolean;\n  flexFill?: boolean;\n  resizeable?: boolean;\n  showStartMenu?: boolean;\n  /**\n   * shim is only when we're dealing with intrinsically sized children, which is never\n   * in an actual application. Intrinsic sizing is still experimental.\n   */\n  shim?: boolean;\n}\n\nconst PlaceholderCore = ({ showStartMenu = true }: PlaceholderProps) => {\n  return <>{showStartMenu ? <LayoutStartPanel /> : null}</>;\n};\n\nexport const Placeholder = ({\n  className: classNameProp,\n  showStartMenu,\n  ...viewProps\n}: PlaceholderProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-placeholder\",\n    css: placeholderCss,\n    window: targetWindow,\n  });\n\n  const className = cx(classBase, classNameProp);\n\n  return (\n    <View {...viewProps} className={className} data-placeholder resizeable>\n      <PlaceholderCore showStartMenu={showStartMenu} />\n    </View>\n  );\n};\n\nPlaceholder.displayName = \"Placeholder\";\nregisterComponent(\"Placeholder\", Placeholder, \"component\");\n"],"names":["jsx","Fragment","LayoutStartPanel","useWindow","useComponentCssInjection","placeholderCss","View","registerComponent"],"mappings":";;;;;;;;;;;AAUA,MAAM,SAAY,GAAA,gBAAA;AAclB,MAAM,eAAkB,GAAA,CAAC,EAAE,aAAA,GAAgB,MAA6B,KAAA;AACtE,EAAA,uBAAUA,cAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,aAAA,mBAAiBD,cAAA,CAAAE,iCAAA,EAAA,EAAiB,IAAK,IAAK,EAAA,CAAA;AACxD,CAAA;AAEO,MAAM,cAAc,CAAC;AAAA,EAC1B,SAAW,EAAA,aAAA;AAAA,EACX,aAAA;AAAA,EACA,GAAG;AACL,CAAwB,KAAA;AACtB,EAAA,MAAM,eAAeC,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,aAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA;AAE7C,EAAA,uBACGL,cAAA,CAAAM,SAAA,EAAA,EAAM,GAAG,SAAA,EAAW,SAAsB,EAAA,kBAAA,EAAgB,IAAC,EAAA,UAAA,EAAU,IACpE,EAAA,QAAA,kBAAAN,cAAA,CAAC,eAAgB,EAAA,EAAA,aAAA,EAA8B,CACjD,EAAA,CAAA;AAEJ;AAEA,WAAA,CAAY,WAAc,GAAA,aAAA;AAC1BO,0BAAkB,CAAA,aAAA,EAAe,aAAa,WAAW,CAAA;;;;"}

package/cjs/responsive/useResizeObserver.js

@@ -1,118 +0,0 @@
-'use strict';
-
-var React = require('react');
-
-const WidthHeight = ["height", "width"];
-const HeightOnly = ["height"];
-const WidthOnly = ["width"];
-const observedMap = /* @__PURE__ */ new WeakMap();
-const getTargetSize = (element, contentRect, dimension) => {
-  switch (dimension) {
-    case "height":
-      return contentRect.height;
-    case "scrollHeight":
-      return element.scrollHeight;
-    case "scrollWidth":
-      return element.scrollWidth;
-    case "width":
-      return contentRect.width;
-    default:
-      return 0;
-  }
-};
-const resizeObserver = new ResizeObserver(
-  (entries) => {
-    for (const entry of entries) {
-      const { target, contentRect } = entry;
-      const observedTarget = observedMap.get(target);
-      if (observedTarget) {
-        const { onResize, measurements } = observedTarget;
-        let sizeChanged = false;
-        for (const [dimension, size] of Object.entries(measurements)) {
-          const newSize = getTargetSize(
-            target,
-            contentRect,
-            dimension
-          );
-          if (newSize !== size) {
-            sizeChanged = true;
-            measurements[dimension] = newSize;
-          }
-        }
-        if (sizeChanged) {
-          onResize && onResize(measurements);
-        }
-      }
-    }
-  }
-);
-function useResizeObserver(ref, dimensions, onResize, reportInitialSize = false) {
-  const dimensionsRef = React.useRef(dimensions);
-  const measure = React.useCallback((target) => {
-    const rect = target.getBoundingClientRect();
-    return dimensionsRef.current.reduce(
-      (map, dim) => {
-        map[dim] = getTargetSize(target, rect, dim);
-        return map;
-      },
-      {}
-    );
-  }, []);
-  React.useLayoutEffect(() => {
-    const target = ref.current;
-    let cleanedUp = false;
-    async function registerObserver() {
-      observedMap.set(target, { measurements: {} });
-      cleanedUp = false;
-      const { fonts } = document;
-      if (fonts) {
-        await fonts.ready;
-      }
-      if (!cleanedUp) {
-        const observedTarget = observedMap.get(target);
-        if (observedTarget) {
-          const measurements = measure(target);
-          observedTarget.measurements = measurements;
-          resizeObserver.observe(target);
-          if (reportInitialSize) {
-            onResize(measurements);
-          }
-        }
-      }
-    }
-    if (target) {
-      if (observedMap.has(target)) {
-        throw Error(
-          "useResizeObserver attemping to observe same element twice"
-        );
-      }
-      void registerObserver();
-    }
-    return () => {
-      if (target && observedMap.has(target)) {
-        resizeObserver.unobserve(target);
-        observedMap.delete(target);
-        cleanedUp = true;
-      }
-    };
-  }, [ref, measure, reportInitialSize, onResize]);
-  React.useLayoutEffect(() => {
-    const target = ref.current;
-    const record = observedMap.get(target);
-    if (record) {
-      if (dimensionsRef.current !== dimensions) {
-        dimensionsRef.current = dimensions;
-        const measurements = measure(target);
-        record.measurements = measurements;
-      }
-      record.onResize = onResize;
-    }
-  }, [dimensions, measure, ref, onResize]);
-}
-
-exports.HeightOnly = HeightOnly;
-exports.WidthHeight = WidthHeight;
-exports.WidthOnly = WidthOnly;
-exports.resizeObserver = resizeObserver;
-exports.useResizeObserver = useResizeObserver;
-//# sourceMappingURL=useResizeObserver.js.map

package/cjs/responsive/useResizeObserver.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useResizeObserver.js","sources":["../../../../packages/vuu-layout/src/responsive/useResizeObserver.ts"],"sourcesContent":["/* eslint-disable no-restricted-syntax */\nimport { useCallback, useLayoutEffect, useRef, RefObject } from \"react\";\nexport const WidthHeight = [\"height\", \"width\"];\nexport const HeightOnly = [\"height\"];\nexport const WidthOnly = [\"width\"];\n\nexport type measurements<T = string | number> = {\n  height?: T;\n  scrollHeight?: T;\n  scrollWidth?: T;\n  width?: T;\n};\ntype measuredDimension = keyof measurements<number>;\n\nexport type ResizeHandler = (measurements: measurements<number>) => void;\n\ntype observedDetails = {\n  onResize?: ResizeHandler;\n  measurements: measurements<number>;\n};\nconst observedMap = new WeakMap<HTMLElement, observedDetails>();\n\nconst getTargetSize = (\n  element: HTMLElement,\n  contentRect: DOMRectReadOnly,\n  dimension: measuredDimension\n): number => {\n  switch (dimension) {\n    case \"height\":\n      return contentRect.height;\n    case \"scrollHeight\":\n      return element.scrollHeight;\n    case \"scrollWidth\":\n      return element.scrollWidth;\n    case \"width\":\n      return contentRect.width;\n    default:\n      return 0;\n  }\n};\n\nexport const resizeObserver = new ResizeObserver(\n  (entries: ResizeObserverEntry[]) => {\n    for (const entry of entries) {\n      const { target, contentRect } = entry;\n      const observedTarget = observedMap.get(target as HTMLElement);\n      if (observedTarget) {\n        const { onResize, measurements } = observedTarget;\n        let sizeChanged = false;\n        for (const [dimension, size] of Object.entries(measurements)) {\n          const newSize = getTargetSize(\n            target as HTMLElement,\n            contentRect,\n            dimension as measuredDimension\n          );\n          if (newSize !== size) {\n            sizeChanged = true;\n            measurements[dimension as measuredDimension] = newSize;\n          }\n        }\n        if (sizeChanged) {\n          onResize && onResize(measurements);\n        }\n      }\n    }\n  }\n);\n\n// TODO use an optional lag (default to false) to ask to fire onResize\n// with initial size\n// Note asking for scrollHeight alone will not trigger onResize, this is only triggered by height,\n// with scrollHeight returned as an auxilliary value\nexport function useResizeObserver(\n  ref: RefObject<Element | HTMLElement | null>,\n  dimensions: string[],\n  onResize: ResizeHandler,\n  reportInitialSize = false\n): void {\n  const dimensionsRef = useRef(dimensions);\n  const measure = useCallback((target: HTMLElement): measurements<number> => {\n    const rect = target.getBoundingClientRect();\n    return dimensionsRef.current.reduce(\n      (map: { [key: string]: number }, dim) => {\n        map[dim] = getTargetSize(target, rect, dim as measuredDimension);\n        return map;\n      },\n      {}\n    );\n  }, []);\n\n  // TODO use ref to store resizeHandler here\n  // resize handler registered with REsizeObserver will never change\n  // use ref to store user onResize callback here\n  // resizeHandler will call user callback.current\n\n  // Keep this effect separate in case user inadvertently passes different\n  // dimensions or callback instance each time - we only ever want to\n  // initiate new observation when ref changes.\n  useLayoutEffect(() => {\n    const target = ref.current as HTMLElement;\n    let cleanedUp = false;\n\n    async function registerObserver() {\n      // Create the map entry immediately. useEffect may fire below\n      // before fonts are ready and attempt to update entry\n      observedMap.set(target, { measurements: {} as measurements<number> });\n      cleanedUp = false;\n      // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n      const { fonts } = document as any;\n      if (fonts) {\n        // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access\n        await fonts.ready;\n      }\n      if (!cleanedUp) {\n        const observedTarget = observedMap.get(target);\n        if (observedTarget) {\n          const measurements = measure(target);\n          observedTarget.measurements = measurements;\n          resizeObserver.observe(target);\n          if (reportInitialSize) {\n            onResize(measurements);\n          }\n        }\n      }\n    }\n\n    if (target) {\n      // TODO might we want multiple callers to attach a listener to the same element ?\n      if (observedMap.has(target)) {\n        throw Error(\n          \"useResizeObserver attemping to observe same element twice\"\n        );\n      }\n      void registerObserver();\n    }\n    return () => {\n      if (target && observedMap.has(target)) {\n        resizeObserver.unobserve(target);\n        observedMap.delete(target);\n        cleanedUp = true;\n      }\n    };\n  }, [ref, measure, reportInitialSize, onResize]);\n\n  useLayoutEffect(() => {\n    const target = ref.current as HTMLElement;\n    const record = observedMap.get(target);\n    if (record) {\n      if (dimensionsRef.current !== dimensions) {\n        dimensionsRef.current = dimensions;\n        const measurements = measure(target);\n        record.measurements = measurements;\n      }\n      // Might not have changed, but no harm ...\n      record.onResize = onResize;\n    }\n  }, [dimensions, measure, ref, onResize]);\n\n  // TODO might be a good idea to ref and return the current measurememnts. That way, derived hooks\n  // e.g useBreakpoints don't have to measure and client cn make onResize callback simpler\n}\n"],"names":["useRef","useCallback","useLayoutEffect"],"mappings":"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"}

package/cjs/responsive/utils.js

@@ -1,34 +0,0 @@
-'use strict';
-
-const COLLAPSIBLE = "data-collapsible";
-const RESPONSIVE_ATTRIBUTE = {
-  [COLLAPSIBLE]: true,
-  "data-pad-start": true,
-  "data-pad-end": true
-};
-const isResponsiveAttribute = (propName) => RESPONSIVE_ATTRIBUTE[propName] ?? false;
-const isCollapsible = (propName) => propName === COLLAPSIBLE;
-const COLLAPSIBLE_VALUE = {
-  dynamic: "dynamic",
-  instant: "instant",
-  true: "instant"
-};
-const collapsibleValue = (value) => COLLAPSIBLE_VALUE[value] ?? "none";
-const extractResponsiveProps = (props) => {
-  return Object.keys(props).reduce(
-    (result, propName) => {
-      const [toolbarProps, rest] = result;
-      if (isResponsiveAttribute(propName)) {
-        const value = isCollapsible(propName) ? collapsibleValue(props[propName]) : props[propName];
-        toolbarProps[propName] = value;
-        rest[propName] = void 0;
-      }
-      return result;
-    },
-    [{}, {}]
-  );
-};
-
-exports.extractResponsiveProps = extractResponsiveProps;
-exports.isResponsiveAttribute = isResponsiveAttribute;
-//# sourceMappingURL=utils.js.map

package/cjs/responsive/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","sources":["../../../../packages/vuu-layout/src/responsive/utils.ts"],"sourcesContent":["const COLLAPSIBLE = 'data-collapsible';\n\nconst RESPONSIVE_ATTRIBUTE: { [key: string]: boolean } = {\n  [COLLAPSIBLE]: true,\n  'data-pad-start': true,\n  'data-pad-end': true\n};\n\nexport const isResponsiveAttribute = (propName: string): boolean =>\n  RESPONSIVE_ATTRIBUTE[propName] ?? false;\n\nconst isCollapsible = (propName: string) => propName === COLLAPSIBLE;\n\nconst COLLAPSIBLE_VALUE: { [key: string]: string } = {\n  dynamic: 'dynamic',\n  instant: 'instant',\n  true: 'instant'\n};\n\nconst collapsibleValue = (value: string) => COLLAPSIBLE_VALUE[value] ?? 'none';\n\ntype Props = { [key: string]: any };\nexport const extractResponsiveProps = (props: Props) => {\n  return Object.keys(props).reduce<[Props, Props]>(\n    (result, propName) => {\n      const [toolbarProps, rest] = result;\n      if (isResponsiveAttribute(propName)) {\n        const value = isCollapsible(propName) ? collapsibleValue(props[propName]) : props[propName];\n\n        toolbarProps[propName] = value;\n        rest[propName] = undefined;\n      }\n      return result;\n    },\n    [{}, {}]\n  );\n};\n"],"names":[],"mappings":";;AAAA,MAAM,WAAc,GAAA,kBAAA;AAEpB,MAAM,oBAAmD,GAAA;AAAA,EACvD,CAAC,WAAW,GAAG,IAAA;AAAA,EACf,gBAAkB,EAAA,IAAA;AAAA,EAClB,cAAgB,EAAA;AAClB,CAAA;AAEO,MAAM,qBAAwB,GAAA,CAAC,QACpC,KAAA,oBAAA,CAAqB,QAAQ,CAAK,IAAA;AAEpC,MAAM,aAAA,GAAgB,CAAC,QAAA,KAAqB,QAAa,KAAA,WAAA;AAEzD,MAAM,iBAA+C,GAAA;AAAA,EACnD,OAAS,EAAA,SAAA;AAAA,EACT,OAAS,EAAA,SAAA;AAAA,EACT,IAAM,EAAA;AACR,CAAA;AAEA,MAAM,gBAAmB,GAAA,CAAC,KAAkB,KAAA,iBAAA,CAAkB,KAAK,CAAK,IAAA,MAAA;AAG3D,MAAA,sBAAA,GAAyB,CAAC,KAAiB,KAAA;AACtD,EAAO,OAAA,MAAA,CAAO,IAAK,CAAA,KAAK,CAAE,CAAA,MAAA;AAAA,IACxB,CAAC,QAAQ,QAAa,KAAA;AACpB,MAAM,MAAA,CAAC,YAAc,EAAA,IAAI,CAAI,GAAA,MAAA;AAC7B,MAAI,IAAA,qBAAA,CAAsB,QAAQ,CAAG,EAAA;AACnC,QAAM,MAAA,KAAA,GAAQ,aAAc,CAAA,QAAQ,CAAI,GAAA,gBAAA,CAAiB,MAAM,QAAQ,CAAC,CAAI,GAAA,KAAA,CAAM,QAAQ,CAAA;AAE1F,QAAA,YAAA,CAAa,QAAQ,CAAI,GAAA,KAAA;AACzB,QAAA,IAAA,CAAK,QAAQ,CAAI,GAAA,KAAA,CAAA;AAAA;AAEnB,MAAO,OAAA,MAAA;AAAA,KACT;AAAA,IACA,CAAC,EAAI,EAAA,EAAE;AAAA,GACT;AACF;;;;;"}

package/cjs/stack/Stack.css.js

@@ -1,6 +0,0 @@
-'use strict';
-
-var stackCss = ".vuuTabs {\n  display: flex;\n  box-sizing: border-box;\n  flex-direction: column;\n}\n\n.vuuTabs-horizontal {\n  --vuu-tabs-border-style: none solid none none;\n  flex-direction: row;\n}\n\n.vuuTabs .Toolbar:before {\n  left: 0;\n  width: 100%;\n  bottom: 0;\n  height: 1px;\n  content: '';\n  position: absolute;\n  background: var(--grey60);\n}\n\n.vuuTabs-tabPanel {\n  display: flex;\n  flex: 1; \n  flex-direction: column;\n}\n\n.vuuTabs-tabPanel > * {\n  flex: 1 1 auto;\n}\n\n.vuuTabHeader + .vuuView > .vuuHeader {\n  height: 0;\n  overflow: hidden;\n}\n\n.Layout-svg-button {\n  --spacing-medium: 5px;\n}\n";
-
-module.exports = stackCss;
-//# sourceMappingURL=Stack.css.js.map

package/cjs/stack/Stack.css.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stack.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/cjs/stack/Stack.js

@@ -1,150 +0,0 @@
-'use strict';
-
-var jsxRuntime = require('react/jsx-runtime');
-var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
-var vuuUtils = require('@vuu-ui/vuu-utils');
-var cx = require('clsx');
-var styles = require('@salt-ds/styles');
-var window = require('@salt-ds/window');
-var React = require('react');
-var layoutUtils = require('../layout-reducer/layoutUtils.js');
-var Stack$1 = require('./Stack.css.js');
-
-const classBase = "vuuTabs";
-const getDefaultTabIcon = () => void 0;
-const getChildElements = (children) => {
-  const elements = [];
-  React.Children.forEach(children, (child) => {
-    if (React.isValidElement(child)) {
-      elements.push(child);
-    } else {
-      console.warn(`Stack has unexpected child element type`);
-    }
-  });
-  return elements;
-};
-const DefaultTabstripProps = {
-  allowAddTab: false,
-  allowCloseTab: false,
-  allowRenameTab: false
-};
-const Stack = React.forwardRef(function Stack2({
-  TabstripProps: TabstripProps2 = DefaultTabstripProps,
-  active = 0,
-  children,
-  className: classNameProp,
-  getTabIcon = getDefaultTabIcon,
-  getTabLabel = layoutUtils.getDefaultTabLabel,
-  id: idProp,
-  keyBoardActivation = "manual",
-  // onMouseDown,
-  onAddTab,
-  onMoveTab,
-  onTabClose,
-  onTabEdit,
-  onTabSelectionChanged,
-  showTabs = "top",
-  style
-}, ref) {
-  const targetWindow = window.useWindow();
-  styles.useComponentCssInjection({
-    testId: "vuu-stack",
-    css: Stack$1,
-    window: targetWindow
-  });
-  const id = vuuUtils.useId(idProp);
-  const tabLabelsRef = React.useRef([]);
-  const {
-    allowCloseTab,
-    allowRenameTab,
-    className: tabstripClassName
-  } = TabstripProps2;
-  const handleExitEditMode = React.useCallback(
-    (_oldText, newText, _allowDeactivation, tabIndex) => {
-      onTabEdit?.(tabIndex, newText);
-    },
-    [onTabEdit]
-  );
-  const activeChild = () => {
-    if (React.isValidElement(children)) {
-      return children;
-    }
-    if (Array.isArray(children)) {
-      return children[active] ?? null;
-    }
-    return null;
-  };
-  tabLabelsRef.current.length = 0;
-  const renderTabs = () => getChildElements(children).map((child2, idx) => {
-    const {
-      closeable = allowCloseTab,
-      id: childId = `${id}-${idx}`,
-      "data-tab-location": tabLocation
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    } = child2.props;
-    const label = getTabLabel(child2, idx, tabLabelsRef.current);
-    tabLabelsRef.current.push(label);
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      vuuUiControls.Tab,
-      {
-        ariaControls: childId,
-        "data-icon": getTabIcon(child2, idx),
-        id: `${childId}-tab`,
-        index: idx,
-        label,
-        location: tabLocation,
-        closeable,
-        editable: allowRenameTab
-      },
-      childId
-    );
-  });
-  const child = activeChild();
-  const isHorizontal = showTabs === "left" || showTabs === "right";
-  const tabstripOrientation = isHorizontal ? "vertical" : "horizontal";
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      className: cx(classBase, classNameProp, {
-        [`${classBase}-horizontal`]: isHorizontal
-      }),
-      style,
-      id,
-      ref,
-      children: [
-        showTabs ? /* @__PURE__ */ jsxRuntime.jsx(
-          vuuUiControls.Tabstrip,
-          {
-            "aria-label": "data tabs",
-            ...TabstripProps2,
-            activeTabIndex: TabstripProps2?.activeTabIndex ?? (child === null ? -1 : active),
-            allowDragDrop: TabstripProps2.allowDragDrop !== false,
-            animateSelectionThumb: true,
-            className: cx("vuuTabHeader", tabstripClassName),
-            keyBoardActivation,
-            onActiveChange: onTabSelectionChanged,
-            onAddTab,
-            onCloseTab: onTabClose,
-            onExitEditMode: handleExitEditMode,
-            onMoveTab,
-            orientation: tabstripOrientation,
-            children: renderTabs()
-          }
-        ) : null,
-        /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            "aria-labelledby": `${id}-${active}`,
-            className: `${classBase}-tabPanel`,
-            role: "tabpanel",
-            children: child
-          }
-        )
-      ]
-    }
-  );
-});
-Stack.displayName = "Stack";
-
-exports.Stack = Stack;
-//# sourceMappingURL=Stack.js.map

package/cjs/stack/Stack.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Stack.js","sources":["../../../../packages/vuu-layout/src/stack/Stack.tsx"],"sourcesContent":["import { Tab, Tabstrip, TabstripProps } from \"@vuu-ui/vuu-ui-controls\";\nimport { useId } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport React, {\n  ForwardedRef,\n  forwardRef,\n  ReactElement,\n  ReactNode,\n  useCallback,\n  useRef,\n} from \"react\";\nimport { getDefaultTabLabel } from \"../layout-reducer\";\nimport { StackProps } from \"./stackTypes\";\n\nimport stackCss from \"./Stack.css\";\n\nconst classBase = \"vuuTabs\";\n\nconst getDefaultTabIcon = () => undefined;\n\nconst getChildElements = <T extends ReactElement = ReactElement>(\n  children: ReactNode,\n): T[] => {\n  const elements: T[] = [];\n  React.Children.forEach(children, (child) => {\n    if (React.isValidElement(child)) {\n      elements.push(child as T);\n    } else {\n      console.warn(`Stack has unexpected child element type`);\n    }\n  });\n  return elements;\n};\n\nconst DefaultTabstripProps: Partial<TabstripProps> = {\n  allowAddTab: false,\n  allowCloseTab: false,\n  allowRenameTab: false,\n};\n\nexport const Stack = forwardRef(function Stack(\n  {\n    TabstripProps = DefaultTabstripProps,\n    active = 0,\n    children,\n    className: classNameProp,\n    getTabIcon = getDefaultTabIcon,\n    getTabLabel = getDefaultTabLabel,\n    id: idProp,\n    keyBoardActivation = \"manual\",\n    // onMouseDown,\n    onAddTab,\n    onMoveTab,\n    onTabClose,\n    onTabEdit,\n    onTabSelectionChanged,\n    showTabs = \"top\",\n    style,\n  }: StackProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-stack\",\n    css: stackCss,\n    window: targetWindow,\n  });\n\n  const id = useId(idProp);\n  const tabLabelsRef = useRef<string[]>([]);\n  const {\n    allowCloseTab,\n    allowRenameTab,\n    className: tabstripClassName,\n  } = TabstripProps;\n\n  const handleExitEditMode = useCallback(\n    (\n      _oldText: string,\n      newText: string,\n      _allowDeactivation: boolean,\n      tabIndex: number,\n    ) => {\n      onTabEdit?.(tabIndex, newText);\n    },\n    [onTabEdit],\n  );\n\n  const activeChild = () => {\n    //TODO need to inject an id if child does not have one, so we can\n    // establish the aria-controls relationship. In a Vuu layout, there\n    // will always be an id.\n    if (React.isValidElement(children)) {\n      return children;\n    }\n    if (Array.isArray(children)) {\n      return children[active] ?? null;\n    }\n    return null;\n  };\n\n  // The list of existing Tab Labels is required only when assigning a default label\n  // to a new Tab. We rebuild on each render\n  tabLabelsRef.current.length = 0;\n\n  const renderTabs = () =>\n    getChildElements(children).map((child, idx) => {\n      const {\n        closeable = allowCloseTab,\n        id: childId = `${id}-${idx}`,\n        \"data-tab-location\": tabLocation,\n        // eslint-disable-next-line @typescript-eslint/no-explicit-any\n      } = child.props as any;\n      const label = getTabLabel(child, idx, tabLabelsRef.current);\n      tabLabelsRef.current.push(label);\n      return (\n        <Tab\n          ariaControls={childId}\n          data-icon={getTabIcon(child, idx)}\n          key={childId}\n          id={`${childId}-tab`}\n          index={idx}\n          label={label}\n          location={tabLocation}\n          closeable={closeable}\n          editable={allowRenameTab}\n        />\n      );\n    });\n\n  const child = activeChild();\n  const isHorizontal = showTabs === \"left\" || showTabs === \"right\";\n  const tabstripOrientation = isHorizontal ? \"vertical\" : \"horizontal\";\n\n  return (\n    <div\n      className={cx(classBase, classNameProp, {\n        [`${classBase}-horizontal`]: isHorizontal,\n      })}\n      style={style}\n      id={id}\n      ref={ref}\n    >\n      {showTabs ? (\n        <Tabstrip\n          aria-label=\"data tabs\"\n          {...TabstripProps}\n          activeTabIndex={\n            TabstripProps?.activeTabIndex ?? (child === null ? -1 : active)\n          }\n          allowDragDrop={TabstripProps.allowDragDrop !== false}\n          animateSelectionThumb\n          className={cx(\"vuuTabHeader\", tabstripClassName)}\n          keyBoardActivation={keyBoardActivation}\n          onActiveChange={onTabSelectionChanged}\n          onAddTab={onAddTab}\n          onCloseTab={onTabClose}\n          onExitEditMode={handleExitEditMode}\n          onMoveTab={onMoveTab}\n          orientation={tabstripOrientation}\n        >\n          {renderTabs()}\n        </Tabstrip>\n      ) : null}\n      <div\n        aria-labelledby={`${id}-${active}`}\n        className={`${classBase}-tabPanel`}\n        role=\"tabpanel\"\n      >\n        {child}\n      </div>\n    </div>\n  );\n});\nStack.displayName = \"Stack\";\n"],"names":["forwardRef","Stack","TabstripProps","getDefaultTabLabel","useWindow","useComponentCssInjection","stackCss","useId","useRef","useCallback","child","jsx","Tab","jsxs","Tabstrip"],"mappings":"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"}