@vuu-ui/vuu-layout 0.8.34 → 0.8.35

package/esm/layout-view/useViewResize.js

@@ -1,40 +0,0 @@
-import { useRef, useCallback } from 'react';
-import { useResizeObserver, WidthHeight } from '../responsive/useResizeObserver.js';
-
-const NO_MEASUREMENT = [];
-const useViewResize = ({
-  mainRef,
-  resize = "responsive",
-  rootRef
-}) => {
-  const deferResize = resize === "defer";
-  const mainSize = useRef({});
-  const resizeHandle = useRef();
-  const setMainSize = useCallback(() => {
-    if (mainRef.current) {
-      mainRef.current.style.height = mainSize.current.height + "px";
-      mainRef.current.style.width = mainSize.current.width + "px";
-    }
-    resizeHandle.current = void 0;
-  }, [mainRef]);
-  const onResize = useCallback(
-    ({ height, width }) => {
-      mainSize.current.height = height;
-      mainSize.current.width = width;
-      if (resizeHandle.current !== null) {
-        clearTimeout(resizeHandle.current);
-      }
-      resizeHandle.current = window.setTimeout(setMainSize, 40);
-    },
-    [setMainSize]
-  );
-  useResizeObserver(
-    rootRef,
-    deferResize ? WidthHeight : NO_MEASUREMENT,
-    onResize,
-    deferResize
-  );
-};
-
-export { useViewResize };
-//# sourceMappingURL=useViewResize.js.map

package/esm/layout-view/useViewResize.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useViewResize.js","sources":["../../src/layout-view/useViewResize.ts"],"sourcesContent":["import { useResizeObserver, WidthHeight } from \"../responsive\";\nimport { RefObject, useCallback, useRef } from \"react\";\n\nconst NO_MEASUREMENT: string[] = [];\n\ntype size = {\n  height?: number;\n  width?: number;\n};\n\nexport interface ViewResizeHookProps {\n  mainRef: RefObject<HTMLDivElement>;\n  resize?: \"defer\" | \"responsive\";\n  rootRef: RefObject<HTMLDivElement>;\n}\n\nexport const useViewResize = ({\n  mainRef,\n  resize = \"responsive\",\n  rootRef,\n}: ViewResizeHookProps) => {\n  const deferResize = resize === \"defer\";\n\n  const mainSize = useRef<size>({});\n  const resizeHandle = useRef<number>();\n\n  const setMainSize = useCallback(() => {\n    if (mainRef.current) {\n      mainRef.current.style.height = mainSize.current.height + \"px\";\n      mainRef.current.style.width = mainSize.current.width + \"px\";\n    }\n    resizeHandle.current = undefined;\n  }, [mainRef]);\n\n  const onResize = useCallback(\n    ({ height, width }) => {\n      mainSize.current.height = height;\n      mainSize.current.width = width;\n      if (resizeHandle.current !== null) {\n        clearTimeout(resizeHandle.current);\n      }\n      resizeHandle.current = window.setTimeout(setMainSize, 40);\n    },\n    [setMainSize]\n  );\n\n  useResizeObserver(\n    rootRef,\n    deferResize ? WidthHeight : NO_MEASUREMENT,\n    onResize,\n    deferResize\n  );\n};\n"],"names":[],"mappings":";;;AAGA,MAAM,iBAA2B,EAAC,CAAA;AAa3B,MAAM,gBAAgB,CAAC;AAAA,EAC5B,OAAA;AAAA,EACA,MAAS,GAAA,YAAA;AAAA,EACT,OAAA;AACF,CAA2B,KAAA;AACzB,EAAA,MAAM,cAAc,MAAW,KAAA,OAAA,CAAA;AAE/B,EAAM,MAAA,QAAA,GAAW,MAAa,CAAA,EAAE,CAAA,CAAA;AAChC,EAAA,MAAM,eAAe,MAAe,EAAA,CAAA;AAEpC,EAAM,MAAA,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,IAAI,QAAQ,OAAS,EAAA;AACnB,MAAA,OAAA,CAAQ,OAAQ,CAAA,KAAA,CAAM,MAAS,GAAA,QAAA,CAAS,QAAQ,MAAS,GAAA,IAAA,CAAA;AACzD,MAAA,OAAA,CAAQ,OAAQ,CAAA,KAAA,CAAM,KAAQ,GAAA,QAAA,CAAS,QAAQ,KAAQ,GAAA,IAAA,CAAA;AAAA,KACzD;AACA,IAAA,YAAA,CAAa,OAAU,GAAA,KAAA,CAAA,CAAA;AAAA,GACzB,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AAEZ,EAAA,MAAM,QAAW,GAAA,WAAA;AAAA,IACf,CAAC,EAAE,MAAQ,EAAA,KAAA,EAAY,KAAA;AACrB,MAAA,QAAA,CAAS,QAAQ,MAAS,GAAA,MAAA,CAAA;AAC1B,MAAA,QAAA,CAAS,QAAQ,KAAQ,GAAA,KAAA,CAAA;AACzB,MAAI,IAAA,YAAA,CAAa,YAAY,IAAM,EAAA;AACjC,QAAA,YAAA,CAAa,aAAa,OAAO,CAAA,CAAA;AAAA,OACnC;AACA,MAAA,YAAA,CAAa,OAAU,GAAA,MAAA,CAAO,UAAW,CAAA,WAAA,EAAa,EAAE,CAAA,CAAA;AAAA,KAC1D;AAAA,IACA,CAAC,WAAW,CAAA;AAAA,GACd,CAAA;AAEA,EAAA,iBAAA;AAAA,IACE,OAAA;AAAA,IACA,cAAc,WAAc,GAAA,cAAA;AAAA,IAC5B,QAAA;AAAA,IACA,WAAA;AAAA,GACF,CAAA;AACF;;;;"}

package/esm/layout-view-actions/ViewContext.js

@@ -1,12 +0,0 @@
-import React, { useContext } from 'react';
-
-const NO_CONTEXT = { dispatch: null };
-const ViewContext = React.createContext(NO_CONTEXT);
-const useViewDispatch = () => {
-  const context = useContext(ViewContext);
-  return context?.dispatch ?? null;
-};
-const useViewContext = () => useContext(ViewContext);
-
-export { ViewContext, useViewContext, useViewDispatch };
-//# sourceMappingURL=ViewContext.js.map

package/esm/layout-view-actions/ViewContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ViewContext.js","sources":["../../src/layout-view-actions/ViewContext.ts"],"sourcesContent":["import React, { SyntheticEvent, useContext } from \"react\";\nimport { ViewAction } from \"../layout-view/viewTypes\";\n\nexport type QueryReponse = { [key: string]: unknown };\n\nexport type ViewDispatch = <Action extends ViewAction = ViewAction>(\n  action: Action,\n  evt?: SyntheticEvent\n) => Promise<boolean | QueryReponse | void>;\n\n/**\n * This API is available to any Feature hosted within Vuu (as all Features are wrapped\n * with View component). It offers metadata about the View as well as access to the\n * Vuu persistencew API;\n */\nexport interface ViewContextAPI {\n  /**\n   * dispatcher for View actions. These are a subset of LayoutActions, specifically for\n   * View manipulation\n   */\n  dispatch?: ViewDispatch | null;\n  id?: string;\n  load?: (key?: string) => unknown;\n  loadSession?: (key?: string) => unknown;\n  onConfigChange?: (config: unknown) => void;\n  path?: string;\n  purge?: (key: string) => void;\n  save?: (state: unknown, key: string) => void;\n  saveSession?: (state: unknown, key: string) => void;\n  setComponentProps: (props: { [key: string]: unknown }) => void;\n  title?: string;\n}\n\nconst NO_CONTEXT = { dispatch: null } as ViewContextAPI;\nexport const ViewContext = React.createContext<ViewContextAPI>(NO_CONTEXT);\n\nexport const useViewDispatch = () => {\n  const context = useContext(ViewContext);\n  return context?.dispatch ?? null;\n};\n\nexport const useViewContext = () => useContext(ViewContext);\n"],"names":[],"mappings":";;AAiCA,MAAM,UAAA,GAAa,EAAE,QAAA,EAAU,IAAK,EAAA,CAAA;AACvB,MAAA,WAAA,GAAc,KAAM,CAAA,aAAA,CAA8B,UAAU,EAAA;AAElE,MAAM,kBAAkB,MAAM;AACnC,EAAM,MAAA,OAAA,GAAU,WAAW,WAAW,CAAA,CAAA;AACtC,EAAA,OAAO,SAAS,QAAY,IAAA,IAAA,CAAA;AAC9B,EAAA;AAEa,MAAA,cAAA,GAAiB,MAAM,UAAA,CAAW,WAAW;;;;"}

package/esm/layout-view-actions/useViewActionDispatcher.js

@@ -1,101 +0,0 @@
-import { useState, useCallback } from 'react';
-import { useLayoutProviderDispatch } from '../layout-provider/LayoutProvider.js';
-import '../layout-provider/LayoutProviderContext.js';
-import { usePersistentState } from '../use-persistent-state.js';
-
-const useViewActionDispatcher = (id, root, viewPath, dropTargets) => {
-  const { loadSessionState, purgeSessionState, purgeState, saveSessionState } = usePersistentState();
-  const [contributions, setContributions] = useState(
-    loadSessionState(id, "contributions") ?? []
-  );
-  const dispatchLayoutAction = useLayoutProviderDispatch();
-  const updateContributions = useCallback(
-    (location, content) => {
-      const updatedContributions = contributions.concat([
-        { location, content }
-      ]);
-      saveSessionState(id, "contributions", updatedContributions);
-      setContributions(updatedContributions);
-    },
-    [contributions, id, saveSessionState]
-  );
-  const clearContributions = useCallback(() => {
-    purgeSessionState(id, "contributions");
-    setContributions([]);
-  }, [id, purgeSessionState]);
-  const handleRemove = useCallback(() => {
-    const ds = loadSessionState(id, "data-source");
-    if (ds) {
-      ds.unsubscribe();
-    }
-    purgeSessionState(id);
-    purgeState(id);
-    dispatchLayoutAction({ type: "remove", path: viewPath });
-  }, [
-    dispatchLayoutAction,
-    id,
-    loadSessionState,
-    purgeSessionState,
-    purgeState,
-    viewPath
-  ]);
-  const handleMouseDown = useCallback(
-    async (evt, index, preDragActivity) => {
-      evt.stopPropagation();
-      const dragRect = root.current?.getBoundingClientRect();
-      return new Promise((resolve, reject) => {
-        dispatchLayoutAction({
-          type: "drag-start",
-          evt,
-          path: index === void 0 ? viewPath : `${viewPath}.${index}`,
-          dragRect,
-          preDragActivity,
-          dropTargets,
-          resolveDragStart: resolve,
-          rejectDragStart: reject
-        });
-      });
-    },
-    [root, dispatchLayoutAction, viewPath, dropTargets]
-  );
-  const dispatchAction = useCallback(
-    async (action, evt) => {
-      const { type } = action;
-      switch (type) {
-        case "maximize":
-        case "minimize":
-        case "restore":
-          return dispatchLayoutAction({ type, path: action.path ?? viewPath });
-        case "remove":
-          return handleRemove();
-        case "mousedown":
-          return handleMouseDown(evt, action.index, action.preDragActivity);
-        case "add-toolbar-contribution":
-          return updateContributions(action.location, action.content);
-        case "remove-toolbar-contribution":
-          return clearContributions();
-        case "query":
-          return dispatchLayoutAction({
-            type,
-            path: action.path,
-            query: action.query
-          });
-        default: {
-          return void 0;
-        }
-      }
-    },
-    [
-      dispatchLayoutAction,
-      viewPath,
-      handleRemove,
-      handleMouseDown,
-      updateContributions,
-      clearContributions
-    ]
-  );
-  return [dispatchAction, contributions];
-};
-
-export { useViewActionDispatcher };
-//# sourceMappingURL=useViewActionDispatcher.js.map

package/esm/layout-view-actions/useViewActionDispatcher.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"useViewActionDispatcher.js","sources":["../../src/layout-view-actions/useViewActionDispatcher.ts"],"sourcesContent":["import { DataSource } from \"@vuu-ui/vuu-data-types\";\nimport {\n  ReactElement,\n  RefObject,\n  SyntheticEvent,\n  useCallback,\n  useState,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { DragStartAction } from \"../layout-reducer\";\nimport { usePersistentState } from \"../use-persistent-state\";\nimport { QueryReponse, ViewDispatch } from \"./ViewContext\";\nimport { ViewAction } from \"../layout-view/viewTypes\";\n\nexport type ContributionLocation = \"post-title\" | \"pre-title\";\n\nexport type Contribution = {\n  index?: number;\n  location?: ContributionLocation;\n  content: ReactElement;\n};\n\nexport const useViewActionDispatcher = (\n  id: string,\n  root: RefObject<HTMLDivElement>,\n  viewPath?: string,\n  dropTargets?: string[]\n): [ViewDispatch, Contribution[] | undefined] => {\n  const { loadSessionState, purgeSessionState, purgeState, saveSessionState } =\n    usePersistentState();\n\n  const [contributions, setContributions] = useState<Contribution[]>(\n    loadSessionState(id, \"contributions\") ?? []\n  );\n  const dispatchLayoutAction = useLayoutProviderDispatch();\n  const updateContributions = useCallback(\n    (location: ContributionLocation, content: ReactElement) => {\n      const updatedContributions = contributions.concat([\n        { location, content },\n      ]);\n      saveSessionState(id, \"contributions\", updatedContributions);\n      setContributions(updatedContributions);\n    },\n    [contributions, id, saveSessionState]\n  );\n\n  const clearContributions = useCallback(() => {\n    purgeSessionState(id, \"contributions\");\n    setContributions([]);\n  }, [id, purgeSessionState]);\n\n  const handleRemove = useCallback(() => {\n    const ds = loadSessionState(id, \"data-source\") as DataSource;\n    if (ds) {\n      ds.unsubscribe();\n    }\n    purgeSessionState(id);\n    purgeState(id);\n    dispatchLayoutAction({ type: \"remove\", path: viewPath });\n  }, [\n    dispatchLayoutAction,\n    id,\n    loadSessionState,\n    purgeSessionState,\n    purgeState,\n    viewPath,\n  ]);\n\n  const handleMouseDown = useCallback(\n    async (evt, index, preDragActivity): Promise<boolean> => {\n      evt.stopPropagation();\n      const dragRect = root.current?.getBoundingClientRect();\n      return new Promise((resolve, reject) => {\n        dispatchLayoutAction({\n          type: \"drag-start\",\n          evt,\n          path: index === undefined ? viewPath : `${viewPath}.${index}`,\n          dragRect,\n          preDragActivity,\n          dropTargets,\n          resolveDragStart: resolve,\n          rejectDragStart: reject,\n        } as DragStartAction);\n      });\n    },\n    [root, dispatchLayoutAction, viewPath, dropTargets]\n  );\n\n  const dispatchAction = useCallback(\n    async <A extends ViewAction = ViewAction>(\n      action: A,\n      evt?: SyntheticEvent\n    ): Promise<boolean | QueryReponse | void> => {\n      const { type } = action;\n      switch (type) {\n        case \"maximize\":\n        case \"minimize\":\n        case \"restore\":\n          return dispatchLayoutAction({ type, path: action.path ?? viewPath });\n        case \"remove\":\n          return handleRemove();\n        case \"mousedown\":\n          return handleMouseDown(evt, action.index, action.preDragActivity);\n        case \"add-toolbar-contribution\":\n          return updateContributions(action.location, action.content);\n        case \"remove-toolbar-contribution\":\n          return clearContributions();\n        case \"query\":\n          return dispatchLayoutAction({\n            type,\n            path: action.path,\n            query: action.query,\n          });\n          return;\n        default: {\n          return undefined;\n        }\n      }\n    },\n    [\n      dispatchLayoutAction,\n      viewPath,\n      handleRemove,\n      handleMouseDown,\n      updateContributions,\n      clearContributions,\n    ]\n  );\n\n  return [dispatchAction, contributions];\n};\n"],"names":[],"mappings":"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"}

package/esm/palette/Palette.css

@@ -1,33 +0,0 @@
-.vuuPalette {
-  --vuuList-borderStyle: none;
-}
-
-.vuuPalette-horizontal {
-  align-items: center;
-  display: flex;
-}
-
-.vuuPaletteItem {
-  --vuu-icon-color: var(--salt-content-primary-foreground);
-  --vuu-icon-left: 0;
-  --vuu-icon-size: 16px;
-  --vuu-icon-top: 11px;
-  --list-item-text-padding: 0 0 0 calc(var(--salt-size-unit) * 3);
-  border-bottom: solid 1px var(--salt-separable-tertiary-borderColor);
-  padding-left: 12px;
-  font-size: 12px;
-  font-weight: 600;
-}
-
-.vuuSimpleDraggableWrapper > .vuuPaletteItem {
-  --vuu-icon-color: var(--salt-selectable-foreground);
-
-}
-
-.salt-theme .vuuPaletteItem {
-  font-size: 11px;
-  font-weight: normal;
-
-}
-
-

package/esm/palette/Palette.js

@@ -1,115 +0,0 @@
-import { jsx } from 'react/jsx-runtime';
-import { uuid } from '@vuu-ui/vuu-utils';
-import { ListItem, List } from '@vuu-ui/vuu-ui-controls';
-import cx from 'clsx';
-import { memo, cloneElement } from 'react';
-import { useLayoutProviderDispatch } from '../layout-provider/LayoutProvider.js';
-import '../layout-provider/LayoutProviderContext.js';
-import { View as MemoView } from '../layout-view/View.js';
-import { registerComponent } from '../registry/ComponentRegistry.js';
-
-const clonePaletteItem = (paletteItem) => {
-  const dolly = paletteItem.cloneNode(true);
-  dolly.id = "";
-  delete dolly.dataset.idx;
-  return dolly;
-};
-const PaletteItem = memo(
-  ({
-    className,
-    children: component,
-    idx,
-    resizeable,
-    header,
-    closeable,
-    ...props
-  }) => {
-    return /* @__PURE__ */ jsx(
-      ListItem,
-      {
-        className: cx("vuuPaletteItem", className),
-        "data-draggable": true,
-        "data-icon": "draggable",
-        ...props
-      }
-    );
-  }
-);
-PaletteItem.displayName = "PaletteItem";
-const Palette = ({
-  ListProps: ListProps2,
-  ViewProps: ViewProps2,
-  children,
-  className,
-  itemHeight = 41,
-  orientation = "horizontal",
-  ...props
-}) => {
-  const dispatch = useLayoutProviderDispatch();
-  const classBase = "vuuPalette";
-  function handleMouseDown(evt) {
-    const target = evt.target;
-    const listItemElement = target.closest(".vuuPaletteItem");
-    const idx = parseInt(listItemElement.dataset?.index ?? "-1");
-    const {
-      props: { caption, children: payload, template, ...props2 }
-    } = children[idx];
-    const { ViewProps: componentViewProps } = payload.props;
-    const { height, left, top, width } = listItemElement.getBoundingClientRect();
-    const id = uuid();
-    const identifiers = { id, key: id };
-    const component = template ? payload : /* @__PURE__ */ jsx(
-      MemoView,
-      {
-        ...ViewProps2,
-        ...identifiers,
-        ...props2,
-        ...componentViewProps,
-        title: props2.label,
-        children: payload
-      }
-    );
-    dispatch({
-      dragRect: {
-        left,
-        top,
-        right: left + width,
-        bottom: top + 150,
-        width,
-        height
-      },
-      dragElement: clonePaletteItem(listItemElement),
-      evt: evt.nativeEvent,
-      instructions: {
-        DoNotRemove: true,
-        DoNotTransform: true,
-        DriftHomeIfNoDropTarget: true,
-        RemoveDraggableOnDragEnd: true,
-        dragThreshold: 10
-      },
-      path: "*",
-      payload: component,
-      type: "drag-start"
-    });
-  }
-  return /* @__PURE__ */ jsx(
-    List,
-    {
-      ...ListProps2,
-      ...props,
-      className: cx(classBase, className, `${classBase}-${orientation}`),
-      itemHeight,
-      selected: null,
-      children: children.map(
-        (child, idx) => child.type === PaletteItem ? cloneElement(child, {
-          key: idx,
-          onMouseDown: handleMouseDown
-        }) : child
-      )
-    }
-  );
-};
-registerComponent("Palette", Palette, "view");
-
-export { Palette, PaletteItem };
-//# sourceMappingURL=Palette.js.map

package/esm/palette/Palette.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Palette.js","sources":["../../src/palette/Palette.tsx"],"sourcesContent":["import { uuid } from \"@vuu-ui/vuu-utils\";\nimport {\n  List,\n  ListItem,\n  ListItemProps,\n  ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport cx from \"clsx\";\nimport {\n  cloneElement,\n  HTMLAttributes,\n  memo,\n  MouseEvent,\n  ReactElement,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View, ViewProps } from \"../layout-view\";\nimport { registerComponent } from \"../registry/ComponentRegistry\";\n\nimport \"./Palette.css\";\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\nexport interface PaletteItemProps extends ListItemProps {\n  children: ReactElement;\n  closeable?: boolean;\n  header?: boolean;\n  idx?: number;\n  resize?: \"defer\";\n  resizeable?: boolean;\n}\n\nexport const PaletteItem = memo(\n  ({\n    className,\n    children: component,\n    idx,\n    resizeable,\n    header,\n    closeable,\n    ...props\n  }: PaletteItemProps) => {\n    return (\n      <ListItem\n        className={cx(\"vuuPaletteItem\", className)}\n        data-draggable\n        data-icon=\"draggable\"\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  ListProps?: Partial<ListProps>;\n  ViewProps?: Partial<ViewProps>;\n  children: ReactElement[];\n  itemHeight?: number;\n  orientation: \"horizontal\" | \"vertical\";\n  selection?: string;\n}\n\nexport const Palette = ({\n  ListProps,\n  ViewProps,\n  children,\n  className,\n  itemHeight = 41,\n  orientation = \"horizontal\",\n  ...props\n}: PaletteProps) => {\n  const dispatch = useLayoutProviderDispatch();\n  const classBase = \"vuuPalette\";\n\n  function handleMouseDown(evt: MouseEvent) {\n    const target = evt.target as HTMLElement;\n    const listItemElement = target.closest(\".vuuPaletteItem\") as HTMLElement;\n    const idx = parseInt(listItemElement.dataset?.index ?? \"-1\");\n    const {\n      props: { caption, children: payload, template, ...props },\n    } = children[idx];\n    const { ViewProps: componentViewProps } = payload.props;\n    const { height, left, top, width } =\n      listItemElement.getBoundingClientRect();\n    const id = uuid();\n    const identifiers = { id, key: id };\n    const component = template ? (\n      payload\n    ) : (\n      <View\n        {...ViewProps}\n        {...identifiers}\n        {...props}\n        {...componentViewProps}\n        title={props.label}\n      >\n        {payload}\n      </View>\n    );\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(listItemElement),\n      evt: evt.nativeEvent,\n      instructions: {\n        DoNotRemove: true,\n        DoNotTransform: true,\n        DriftHomeIfNoDropTarget: true,\n        RemoveDraggableOnDragEnd: true,\n        dragThreshold: 10,\n      },\n      path: \"*\",\n      payload: component,\n      type: \"drag-start\",\n    });\n  }\n\n  return (\n    <List\n      {...ListProps}\n      {...props}\n      className={cx(classBase, className, `${classBase}-${orientation}`)}\n      itemHeight={itemHeight}\n      selected={null}\n    >\n      {children.map((child, idx) =>\n        child.type === PaletteItem\n          ? cloneElement(child, {\n              key: idx,\n              onMouseDown: handleMouseDown,\n            })\n          : child\n      )}\n    </List>\n  );\n};\n\nregisterComponent(\"Palette\", Palette, \"view\");\n"],"names":["ListProps","ViewProps","props","View"],"mappings":"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"}

package/esm/placeholder/LayoutStartPanel.css

@@ -1,30 +0,0 @@
-.vuuLayoutStartPanel {
-    align-items: center;
-    flex: 0 0 auto !important;
-    display: flex;
-    flex-direction: column;
-    font-weight: 700;
-    gap: 12px;
-}
-
-.vuuLayoutStartPanel-title {
-    color: var(--vuu-color-gray-80);
-    font-size: 28px;
-    line-height: 1.5;
-    text-align: center;
-}
-
-.vuuLayoutStartPanel-text {
-    color: var(--vuu-color-gray-50);
-    font-size: 18px;
-    line-height: 1.5;
-    max-width: 460px;
-}
-
-.vuuLayoutStartPanel-addButton {
-    --vuu-icon-size: 20px;
-    --saltButton-borderRadius: 28px !important;
-    --saltButton-height: 56px;
-    --saltButton-width: 56px;
-    box-shadow: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
-}

package/esm/placeholder/LayoutStartPanel.js

@@ -1,49 +0,0 @@
-import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
-import { Button } from '@salt-ds/core';
-import { useState, useMemo } from 'react';
-import '@vuu-ui/vuu-utils';
-import '../layout-provider/LayoutProviderContext.js';
-import '../drag-drop/Draggable.js';
-import 'clsx';
-import '../drag-drop/BoxModel.js';
-import { useViewContext } from '../layout-view-actions/ViewContext.js';
-
-const classBase = "vuuLayoutStartPanel";
-const LayoutStartPanel = (htmlAttributes) => {
-  const { dispatch, path } = useViewContext();
-  const [displayState, setDisplayState] = useState();
-  useMemo(() => {
-    dispatch?.({
-      type: "query",
-      path,
-      query: "PARENT_CONTAINER"
-    }).then((response) => {
-      if (response?.parentContainerId === "main-tabs") {
-        setDisplayState("initial");
-      } else {
-        setDisplayState("nested");
-      }
-    });
-  }, [dispatch, path]);
-  if (displayState === void 0) {
-    return null;
-  }
-  const showInitialState = displayState === "initial";
-  return /* @__PURE__ */ jsxs("div", { ...htmlAttributes, className: classBase, children: [
-    showInitialState ? /* @__PURE__ */ jsxs(Fragment, { children: [
-      /* @__PURE__ */ jsx("header", { className: `${classBase}-title`, children: "Start by adding a table" }),
-      /* @__PURE__ */ 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__ */ jsx(
-      Button,
-      {
-        className: `${classBase}-addButton`,
-        "data-icon": "add",
-        variant: "cta"
-      }
-    )
-  ] });
-};
-
-export { LayoutStartPanel };
-//# sourceMappingURL=LayoutStartPanel.js.map

package/esm/placeholder/LayoutStartPanel.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"LayoutStartPanel.js","sources":["../../src/placeholder/LayoutStartPanel.tsx"],"sourcesContent":["import { Button } from \"@salt-ds/core\";\nimport { HTMLAttributes, useMemo, useState } from \"react\";\nimport { useViewContext, QueryReponse } from \"../layout-view-actions\";\n\nimport \"./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 { 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 ((response as QueryReponse)?.parentContainerId === \"main-tabs\") {\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          <header className={`${classBase}-title`}>\n            Start by adding a table\n          </header>\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      <Button\n        className={`${classBase}-addButton`}\n        data-icon=\"add\"\n        variant=\"cta\"\n      />\n    </div>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAMA,MAAM,SAAY,GAAA,qBAAA,CAAA;AAML,MAAA,gBAAA,GAAmB,CAAC,cAA0C,KAAA;AACzE,EAAA,MAAM,EAAE,QAAA,EAAU,IAAK,EAAA,GAAI,cAAe,EAAA,CAAA;AAC1C,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,QAEtC,EAAA,CAAA;AAEF,EAAA,OAAA,CAAQ,MAAM;AACZ,IAAW,QAAA,GAAA;AAAA,MACT,IAAM,EAAA,OAAA;AAAA,MACN,IAAA;AAAA,MACA,KAAO,EAAA,kBAAA;AAAA,KACR,CAAA,CAAE,IAAK,CAAA,CAAC,QAAa,KAAA;AACpB,MAAK,IAAA,QAAA,EAA2B,sBAAsB,WAAa,EAAA;AACjE,QAAA,eAAA,CAAgB,SAAS,CAAA,CAAA;AAAA,OACpB,MAAA;AACL,QAAA,eAAA,CAAgB,QAAQ,CAAA,CAAA;AAAA,OAC1B;AAAA,KACD,CAAA,CAAA;AAAA,GACA,EAAA,CAAC,QAAU,EAAA,IAAI,CAAC,CAAA,CAAA;AAEnB,EAAA,IAAI,iBAAiB,KAAW,CAAA,EAAA;AAC9B,IAAO,OAAA,IAAA,CAAA;AAAA,GACT;AAEA,EAAA,MAAM,mBAAmB,YAAiB,KAAA,SAAA,CAAA;AAE1C,EAAA,uBACG,IAAA,CAAA,KAAA,EAAA,EAAK,GAAG,cAAA,EAAgB,WAAW,SACjC,EAAA,QAAA,EAAA;AAAA,IAAA,gBAAA,mBAEG,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA,CAAC,QAAO,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,UAAU,QAEzC,EAAA,yBAAA,EAAA,CAAA;AAAA,0BACC,KAAI,EAAA,EAAA,SAAA,EAAW,CAAG,EAAA,SAAS,SAAS,QAGrC,EAAA,mFAAA,EAAA,CAAA;AAAA,KAAA,EACF,CACE,GAAA,IAAA;AAAA,oBACJ,GAAA;AAAA,MAAC,MAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,GAAG,SAAS,CAAA,UAAA,CAAA;AAAA,QACvB,WAAU,EAAA,KAAA;AAAA,QACV,OAAQ,EAAA,KAAA;AAAA,OAAA;AAAA,KACV;AAAA,GACF,EAAA,CAAA,CAAA;AAEJ;;;;"}

package/esm/placeholder/Placeholder.css

@@ -1,17 +0,0 @@
-.vuuPlaceholder {
-  --vuuView-justify: center;
-  align-items: center;
-  display: flex;
-  flex-basis: 0;
-  flex-grow: 1;
-  flex-shrink: 1;
-}
-
-.vuuPlaceholder-nested {
-  background-color: red;
-}
-
-.vuuPlaceholder-shim {
-  flex-grow: 0;
-  flex-shrink: 0;
-}

package/esm/placeholder/Placeholder.js

@@ -1,23 +0,0 @@
-import { jsx, Fragment } from 'react/jsx-runtime';
-import cx from 'clsx';
-import { registerComponent } from '../registry/ComponentRegistry.js';
-import { LayoutStartPanel } from './LayoutStartPanel.js';
-import { View as MemoView } from '../layout-view/View.js';
-
-const classBase = "vuuPlaceholder";
-const PlaceholderCore = ({ showStartMenu = true }) => {
-  return /* @__PURE__ */ jsx(Fragment, { children: showStartMenu ? /* @__PURE__ */ jsx(LayoutStartPanel, {}) : null });
-};
-const Placeholder = ({
-  className: classNameProp,
-  showStartMenu,
-  ...viewProps
-}) => {
-  const className = cx(classBase, classNameProp);
-  return /* @__PURE__ */ jsx(MemoView, { ...viewProps, className, "data-placeholder": true, resizeable: true, children: /* @__PURE__ */ jsx(PlaceholderCore, { showStartMenu }) });
-};
-Placeholder.displayName = "Placeholder";
-registerComponent("Placeholder", Placeholder);
-
-export { Placeholder };
-//# sourceMappingURL=Placeholder.js.map

package/esm/placeholder/Placeholder.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Placeholder.js","sources":["../../src/placeholder/Placeholder.tsx"],"sourcesContent":["import cx from \"clsx\";\nimport { registerComponent } from \"../registry/ComponentRegistry\";\nimport { LayoutStartPanel } from \"./LayoutStartPanel\";\nimport { View, ViewProps } from \"../layout-view\";\n\nimport \"./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 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);\n"],"names":["View"],"mappings":";;;;;;AAOA,MAAM,SAAY,GAAA,gBAAA,CAAA;AAclB,MAAM,eAAkB,GAAA,CAAC,EAAE,aAAA,GAAgB,MAA6B,KAAA;AACtE,EAAA,uBAAU,GAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA,aAAA,mBAAiB,GAAA,CAAA,gBAAA,EAAA,EAAiB,IAAK,IAAK,EAAA,CAAA,CAAA;AACxD,CAAA,CAAA;AAEO,MAAM,cAAc,CAAC;AAAA,EAC1B,SAAW,EAAA,aAAA;AAAA,EACX,aAAA;AAAA,EACA,GAAG,SAAA;AACL,CAAwB,KAAA;AACtB,EAAM,MAAA,SAAA,GAAY,EAAG,CAAA,SAAA,EAAW,aAAa,CAAA,CAAA;AAE7C,EAAA,uBACG,GAAA,CAAAA,QAAA,EAAA,EAAM,GAAG,SAAA,EAAW,SAAsB,EAAA,kBAAA,EAAgB,IAAC,EAAA,UAAA,EAAU,IACpE,EAAA,QAAA,kBAAA,GAAA,CAAC,eAAgB,EAAA,EAAA,aAAA,EAA8B,CACjD,EAAA,CAAA,CAAA;AAEJ,EAAA;AAEA,WAAA,CAAY,WAAc,GAAA,aAAA,CAAA;AAC1B,iBAAA,CAAkB,eAAe,WAAW,CAAA;;;;"}

package/esm/registry/ComponentRegistry.js

@@ -1,21 +0,0 @@
-const _containers = {};
-const _views = {};
-const ComponentRegistry = {};
-function isContainer(componentType) {
-  return _containers[componentType] === true;
-}
-function isView(componentType) {
-  return _views[componentType] === true;
-}
-const isLayoutComponent = (type) => isContainer(type) || isView(type);
-function registerComponent(componentName, component, type = "component") {
-  ComponentRegistry[componentName] = component;
-  if (type === "container") {
-    _containers[componentName] = true;
-  } else if (type === "view") {
-    _views[componentName] = true;
-  }
-}
-
-export { ComponentRegistry, isContainer, isLayoutComponent, isView, registerComponent };
-//# sourceMappingURL=ComponentRegistry.js.map

package/esm/registry/ComponentRegistry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ComponentRegistry.js","sources":["../../src/registry/ComponentRegistry.ts"],"sourcesContent":["import { FunctionComponent } from \"react\";\n\nconst _containers: { [key: string]: boolean } = {};\nconst _views: { [key: string]: boolean } = {};\n\nexport type layoutComponentType = \"component\" | \"container\" | \"view\";\n\nexport interface ComponentWithId {\n  id: string;\n  [key: string]: unknown;\n}\n\nexport const ComponentRegistry: {\n  [key: string]: FunctionComponent<ComponentWithId>;\n} = {};\n\nexport function isContainer(componentType: string) {\n  return _containers[componentType] === true;\n}\n\nexport function isView(componentType: string) {\n  return _views[componentType] === true;\n}\n\nexport const isLayoutComponent = (type: string) =>\n  isContainer(type) || isView(type);\n\n// export const isRegistered = (className: string) =>\n//   !!ComponentRegistry[className];\n\nexport function registerComponent(\n  componentName: string,\n  // eslint-disable-next-line @typescript-eslint/no-explicit-any\n  component: FunctionComponent<any>,\n  type: layoutComponentType = \"component\"\n) {\n  ComponentRegistry[componentName] = component;\n\n  if (type === \"container\") {\n    _containers[componentName] = true;\n  } else if (type === \"view\") {\n    _views[componentName] = true;\n  }\n}\n"],"names":[],"mappings":"AAEA,MAAM,cAA0C,EAAC,CAAA;AACjD,MAAM,SAAqC,EAAC,CAAA;AASrC,MAAM,oBAET,GAAC;AAEE,SAAS,YAAY,aAAuB,EAAA;AACjD,EAAO,OAAA,WAAA,CAAY,aAAa,CAAM,KAAA,IAAA,CAAA;AACxC,CAAA;AAEO,SAAS,OAAO,aAAuB,EAAA;AAC5C,EAAO,OAAA,MAAA,CAAO,aAAa,CAAM,KAAA,IAAA,CAAA;AACnC,CAAA;AAEO,MAAM,oBAAoB,CAAC,IAAA,KAChC,YAAY,IAAI,CAAA,IAAK,OAAO,IAAI,EAAA;AAK3B,SAAS,iBACd,CAAA,aAAA,EAEA,SACA,EAAA,IAAA,GAA4B,WAC5B,EAAA;AACA,EAAA,iBAAA,CAAkB,aAAa,CAAI,GAAA,SAAA,CAAA;AAEnC,EAAA,IAAI,SAAS,WAAa,EAAA;AACxB,IAAA,WAAA,CAAY,aAAa,CAAI,GAAA,IAAA,CAAA;AAAA,GAC/B,MAAA,IAAW,SAAS,MAAQ,EAAA;AAC1B,IAAA,MAAA,CAAO,aAAa,CAAI,GAAA,IAAA,CAAA;AAAA,GAC1B;AACF;;;;"}

package/esm/responsive/breakpoints.js

@@ -1,33 +0,0 @@
-function breakpointReader(themeName, defaultBreakpoints) {
-  const themeRoot = document.body.querySelector(`.${themeName}`);
-  const handler = {
-    get: function(style, stopName) {
-      const val = style.getPropertyValue(
-        // lets assume we have the following naming convention
-        `--${themeName}-breakpoint-${stopName}`
-      );
-      return val ? parseInt(val) : void 0;
-    }
-  };
-  return themeRoot ? new Proxy(getComputedStyle(themeRoot), handler) : defaultBreakpoints ?? {};
-}
-const byDescendingStopSize = ([, s1], [, s2]) => s2 - s1;
-const breakpointRamp = (breakpoints) => Object.entries(breakpoints).sort(byDescendingStopSize).map(([name, value], i, all) => [
-  name,
-  value,
-  i < all.length - 1 ? all[i + 1][1] : 9999
-]);
-let documentBreakpoints = null;
-const loadBreakpoints = (themeName = "salt") => {
-  const { xs, sm, md, lg, xl } = breakpointReader(themeName);
-  return breakpointRamp({ xs, sm, md, lg, xl });
-};
-const getBreakPoints = (themeName) => {
-  if (documentBreakpoints === null) {
-    documentBreakpoints = loadBreakpoints(themeName);
-  }
-  return documentBreakpoints;
-};
-
-export { breakpointRamp, getBreakPoints };
-//# sourceMappingURL=breakpoints.js.map

package/esm/responsive/breakpoints.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"breakpoints.js","sources":["../../src/responsive/breakpoints.ts"],"sourcesContent":["// should we have some global; defaults ?\n\nimport { BreakPointsProp } from \"../flexbox/flexboxTypes\";\n\nexport type BreakPointRamp = [string, number, number];\n\nfunction breakpointReader(\n  themeName: string,\n  defaultBreakpoints?: BreakPointsProp\n) {\n  //TODO ownerDocument\n  const themeRoot = document.body.querySelector(`.${themeName}`);\n  const handler = {\n    get: function (style: CSSStyleDeclaration, stopName: string) {\n      const val = style.getPropertyValue(\n        // lets assume we have the following naming convention\n        `--${themeName}-breakpoint-${stopName}`\n      );\n      return val ? parseInt(val) : undefined;\n    },\n  };\n\n  return themeRoot\n    ? new Proxy(getComputedStyle(themeRoot), handler)\n    : defaultBreakpoints ?? {};\n}\n\nconst byDescendingStopSize = (\n  [, s1]: [string, number],\n  [, s2]: [string, number]\n) => s2 - s1;\n\n// These are assumed to be min-width (aka mobile-first) stops, we could take a\n// paramneter to support max-width as well ?\n// return [stopName, minWidth, maxWidth]\nexport const breakpointRamp = (\n  breakpoints: BreakPointsProp\n): BreakPointRamp[] =>\n  Object.entries(breakpoints)\n    .sort(byDescendingStopSize)\n    .map(([name, value], i, all) => [\n      name,\n      value,\n      i < all.length - 1 ? all[i + 1][1] : 9999,\n    ]);\n\nlet documentBreakpoints: BreakPointRamp[] | null = null;\n\nconst loadBreakpoints = (themeName = \"salt\") => {\n  // TODO would be nice to read these breakpoint labels from a css variable to\n  // avoid hard-coding them here ?\n  const { xs, sm, md, lg, xl } = breakpointReader(themeName) as BreakPointsProp;\n  return breakpointRamp({ xs, sm, md, lg, xl });\n};\n\n//TODO support multiple themes loaded\nexport const getBreakPoints = (themeName?: string) => {\n  if (documentBreakpoints === null) {\n    documentBreakpoints = loadBreakpoints(themeName);\n  }\n  return documentBreakpoints;\n};\n"],"names":[],"mappings":"AAMA,SAAS,gBAAA,CACP,WACA,kBACA,EAAA;AAEA,EAAA,MAAM,YAAY,QAAS,CAAA,IAAA,CAAK,aAAc,CAAA,CAAA,CAAA,EAAI,SAAS,CAAE,CAAA,CAAA,CAAA;AAC7D,EAAA,MAAM,OAAU,GAAA;AAAA,IACd,GAAA,EAAK,SAAU,KAAA,EAA4B,QAAkB,EAAA;AAC3D,MAAA,MAAM,MAAM,KAAM,CAAA,gBAAA;AAAA;AAAA,QAEhB,CAAA,EAAA,EAAK,SAAS,CAAA,YAAA,EAAe,QAAQ,CAAA,CAAA;AAAA,OACvC,CAAA;AACA,MAAO,OAAA,GAAA,GAAM,QAAS,CAAA,GAAG,CAAI,GAAA,KAAA,CAAA,CAAA;AAAA,KAC/B;AAAA,GACF,CAAA;AAEA,EAAO,OAAA,SAAA,GACH,IAAI,KAAM,CAAA,gBAAA,CAAiB,SAAS,CAAG,EAAA,OAAO,CAC9C,GAAA,kBAAA,IAAsB,EAAC,CAAA;AAC7B,CAAA;AAEA,MAAM,oBAAA,GAAuB,CAC3B,GAAG,EAAE,GACL,GAAG,EAAE,CAAA,KACF,EAAK,GAAA,EAAA,CAAA;AAKH,MAAM,iBAAiB,CAC5B,WAAA,KAEA,MAAO,CAAA,OAAA,CAAQ,WAAW,CACvB,CAAA,IAAA,CAAK,oBAAoB,CAAA,CACzB,IAAI,CAAC,CAAC,MAAM,KAAK,CAAA,EAAG,GAAG,GAAQ,KAAA;AAAA,EAC9B,IAAA;AAAA,EACA,KAAA;AAAA,EACA,CAAA,GAAI,IAAI,MAAS,GAAA,CAAA,GAAI,IAAI,CAAI,GAAA,CAAC,CAAE,CAAA,CAAC,CAAI,GAAA,IAAA;AACvC,CAAC,EAAA;AAEL,IAAI,mBAA+C,GAAA,IAAA,CAAA;AAEnD,MAAM,eAAA,GAAkB,CAAC,SAAA,GAAY,MAAW,KAAA;AAG9C,EAAM,MAAA,EAAE,IAAI,EAAI,EAAA,EAAA,EAAI,IAAI,EAAG,EAAA,GAAI,iBAAiB,SAAS,CAAA,CAAA;AACzD,EAAA,OAAO,eAAe,EAAE,EAAA,EAAI,IAAI,EAAI,EAAA,EAAA,EAAI,IAAI,CAAA,CAAA;AAC9C,CAAA,CAAA;AAGa,MAAA,cAAA,GAAiB,CAAC,SAAuB,KAAA;AACpD,EAAA,IAAI,wBAAwB,IAAM,EAAA;AAChC,IAAA,mBAAA,GAAsB,gBAAgB,SAAS,CAAA,CAAA;AAAA,GACjD;AACA,EAAO,OAAA,mBAAA,CAAA;AACT;;;;"}

package/esm/responsive/use-breakpoints.js

@@ -1,74 +0,0 @@
-import { useState, useRef, useCallback, useEffect } from 'react';
-import { useResizeObserver } from './useResizeObserver.js';
-import { breakpointRamp, getBreakPoints } from './breakpoints.js';
-
-const EMPTY_ARRAY = [];
-const useBreakpoints = ({ breakPoints: breakPointsProp, smallerThan }, ref) => {
-  const [breakpointMatch, setBreakpointmatch] = useState(
-    smallerThan ? false : "lg"
-  );
-  const bodyRef = useRef(document.body);
-  const breakPointsRef = useRef(
-    breakPointsProp ? breakpointRamp(breakPointsProp) : getBreakPoints()
-  );
-  const sizeRef = useRef("lg");
-  const stopFromMinWidth = useCallback(
-    (w) => {
-      if (breakPointsRef.current) {
-        for (const [name, size] of breakPointsRef.current) {
-          if (w >= size) {
-            return name;
-          }
-        }
-      }
-    },
-    [breakPointsRef]
-  );
-  const matchSizeAgainstBreakpoints = useCallback(
-    (width) => {
-      if (smallerThan) {
-        const breakPointRamp = breakPointsRef.current.find(
-          ([name]) => name === smallerThan
-        );
-        if (breakPointRamp) {
-          const [, , maxValue] = breakPointRamp;
-          return width < maxValue;
-        }
-      } else {
-        return stopFromMinWidth(width);
-      }
-      return width;
-    },
-    [smallerThan, stopFromMinWidth]
-  );
-  useResizeObserver(
-    ref || bodyRef,
-    breakPointsRef.current ? ["width"] : EMPTY_ARRAY,
-    ({ width: measuredWidth }) => {
-      const result = matchSizeAgainstBreakpoints(measuredWidth);
-      if (result !== sizeRef.current) {
-        sizeRef.current = result;
-        setBreakpointmatch(result);
-      }
-    },
-    true
-  );
-  useEffect(() => {
-    const target = ref || bodyRef;
-    if (target.current) {
-      const prevSize = sizeRef.current;
-      if (breakPointsRef.current) {
-        const { clientWidth } = target.current;
-        const result = matchSizeAgainstBreakpoints(clientWidth);
-        sizeRef.current = result;
-        if (result !== prevSize) {
-          setBreakpointmatch(result);
-        }
-      }
-    }
-  }, [setBreakpointmatch, matchSizeAgainstBreakpoints, ref]);
-  return breakpointMatch;
-};
-
-export { useBreakpoints };
-//# sourceMappingURL=use-breakpoints.js.map

package/esm/responsive/use-breakpoints.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-breakpoints.js","sources":["../../src/responsive/use-breakpoints.ts"],"sourcesContent":["import { RefObject, useCallback, useEffect, useRef, useState } from \"react\";\nimport { useResizeObserver } from \"./useResizeObserver\";\nimport {\n  BreakPointRamp,\n  breakpointRamp,\n  getBreakPoints as getDocumentBreakpoints,\n} from \"./breakpoints\";\nimport { BreakPoint, BreakPointsProp } from \"../flexbox/flexboxTypes\";\n\nconst EMPTY_ARRAY: BreakPoint[] = [];\n\nexport interface BreakpointsHookProps {\n  breakPoints?: BreakPointsProp;\n  smallerThan?: string;\n}\n\n// TODO how do we cater for smallerThan/greaterThan breakpoints\nexport const useBreakpoints = (\n  { breakPoints: breakPointsProp, smallerThan }: BreakpointsHookProps,\n  ref: RefObject<HTMLElement>\n) => {\n  const [breakpointMatch, setBreakpointmatch] = useState(\n    smallerThan ? false : \"lg\"\n  );\n  const bodyRef = useRef(document.body);\n  const breakPointsRef = useRef<BreakPointRamp[]>(\n    breakPointsProp ? breakpointRamp(breakPointsProp) : getDocumentBreakpoints()\n  );\n\n  // TODO how do we identify the default\n  const sizeRef = useRef(\"lg\");\n\n  const stopFromMinWidth = useCallback(\n    (w) => {\n      if (breakPointsRef.current) {\n        for (const [name, size] of breakPointsRef.current) {\n          if (w >= size) {\n            return name;\n          }\n        }\n      }\n    },\n    [breakPointsRef]\n  );\n\n  const matchSizeAgainstBreakpoints = useCallback(\n    (width) => {\n      if (smallerThan) {\n        const breakPointRamp = breakPointsRef.current.find(\n          ([name]: BreakPointRamp) => name === smallerThan\n        );\n        if (breakPointRamp) {\n          const [, , maxValue] = breakPointRamp;\n          return width < maxValue;\n        }\n      } else {\n        return stopFromMinWidth(width);\n      }\n      // is this right ?\n      return width;\n    },\n    [smallerThan, stopFromMinWidth]\n  );\n\n  // TODO need to make the dimension a config\n  useResizeObserver(\n    ref || bodyRef,\n    breakPointsRef.current ? [\"width\"] : EMPTY_ARRAY,\n    ({ width: measuredWidth }: { width?: number }) => {\n      const result = matchSizeAgainstBreakpoints(measuredWidth);\n      if (result !== sizeRef.current) {\n        sizeRef.current = result;\n        setBreakpointmatch(result);\n      }\n    },\n    true\n  );\n\n  useEffect(() => {\n    const target = ref || bodyRef;\n    if (target.current) {\n      const prevSize = sizeRef.current;\n      if (breakPointsRef.current) {\n        // We're measuring here when the resizeObserver has also measured\n        // There isn't a convenient way to get the Resizeobserver to\n        // notify initial size - that's not really its job, unless we\n        // set a flag ?\n        const { clientWidth } = target.current;\n        const result = matchSizeAgainstBreakpoints(clientWidth);\n        sizeRef.current = result;\n        // If initial size of ref does not match the default, notify client after render\n        if (result !== prevSize) {\n          setBreakpointmatch(result);\n        }\n      }\n    }\n  }, [setBreakpointmatch, matchSizeAgainstBreakpoints, ref]);\n\n  // No, just ass the class directly to the ref, no need to render\n  return breakpointMatch;\n};\n"],"names":["getDocumentBreakpoints"],"mappings":";;;;AASA,MAAM,cAA4B,EAAC,CAAA;AAQ5B,MAAM,iBAAiB,CAC5B,EAAE,aAAa,eAAiB,EAAA,WAAA,IAChC,GACG,KAAA;AACH,EAAM,MAAA,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAA,QAAA;AAAA,IAC5C,cAAc,KAAQ,GAAA,IAAA;AAAA,GACxB,CAAA;AACA,EAAM,MAAA,OAAA,GAAU,MAAO,CAAA,QAAA,CAAS,IAAI,CAAA,CAAA;AACpC,EAAA,MAAM,cAAiB,GAAA,MAAA;AAAA,IACrB,eAAkB,GAAA,cAAA,CAAe,eAAe,CAAA,GAAIA,cAAuB,EAAA;AAAA,GAC7E,CAAA;AAGA,EAAM,MAAA,OAAA,GAAU,OAAO,IAAI,CAAA,CAAA;AAE3B,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IACvB,CAAC,CAAM,KAAA;AACL,MAAA,IAAI,eAAe,OAAS,EAAA;AAC1B,QAAA,KAAA,MAAW,CAAC,IAAA,EAAM,IAAI,CAAA,IAAK,eAAe,OAAS,EAAA;AACjD,UAAA,IAAI,KAAK,IAAM,EAAA;AACb,YAAO,OAAA,IAAA,CAAA;AAAA,WACT;AAAA,SACF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,cAAc,CAAA;AAAA,GACjB,CAAA;AAEA,EAAA,MAAM,2BAA8B,GAAA,WAAA;AAAA,IAClC,CAAC,KAAU,KAAA;AACT,MAAA,IAAI,WAAa,EAAA;AACf,QAAM,MAAA,cAAA,GAAiB,eAAe,OAAQ,CAAA,IAAA;AAAA,UAC5C,CAAC,CAAC,IAAI,CAAA,KAAsB,IAAS,KAAA,WAAA;AAAA,SACvC,CAAA;AACA,QAAA,IAAI,cAAgB,EAAA;AAClB,UAAA,MAAM,KAAK,QAAQ,CAAI,GAAA,cAAA,CAAA;AACvB,UAAA,OAAO,KAAQ,GAAA,QAAA,CAAA;AAAA,SACjB;AAAA,OACK,MAAA;AACL,QAAA,OAAO,iBAAiB,KAAK,CAAA,CAAA;AAAA,OAC/B;AAEA,MAAO,OAAA,KAAA,CAAA;AAAA,KACT;AAAA,IACA,CAAC,aAAa,gBAAgB,CAAA;AAAA,GAChC,CAAA;AAGA,EAAA,iBAAA;AAAA,IACE,GAAO,IAAA,OAAA;AAAA,IACP,cAAe,CAAA,OAAA,GAAU,CAAC,OAAO,CAAI,GAAA,WAAA;AAAA,IACrC,CAAC,EAAE,KAAO,EAAA,aAAA,EAAwC,KAAA;AAChD,MAAM,MAAA,MAAA,GAAS,4BAA4B,aAAa,CAAA,CAAA;AACxD,MAAI,IAAA,MAAA,KAAW,QAAQ,OAAS,EAAA;AAC9B,QAAA,OAAA,CAAQ,OAAU,GAAA,MAAA,CAAA;AAClB,QAAA,kBAAA,CAAmB,MAAM,CAAA,CAAA;AAAA,OAC3B;AAAA,KACF;AAAA,IACA,IAAA;AAAA,GACF,CAAA;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,SAAS,GAAO,IAAA,OAAA,CAAA;AACtB,IAAA,IAAI,OAAO,OAAS,EAAA;AAClB,MAAA,MAAM,WAAW,OAAQ,CAAA,OAAA,CAAA;AACzB,MAAA,IAAI,eAAe,OAAS,EAAA;AAK1B,QAAM,MAAA,EAAE,WAAY,EAAA,GAAI,MAAO,CAAA,OAAA,CAAA;AAC/B,QAAM,MAAA,MAAA,GAAS,4BAA4B,WAAW,CAAA,CAAA;AACtD,QAAA,OAAA,CAAQ,OAAU,GAAA,MAAA,CAAA;AAElB,QAAA,IAAI,WAAW,QAAU,EAAA;AACvB,UAAA,kBAAA,CAAmB,MAAM,CAAA,CAAA;AAAA,SAC3B;AAAA,OACF;AAAA,KACF;AAAA,GACC,EAAA,CAAC,kBAAoB,EAAA,2BAAA,EAA6B,GAAG,CAAC,CAAA,CAAA;AAGzD,EAAO,OAAA,eAAA,CAAA;AACT;;;;"}