@onereach/ui-components 10.3.3 → 10.3.4-beta.4320.0

package/dist/esm/v2/{OrResizeablePanel-2f741cc2.js → OrResizeablePanel-202d2e8e.js}

@@ -99,10 +99,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-col justify-center',
   // Interactivity
   'interactivity-resize-row',
-  // Box
-  'h-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-my-[calc(theme(spacing.md)/2)]',
+  '-my-[calc(theme(spacing.md)/2)]', 'py-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-b-1'],
   [ResizeablePanelPlacement.Bottom]: [
@@ -110,10 +108,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-col justify-center',
   // Interactivity
   'interactivity-resize-row',
-  // Box
-  'h-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-my-[calc(theme(spacing.md)/2)]',
+  '-my-[calc(theme(spacing.md)/2)]', 'py-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-t-1'],
   [ResizeablePanelPlacement.Left]: [
@@ -121,10 +117,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-row justify-center',
   // Interactivity
   'interactivity-resize-column',
-  // Box
-  'w-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-mx-[calc(theme(spacing.md)/2)]',
+  '-mx-[calc(theme(spacing.md)/2)]', 'px-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-r-1'],
   [ResizeablePanelPlacement.Right]: [
@@ -132,16 +126,14 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-row justify-center',
   // Interactivity
   'interactivity-resize-column',
-  // Box
-  'w-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-mx-[calc(theme(spacing.md)/2)]',
+  '-mx-[calc(theme(spacing.md)/2)]', 'px-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-l-1']
 };
 const ResizeablePanelCollapseButtonContainer = [
 // Position
-'relative z-10',
+'absolute z-10',
 // Shape
 'rounded-full',
 // Box
@@ -153,24 +145,24 @@ const ResizeablePanelCollapseButtonContainer = [
 const ResizeablePanelCollapseButtonContainerPlacements = {
   [ResizeablePanelPlacement.Top]: [
   // Position
-  'left-md',
-  // Spacing
-  '-my-[calc(theme(spacing.md)-2px)]'],
+  'left-md', 'bottom-0',
+  // Transform
+  'translate-y-1/2'],
   [ResizeablePanelPlacement.Bottom]: [
   // Position
-  'left-md',
-  // Spacing
-  '-my-[calc(theme(spacing.md)-2px)]'],
+  'left-md', 'top-0',
+  // Transform
+  '-translate-y-1/2'],
   [ResizeablePanelPlacement.Left]: [
   // Position
-  'top-md',
-  // Spacing
-  '-mx-[calc(theme(spacing.md)-2px)]'],
+  'top-md', 'right-0',
+  // Transform
+  'translate-x-1/2'],
   [ResizeablePanelPlacement.Right]: [
   // Position
-  'top-md',
-  // Spacing
-  '-mx-[calc(theme(spacing.md)-2px)]']
+  'top-md', 'left-0',
+  // Transform
+  '-translate-x-1/2']
 };
 const ResizeablePanelToolbar = [
 // Layout

package/dist/esm/v2/components/index.js

@@ -98,7 +98,7 @@ export { _ as OrRadioGroupV3 } from '../OrRadioGroup-206e8317.js';
 export { _ as OrRadioV3 } from '../OrRadio-3629ad83.js';
 export { _ as OrRangeSliderV3 } from '../OrRangeSlider-0f59285f.js';
 export { _ as OrRatingV3 } from '../OrRating-aa2365e9.js';
-export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../OrResizeablePanel-2f741cc2.js';
+export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../OrResizeablePanel-202d2e8e.js';
 export { F as Formats, _ as OrRichTextEditorV3 } from '../OrRichTextEditor-c03de64c.js';
 export { _ as OrSearch } from '../OrSearch-a340d5ff.js';
 export { _ as OrSearchV3 } from '../OrSearch-9eef2fa5.js';
@@ -106,7 +106,7 @@ export { _ as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegme
 export { _ as OrSelect } from '../OrSelect-fc49a01a.js';
 export { _ as OrSelectV3 } from '../OrSelect-9934df68.js';
 export { _ as OrSidebar, O as OrSidebarSide } from '../OrSidebar-054b26c6.js';
-export { _ as OrSidebarV3, S as SidebarPlacement } from '../props-69f67541.js';
+export { _ as OrSidebarV3, S as SidebarPlacement } from '../props-cc93ea49.js';
 export { _ as OrSkeletonCircle } from '../OrSkeletonCircle-c4bf0e34.js';
 export { _ as OrSkeletonRect } from '../OrSkeletonRect-79162a84.js';
 export { _ as OrSkeletonText } from '../OrSkeletonText-202a4282.js';

package/dist/esm/v2/components/or-resizeable-panel-v3/index.js

@@ -1,4 +1,4 @@
-export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../../OrResizeablePanel-2f741cc2.js';
+export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../../OrResizeablePanel-202d2e8e.js';
 import '@vueuse/core';
 import 'vue-demi';
 import '../../dom-53c9635b.js';

package/dist/esm/v2/components/or-sidebar-v3/index.js

@@ -1,4 +1,4 @@
-export { _ as OrSidebarV3, S as SidebarPlacement } from '../../props-69f67541.js';
+export { _ as OrSidebarV3, S as SidebarPlacement } from '../../props-cc93ea49.js';
 import 'vue-demi';
 import '../../dom-53c9635b.js';
 import 'lodash/get';
@@ -8,7 +8,7 @@ import '../../usePopoverState-5033b9cb.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import '../../TimeFormat-a7f5565b.js';
-import '../../OrResizeablePanel-2f741cc2.js';
+import '../../OrResizeablePanel-202d2e8e.js';
 import '../../OrIconButton-f98bac24.js';
 import '../../OrIcon-03e3c802.js';
 import '../../normalize-component-6e8e3d80.js';

package/dist/esm/v2/index.js

@@ -98,7 +98,7 @@ export { _ as OrRadioGroupV3 } from './OrRadioGroup-206e8317.js';
 export { _ as OrRadioV3 } from './OrRadio-3629ad83.js';
 export { _ as OrRangeSliderV3 } from './OrRangeSlider-0f59285f.js';
 export { _ as OrRatingV3 } from './OrRating-aa2365e9.js';
-export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from './OrResizeablePanel-2f741cc2.js';
+export { _ as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from './OrResizeablePanel-202d2e8e.js';
 export { F as Formats, _ as OrRichTextEditorV3 } from './OrRichTextEditor-c03de64c.js';
 export { _ as OrSearch } from './OrSearch-a340d5ff.js';
 export { _ as OrSearchV3 } from './OrSearch-9eef2fa5.js';
@@ -106,7 +106,7 @@ export { _ as OrSegmentedControlV3, S as SegmentedControlSize } from './OrSegmen
 export { _ as OrSelect } from './OrSelect-fc49a01a.js';
 export { _ as OrSelectV3 } from './OrSelect-9934df68.js';
 export { _ as OrSidebar, O as OrSidebarSide } from './OrSidebar-054b26c6.js';
-export { _ as OrSidebarV3, S as SidebarPlacement } from './props-69f67541.js';
+export { _ as OrSidebarV3, S as SidebarPlacement } from './props-cc93ea49.js';
 export { _ as OrSkeletonCircle } from './OrSkeletonCircle-c4bf0e34.js';
 export { _ as OrSkeletonRect } from './OrSkeletonRect-79162a84.js';
 export { _ as OrSkeletonText } from './OrSkeletonText-202a4282.js';

package/dist/esm/v2/{props-69f67541.js → props-cc93ea49.js}

@@ -5,7 +5,7 @@ import { u as usePopoverState } from './usePopoverState-5033b9cb.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import './TimeFormat-a7f5565b.js';
-import { R as ResizeablePanelPadding, _ as __vue_component__$1 } from './OrResizeablePanel-2f741cc2.js';
+import { R as ResizeablePanelPadding, _ as __vue_component__$1 } from './OrResizeablePanel-202d2e8e.js';
 import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
 
 const Sidebar = [

package/dist/esm/v3/{OrResizeablePanel-6e37ca25.js → OrResizeablePanel-ba37bdc3.js}

@@ -99,10 +99,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-col justify-center',
   // Interactivity
   'interactivity-resize-row',
-  // Box
-  'h-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-my-[calc(theme(spacing.md)/2)]',
+  '-my-[calc(theme(spacing.md)/2)]', 'py-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-b-1'],
   [ResizeablePanelPlacement.Bottom]: [
@@ -110,10 +108,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-col justify-center',
   // Interactivity
   'interactivity-resize-row',
-  // Box
-  'h-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-my-[calc(theme(spacing.md)/2)]',
+  '-my-[calc(theme(spacing.md)/2)]', 'py-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-t-1'],
   [ResizeablePanelPlacement.Left]: [
@@ -121,10 +117,8 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-row justify-center',
   // Interactivity
   'interactivity-resize-column',
-  // Box
-  'w-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-mx-[calc(theme(spacing.md)/2)]',
+  '-mx-[calc(theme(spacing.md)/2)]', 'px-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-r-1'],
   [ResizeablePanelPlacement.Right]: [
@@ -132,16 +126,14 @@ const ResizeablePanelResizeBarPlacements = {
   'flex flex-row justify-center',
   // Interactivity
   'interactivity-resize-column',
-  // Box
-  'w-[calc(theme(spacing.md)+1px)]',
   // Spacing
-  '-mx-[calc(theme(spacing.md)/2)]',
+  '-mx-[calc(theme(spacing.md)/2)]', 'px-[calc(theme(spacing.md)/2)]',
   // Theme (after)
   'after:border-l-1']
 };
 const ResizeablePanelCollapseButtonContainer = [
 // Position
-'relative z-10',
+'absolute z-10',
 // Shape
 'rounded-full',
 // Box
@@ -153,24 +145,24 @@ const ResizeablePanelCollapseButtonContainer = [
 const ResizeablePanelCollapseButtonContainerPlacements = {
   [ResizeablePanelPlacement.Top]: [
   // Position
-  'left-md',
-  // Spacing
-  '-my-[calc(theme(spacing.md)-2px)]'],
+  'left-md', 'bottom-0',
+  // Transform
+  'translate-y-1/2'],
   [ResizeablePanelPlacement.Bottom]: [
   // Position
-  'left-md',
-  // Spacing
-  '-my-[calc(theme(spacing.md)-2px)]'],
+  'left-md', 'top-0',
+  // Transform
+  '-translate-y-1/2'],
   [ResizeablePanelPlacement.Left]: [
   // Position
-  'top-md',
-  // Spacing
-  '-mx-[calc(theme(spacing.md)-2px)]'],
+  'top-md', 'right-0',
+  // Transform
+  'translate-x-1/2'],
   [ResizeablePanelPlacement.Right]: [
   // Position
-  'top-md',
-  // Spacing
-  '-mx-[calc(theme(spacing.md)-2px)]']
+  'top-md', 'left-0',
+  // Transform
+  '-translate-x-1/2']
 };
 const ResizeablePanelToolbar = [
 // Layout

package/dist/esm/v3/components/index.js

@@ -95,7 +95,7 @@ export { s as OrRadioGroupV3 } from '../OrRadioGroup-75519d7c.js';
 export { s as OrRadioV3 } from '../OrRadio-370438a9.js';
 export { s as OrRangeSliderV3 } from '../OrRangeSlider-820d0c22.js';
 export { s as OrRatingV3 } from '../OrRating-2abf71bd.js';
-export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../OrResizeablePanel-6e37ca25.js';
+export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../OrResizeablePanel-ba37bdc3.js';
 export { F as Formats, s as OrRichTextEditorV3 } from '../OrRichTextEditor-9781c771.js';
 export { s as OrSearch } from '../OrSearch-948c7f78.js';
 export { s as OrSearchV3 } from '../OrSearch-a10f294f.js';
@@ -103,7 +103,7 @@ export { s as OrSegmentedControlV3, S as SegmentedControlSize } from '../OrSegme
 export { s as OrSelect } from '../OrSelect-e1d4b56c.js';
 export { s as OrSelectV3 } from '../OrSelect-a91d6ba8.js';
 export { s as OrSidebar, O as OrSidebarSide } from '../OrSidebar-4ab42b93.js';
-export { s as OrSidebarV3, S as SidebarPlacement } from '../props-bf1720eb.js';
+export { s as OrSidebarV3, S as SidebarPlacement } from '../props-90e4459c.js';
 export { s as OrSkeletonCircle } from '../OrSkeletonCircle-66e175a0.js';
 export { s as OrSkeletonRect } from '../OrSkeletonRect-c694574e.js';
 export { s as OrSkeletonText } from '../OrSkeletonText-69827192.js';

package/dist/esm/v3/components/or-resizeable-panel-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../../OrResizeablePanel-6e37ca25.js';
+export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from '../../OrResizeablePanel-ba37bdc3.js';
 import '@vueuse/core';
 import 'vue-demi';
 import '../../dom-53c9635b.js';

package/dist/esm/v3/components/or-sidebar-v3/index.js

@@ -1,4 +1,4 @@
-export { s as OrSidebarV3, S as SidebarPlacement } from '../../props-bf1720eb.js';
+export { s as OrSidebarV3, S as SidebarPlacement } from '../../props-90e4459c.js';
 import 'vue-demi';
 import '../../dom-53c9635b.js';
 import 'lodash/get';
@@ -8,7 +8,7 @@ import '../../usePopoverState-5033b9cb.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import '../../TimeFormat-a7f5565b.js';
-import '../../OrResizeablePanel-6e37ca25.js';
+import '../../OrResizeablePanel-ba37bdc3.js';
 import '../../OrIconButton-525d873e.js';
 import '../../OrIcon-c446d072.js';
 import 'vue';

package/dist/esm/v3/index.js

@@ -95,7 +95,7 @@ export { s as OrRadioGroupV3 } from './OrRadioGroup-75519d7c.js';
 export { s as OrRadioV3 } from './OrRadio-370438a9.js';
 export { s as OrRangeSliderV3 } from './OrRangeSlider-820d0c22.js';
 export { s as OrRatingV3 } from './OrRating-2abf71bd.js';
-export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from './OrResizeablePanel-6e37ca25.js';
+export { s as OrResizeablePanelV3, R as ResizeablePanelPadding, a as ResizeablePanelPlacement } from './OrResizeablePanel-ba37bdc3.js';
 export { F as Formats, s as OrRichTextEditorV3 } from './OrRichTextEditor-9781c771.js';
 export { s as OrSearch } from './OrSearch-948c7f78.js';
 export { s as OrSearchV3 } from './OrSearch-a10f294f.js';
@@ -103,7 +103,7 @@ export { s as OrSegmentedControlV3, S as SegmentedControlSize } from './OrSegmen
 export { s as OrSelect } from './OrSelect-e1d4b56c.js';
 export { s as OrSelectV3 } from './OrSelect-a91d6ba8.js';
 export { s as OrSidebar, O as OrSidebarSide } from './OrSidebar-4ab42b93.js';
-export { s as OrSidebarV3, S as SidebarPlacement } from './props-bf1720eb.js';
+export { s as OrSidebarV3, S as SidebarPlacement } from './props-90e4459c.js';
 export { s as OrSkeletonCircle } from './OrSkeletonCircle-66e175a0.js';
 export { s as OrSkeletonRect } from './OrSkeletonRect-c694574e.js';
 export { s as OrSkeletonText } from './OrSkeletonText-69827192.js';

package/dist/esm/v3/{props-bf1720eb.js → props-90e4459c.js}

@@ -5,7 +5,7 @@ import { u as usePopoverState } from './usePopoverState-5033b9cb.js';
 import '@onereach/styles/tailwind/plugins/core';
 import '@onereach/styles/tailwind.config.json';
 import './TimeFormat-a7f5565b.js';
-import { R as ResizeablePanelPadding, s as script$1 } from './OrResizeablePanel-6e37ca25.js';
+import { R as ResizeablePanelPadding, s as script$1 } from './OrResizeablePanel-ba37bdc3.js';
 import { resolveComponent, openBlock, createBlock, createSlots, withCtx, createElementVNode, normalizeClass, createElementBlock, renderSlot, createCommentVNode } from 'vue';
 
 const Sidebar = [

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onereach/ui-components",
-  "version": "10.3.3",
+  "version": "10.3.4-beta.4320.0",
   "npmUnpacked": "4.15.2",
   "description": "Vue components library for v2/3",
   "sideEffects": false,
@@ -179,6 +179,5 @@
       "default": "./dist/bundled/v3/components/*/index.js"
     },
     "./package.json": "./package.json"
-  },
-  "gitHead": "706e8906c85af44995a46cd43aed41c8c9c197a5"
+  }
 }

package/src/components/or-resizeable-panel-v3/styles.ts

@@ -125,11 +125,9 @@ export const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement
     // Interactivity
     'interactivity-resize-row',
 
-    // Box
-    'h-[calc(theme(spacing.md)+1px)]',
-
     // Spacing
     '-my-[calc(theme(spacing.md)/2)]',
+    'py-[calc(theme(spacing.md)/2)]',
 
     // Theme (after)
     'after:border-b-1',
@@ -142,11 +140,9 @@ export const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement
     // Interactivity
     'interactivity-resize-row',
 
-    // Box
-    'h-[calc(theme(spacing.md)+1px)]',
-
     // Spacing
     '-my-[calc(theme(spacing.md)/2)]',
+    'py-[calc(theme(spacing.md)/2)]',
 
     // Theme (after)
     'after:border-t-1',
@@ -159,11 +155,9 @@ export const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement
     // Interactivity
     'interactivity-resize-column',
 
-    // Box
-    'w-[calc(theme(spacing.md)+1px)]',
-
     // Spacing
     '-mx-[calc(theme(spacing.md)/2)]',
+    'px-[calc(theme(spacing.md)/2)]',
 
     // Theme (after)
     'after:border-r-1',
@@ -176,11 +170,9 @@ export const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement
     // Interactivity
     'interactivity-resize-column',
 
-    // Box
-    'w-[calc(theme(spacing.md)+1px)]',
-
     // Spacing
     '-mx-[calc(theme(spacing.md)/2)]',
+    'px-[calc(theme(spacing.md)/2)]',
 
     // Theme (after)
     'after:border-l-1',
@@ -189,7 +181,7 @@ export const ResizeablePanelResizeBarPlacements: Record<ResizeablePanelPlacement
 
 export const ResizeablePanelCollapseButtonContainer: string[] = [
   // Position
-  'relative z-10',
+  'absolute z-10',
 
   // Shape
   'rounded-full',
@@ -213,33 +205,37 @@ export const ResizeablePanelCollapseButtonContainerPlacements: Record<Resizeable
   [ResizeablePanelPlacement.Top]: [
     // Position
     'left-md',
+    'bottom-0',
 
-    // Spacing
-    '-my-[calc(theme(spacing.md)-2px)]',
+    // Transform
+    'translate-y-1/2',
   ],
 
   [ResizeablePanelPlacement.Bottom]: [
     // Position
     'left-md',
+    'top-0',
 
-    // Spacing
-    '-my-[calc(theme(spacing.md)-2px)]',
+    // Transform
+    '-translate-y-1/2',
   ],
 
   [ResizeablePanelPlacement.Left]: [
     // Position
     'top-md',
+    'right-0',
 
-    // Spacing
-    '-mx-[calc(theme(spacing.md)-2px)]',
+    // Transform
+    'translate-x-1/2',
   ],
 
   [ResizeablePanelPlacement.Right]: [
     // Position
     'top-md',
+    'left-0',
 
-    // Spacing
-    '-mx-[calc(theme(spacing.md)-2px)]',
+    // Transform
+    '-translate-x-1/2',
   ],
 };