@dreamcommerce/aurora 3.0.0-52 → 3.0.0-54

package/build/esm/packages/aurora/src/components/sidebar/context/sidebar_prvider.js

@@ -1,17 +1,15 @@
 import { useState, useEffect, useMemo, createElement } from 'react';
-import { objectWithoutProperties as _objectWithoutProperties, slicedToArray as _slicedToArray, objectSpread2 as _objectSpread2 } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { slicedToArray as _slicedToArray } from '../../../../../../_virtual/_rollupPluginBabelHelpers.js';
+import { SIDEBAR_VARIANTS } from '../sidebar_constants.js';
 import { SidebarContext } from './sidebar_context.js';
 
-var _excluded = ["onToggle", "open", "className", "style", "children", "persistentKey"];
 var SidebarProvider = function SidebarProvider(_ref) {
-  var onToggle = _ref.onToggle,
-    _ref$open = _ref.open,
-    openProp = _ref$open === void 0 ? true : _ref$open,
-    className = _ref.className,
-    style = _ref.style,
+  var open = _ref.open,
+    defaultOpen = _ref.defaultOpen,
+    onOpenChange = _ref.onOpenChange,
     children = _ref.children,
     persistentKey = _ref.persistentKey,
-    props = _objectWithoutProperties(_ref, _excluded);
+    variant = _ref.variant;
   var setPersistedState = function setPersistedState(value) {
     if (!persistentKey) return;
     try {
@@ -20,26 +18,25 @@ var SidebarProvider = function SidebarProvider(_ref) {
       console.error('Failed to set persisted state', error);
     }
   };
-  var _React$useState = useState(openProp),
+  var initialOpen = variant === SIDEBAR_VARIANTS.persistent;
+  var _React$useState = useState(onOpenChange ? open !== null && open !== void 0 ? open : initialOpen : defaultOpen !== null && defaultOpen !== void 0 ? defaultOpen : initialOpen),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     _open = _React$useState2[0],
     _setOpen = _React$useState2[1];
-  useEffect(function () {
-    if (openProp !== undefined && openProp !== _open) setOpen(openProp);
-  }, [openProp]);
   useEffect(function () {
     setPersistedState(_open);
-  }, []);
-  var setOpen = function setOpen(open) {
-    var nextValue = typeof open === 'function' ? open(_open) : open;
-    onToggle === null || onToggle === void 0 ? void 0 : onToggle(nextValue);
-    _setOpen(nextValue);
-    setPersistedState(nextValue);
+  }, [_open]);
+  useEffect(function () {
+    _setOpen(open !== null && open !== void 0 ? open : initialOpen);
+  }, [open]);
+  if (open !== undefined && onOpenChange === undefined) {
+    console.error('The controlled open state of the popover. Must be used in conjunction with onOpenChange.');
+  }
+  var setOpen = function setOpen(nextOpen) {
+    _setOpen(nextOpen);
   };
   var toggleSidebar = function toggleSidebar() {
-    setOpen(function (open) {
-      return !open;
-    });
+    onOpenChange ? onOpenChange(!_open) : setOpen(!_open);
   };
   var contextValue = useMemo(function () {
     return {
@@ -49,9 +46,7 @@ var SidebarProvider = function SidebarProvider(_ref) {
   }, [open, toggleSidebar]);
   return /*#__PURE__*/createElement(SidebarContext.Provider, {
     value: contextValue
-  }, /*#__PURE__*/createElement("div", _objectSpread2({
-    style: style
-  }, props), children));
+  }, children);
 };
 
 export { SidebarProvider };

package/build/esm/packages/aurora/src/components/sidebar/context/sidebar_prvider.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/sidebar/sidebar.d.ts

@@ -1,3 +1,3 @@
-import * as React from 'react';
-import { TSidebarProps } from "./sidebar_types";
-export declare const Sidebar: React.ForwardRefExoticComponent<Omit<React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement> & TSidebarProps, "ref"> & React.RefAttributes<HTMLDivElement | null>>;
+import { TSidebarProps } from "./sidebar_types_types";
+import React, { PropsWithChildren } from 'react';
+export declare const Sidebar: ({ children, variant, side, width, className, ...props }: PropsWithChildren<TSidebarProps>) => React.JSX.Element;

package/build/esm/packages/aurora/src/components/sidebar/sidebar.js

@@ -1,54 +1,28 @@
-import { forwardRef, useRef, useImperativeHandle, createElement } from 'react';
+import React from 'react';
 import { objectWithoutProperties as _objectWithoutProperties, objectSpread2 as _objectSpread2 } from '../../../../../_virtual/_rollupPluginBabelHelpers.js';
-import { cn } from '../../utilities/cn.js';
-import { useSidebar } from './hooks/use_sidebar.js';
-import { SIDEBAR_SIDE } from './sidebar_constants.js';
-import { SidebarTrigger } from './components/sidebar_trigger.js';
+import { SIDEBAR_VARIANTS } from './sidebar_constants.js';
+import { PersistentSidebar } from './components/persistent_sidebar.js';
+import { SidebarProvider } from './context/sidebar_prvider.js';
+import { TemporalSidebar } from './components/temporal_sidebar.js';
 
-var _excluded = ["className", "children", "TriggerButton", "width", "minWidth", "maxWidth", "height", "minHeight", "maxHeight", "side"];
-var Sidebar = /*#__PURE__*/forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    children = _ref.children,
-    _ref$TriggerButton = _ref.TriggerButton,
-    TriggerButton = _ref$TriggerButton === void 0 ? SidebarTrigger : _ref$TriggerButton,
-    width = _ref.width,
-    minWidth = _ref.minWidth,
-    maxWidth = _ref.maxWidth,
-    _ref$height = _ref.height,
-    height = _ref$height === void 0 ? '100%' : _ref$height,
-    minHeight = _ref.minHeight,
-    maxHeight = _ref.maxHeight,
+var _excluded = ["children", "variant", "side", "width", "className"];
+var Sidebar = function Sidebar(_ref) {
+  var children = _ref.children,
+    _ref$variant = _ref.variant,
+    variant = _ref$variant === void 0 ? SIDEBAR_VARIANTS.persistent : _ref$variant,
     _ref$side = _ref.side,
-    side = _ref$side === void 0 ? SIDEBAR_SIDE.left : _ref$side,
+    width = _ref.width,
+    className = _ref.className,
     props = _objectWithoutProperties(_ref, _excluded);
-  var _useSidebar = useSidebar(),
-    open = _useSidebar.open;
-  var sidebarRef = useRef(null);
-  useImperativeHandle(ref, function () {
-    return sidebarRef.current;
-  });
-  return /*#__PURE__*/createElement("div", _objectSpread2({
-    "aria-expanded": open,
-    ref: sidebarRef,
-    className: cn('aurora-relative aurora-transition-all aurora-duration-200', className),
-    style: {
-      width: open ? width : 0,
-      maxWidth: open ? width : 0,
-      minWidth: open ? width : 0,
-      height: height,
-      minHeight: minHeight,
-      maxHeight: maxHeight
-    }
-  }, props), TriggerButton ? /*#__PURE__*/createElement(TriggerButton, {
-    side: side
-  }) : null, /*#__PURE__*/createElement("div", {
-    className: cn('aurora-overflow-auto aurora-h-full aurora-w-full', {
-      'aurora-opacity-0': !open,
-      'aurora-opacity-100': open
-    })
-  }, children));
-});
-Sidebar.displayName = 'Sidebar';
+  return /*#__PURE__*/React.createElement(SidebarProvider, _objectSpread2({
+    variant: variant,
+    width: width,
+    className: className
+  }, props), variant === SIDEBAR_VARIANTS.persistent ? (/*#__PURE__*/React.createElement(PersistentSidebar, {
+    width: width,
+    className: className
+  }, children)) : (/*#__PURE__*/React.createElement(TemporalSidebar, null, children)));
+};
 
 export { Sidebar };
 //# sourceMappingURL=sidebar.js.map

package/build/esm/packages/aurora/src/components/sidebar/sidebar.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/sidebar/sidebar_constants.d.ts

@@ -1,4 +1,12 @@
+export declare const SIDEBAR_VARIANTS: {
+    readonly persistent: "persistent";
+    readonly temporal: "temporal";
+};
 export declare const SIDEBAR_SIDE: {
     readonly left: "left";
     readonly right: "right";
 };
+export declare const SIDEBAR_SLIDE_DIRECTION: {
+    readonly leftToRight: "leftToRight";
+    readonly rightToLeft: "rightToLeft";
+};

package/build/esm/packages/aurora/src/components/sidebar/sidebar_constants.js

@@ -1,7 +1,15 @@
+var SIDEBAR_VARIANTS = {
+  persistent: 'persistent',
+  temporal: 'temporal'
+};
 var SIDEBAR_SIDE = {
   left: 'left',
   right: 'right'
 };
+var SIDEBAR_SLIDE_DIRECTION = {
+  leftToRight: 'leftToRight',
+  rightToLeft: 'rightToLeft'
+};
 
-export { SIDEBAR_SIDE };
+export { SIDEBAR_SIDE, SIDEBAR_SLIDE_DIRECTION, SIDEBAR_VARIANTS };
 //# sourceMappingURL=sidebar_constants.js.map

package/build/esm/packages/aurora/src/components/sidebar/sidebar_constants.js.map

@@ -1 +1 @@
-{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;"}
+{"version":3,"file":null,"sources":[null],"sourcesContent":[null],"names":[],"mappings":"AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;"}

package/build/esm/packages/aurora/src/components/sidebar/sidebar_types_types.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+import { SIDEBAR_SIDE, SIDEBAR_SLIDE_DIRECTION, SIDEBAR_VARIANTS } from "./sidebar_constants";
+import { Any } from 'ts-toolbelt';
+export declare type TSidebarVariant = Any.Keys<typeof SIDEBAR_VARIANTS>;
+export declare type TSidebarSide = Any.Keys<typeof SIDEBAR_SIDE>;
+export declare type TSidebarSlideDirection = Any.Keys<typeof SIDEBAR_SLIDE_DIRECTION>;
+export declare type TSidebarProps = {
+    variant?: TSidebarVariant;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    defaultOpen?: boolean;
+    side?: TSidebarSide;
+    slideDirection?: TSidebarSlideDirection;
+    width?: string;
+    className?: string;
+    persistentKey?: string;
+    container?: HTMLElement;
+} & React.HTMLAttributes<HTMLHtmlElement>;

package/build/esm/packages/aurora/src/components/sidebar/{sidebar_types.js → sidebar_types_types.js}

@@ -1,4 +1,4 @@
 import 'react';
 import '@auroraComponents/sidebar/sidebar_constants';
 import 'ts-toolbelt';
-//# sourceMappingURL=sidebar_types.js.map
+//# sourceMappingURL=sidebar_types_types.js.map

package/build/esm/packages/aurora/src/components/sidebar/sidebar_types_types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sidebar_types_types.js","sourceRoot":"","sources":["../../../../../../../src/components/sidebar/sidebar_types_types.ts"],"names":[],"mappings":"AAAA,OAAkB,OAAO,CAAC;AAC1B,OAAwE,6CAA6C,CAAC;AACtH,OAAoB,aAAa,CAAC"}

package/build/esm/packages/aurora/src/index.d.ts

@@ -26,9 +26,9 @@ export { BOX_COMPONENT_TYPES } from "./components/box/box_constants";
 export { Typography } from './components/typography/typography';
 export { TYPOGRAPHY_TRANSFORM_TYPES, TYPOGRAPHY_COMPONENT_TYPES, TYPOGRAPHY_WEIGHT_TYPES } from "./components/typography/typography_constants";
 export { Sidebar } from './components/sidebar/sidebar';
-export { SidebarProvider } from "./components/sidebar/context/sidebar_prvider";
+export { SidebarToggle } from "./components/sidebar/components/sidebar_toggle";
 export { useSidebar } from './components/sidebar/hooks/use_sidebar';
-export { SIDEBAR_SIDE } from "./components/sidebar/sidebar_constants";
+export { SIDEBAR_SIDE, SIDEBAR_VARIANTS, SIDEBAR_SLIDE_DIRECTION } from "./components/sidebar/sidebar_constants";
 export { Divider } from './components/divider/divider';
 export { DIVIDER_VARIANTS, DIVIDER_THICKNESS, DIVIDER_ORIENTATION } from "./components/divider/divider_constants";
 export { Stack } from './components/stack/stack';

package/build/esm/packages/aurora/src/index.js

@@ -43,10 +43,10 @@ export { ActionListTrigger } from './components/action_list/components/action_li
 export { ActionListSubContent } from './components/action_list/components/action_list_sub_content.js';
 export { BADGE_VARIANTS } from './components/badge/badge_constants.js';
 export { Badge } from './components/badge/badge.js';
+export { SIDEBAR_SIDE, SIDEBAR_SLIDE_DIRECTION, SIDEBAR_VARIANTS } from './components/sidebar/sidebar_constants.js';
 export { useSidebar } from './components/sidebar/hooks/use_sidebar.js';
-export { SIDEBAR_SIDE } from './components/sidebar/sidebar_constants.js';
 export { Sidebar } from './components/sidebar/sidebar.js';
-export { SidebarProvider } from './components/sidebar/context/sidebar_prvider.js';
+export { SidebarToggle } from './components/sidebar/components/sidebar_toggle.js';
 export { Tooltip } from './components/tooltip/tooltip.js';
 export { TooltipTrigger } from './components/tooltip/components/tooltip_trigger.js';
 export { TOOLTIP_VARIANT_TYPES } from './components/tooltip/tooltip_constants.js';