@onereach/ui-components 8.1.0-beta.3605.0 → 8.1.0

package/dist/esm/v2/OrResizeablePanel-5e6fe9b7.js

@@ -1,65 +0,0 @@
-import { s as script } from './OrResizeablePanel.vue_rollup-plugin-vue_script-69f831ae.js';
-import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {
-  var _obj;
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c('div', {
-    ref: 'root',
-    class: _vm.rootStyles,
-    style: (_obj = {}, _obj[_vm.currentDirection] = !_vm.collapsible || _vm.state === 'open' ? _vm.currentSize + "px" : 'auto', _obj)
-  }, [!_vm.collapsible || _vm.state === 'open' ? [_c('div', {
-    class: _vm.contentStyles
-  }, [_vm._t("default")], 2)] : [_c('div', {
-    class: _vm.contentPlaceholderStyles
-  })], _vm._v(" "), _c('div', {
-    ref: 'resizeBar',
-    class: _vm.resizeBarStyles,
-    attrs: {
-      "activated": _vm.isDragging ? '' : null
-    }
-  }), _vm._v(" "), _vm.collapsible ? [_c('div', {
-    class: _vm.collapseButtonContainerStyles
-  }, [_c('OrIconButton', {
-    attrs: {
-      "icon": _vm.collapseButtonIcon,
-      "color": 'primary',
-      "size": 'xl'
-    },
-    on: {
-      "click": function ($event) {
-        return _vm.toggle();
-      }
-    }
-  })], 1)] : _vm._e(), _vm._v(" "), _vm.$slots.toolbar ? [_c('div', {
-    class: _vm.toolbarStyles
-  }, [_vm._t("toolbar")], 2)] : _vm._e()], 2);
-};
-var __vue_staticRenderFns__ = [];
-
-/* style */
-const __vue_inject_styles__ = undefined;
-/* scoped */
-const __vue_scope_id__ = undefined;
-/* module identifier */
-const __vue_module_identifier__ = undefined;
-/* functional template */
-const __vue_is_functional_template__ = false;
-/* style inject */
-
-/* style inject SSR */
-
-/* style inject shadow dom */
-
-const __vue_component__ = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__,
-  staticRenderFns: __vue_staticRenderFns__
-}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
-
-export { __vue_component__ as _ };

package/dist/esm/v2/components/or-sidebar-v3/partials/index.d.ts

@@ -1 +0,0 @@
-export { default as OrSidebarCollapseButton } from './or-sidebar-collapse-button/OrSidebarCollapseButton.vue';

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

@@ -1,139 +0,0 @@
-import { defineComponent, ref, computed } from 'vue-demi';
-import { _ as __vue_component__$1 } from '../../../OrIconButton-29a22ef8.js';
-import { S as SidebarPlacement } from '../../../props-e9140ae3.js';
-import { n as normalizeComponent } from '../../../normalize-component-6e8e3d80.js';
-import '../../../OrIcon-0343b3d8.js';
-import '../../../OrTooltip-b01c6ab1.js';
-import '@vueuse/core';
-import '../../../dom-aecadd9a.js';
-import 'lodash/isElement';
-import 'lodash/get';
-import '../../../usePopoverState-b92c698b.js';
-import '@onereach/styles/tailwind/plugins/core';
-import '@onereach/styles/tailwind.config.json';
-import '../../../OrPopover-2ced765c.js';
-import '@floating-ui/dom';
-import '../../../useElevation-a50ec347.js';
-import '../../../useResponsive-5c8291da.js';
-import '../../../OrBottomSheet-d95dd23d.js';
-import '../../../OrOverlay-868d1120.js';
-import '../../../OrTeleport.vue2-424c7f33.js';
-import 'portal-vue';
-import '../../../useTheme-0ef25778.js';
-import '../../../OrResizeablePanel.vue_rollup-plugin-vue_script-69f831ae.js';
-
-const CollapseButton = [
-// Box
-'w-[24px]', 'h-[24px]', 'rounded-full',
-// Theme
-'text-primary dark:text-primary-dark', 'bg-background dark:bg-background-dark'];
-const CollapseButtonButton = [
-// Box
-'w-[24px]', 'h-[24px]', 'rounded-full',
-// Typography
-'!text-[16px]',
-// Borders
-'!border-[1px]', '!border-solid',
-// Theme
-'!text-primary dark:!text-primary-dark', '!bg-background dark:!bg-background-dark', '!border-outline-variant dark:!border-outline-variant-dark', '!outline-none',
-// Theme (hover)
-'hover:!text-primary hover:dark:!text-primary-dark', 'hover:!bg-primary-opacity-0-08 dark:hover:!bg-primary-opacity-0-08-dark', 'hover:!border-outline dark:hover:!border-outline-dark',
-// Theme (active)
-'active:!text-primary active:dark:!text-primary-dark', 'active:!bg-primary-opacity-0-12 dark:active:!bg-primary-opacity-0-12-dark', 'active:!border-primary dark:active:!border-primary-dark',
-// Theme (focus)
-'focus-visible:!text-primary focus-visible:dark:!text-primary-dark', 'focus-visible:!bg-primary-opacity-0-12 dark:focus-visible:!bg-primary-opacity-0-12-dark', 'focus-visible:!border-outline dark:focus-visible:!border-outline-dark',
-// Theme (disabled)
-'disabled:!text-on-disabled disabled:dark:!text-on-disabled-dark', 'disabled:!bg-background disabled:dark:!bg-background-dark', 'disabled:!border-outline-variant disabled:dark:!border-outline-variant-dark'];
-
-var script = defineComponent({
-  name: 'OrSidebarCollapseButton',
-  components: {
-    OrIconButton: __vue_component__$1
-  },
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-      type: Boolean,
-      default: false
-    },
-    side: {
-      type: String,
-      default: SidebarPlacement.Right
-    }
-  },
-  emits: ['update:modelValue'],
-  expose: ['root'],
-  setup(props) {
-    // Refs
-    const root = ref();
-    const rootStyles = computed(() => ['or-sidebar-collapse-button-v3', ...CollapseButton]);
-    const buttonStyles = computed(() => [...CollapseButtonButton]);
-    // State
-    const icon = computed(() => {
-      return props.side === SidebarPlacement.Left !== props.modelValue ? 'keyboard_arrow_left' : 'keyboard_arrow_right';
-    });
-    return {
-      root,
-      rootStyles,
-      buttonStyles,
-      icon
-    };
-  }
-});
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _c('div', {
-    ref: "root",
-    class: _vm.rootStyles
-  }, [_c('OrIconButton', {
-    attrs: {
-      "additional-styles": _vm.buttonStyles,
-      "icon": {
-        icon: _vm.icon,
-        size: 'inherit'
-      },
-      "color": 'inherit'
-    },
-    on: {
-      "click": function ($event) {
-        $event.stopPropagation();
-        return _vm.$emit('update:modelValue', !_vm.modelValue);
-      }
-    }
-  })], 1);
-};
-var __vue_staticRenderFns__ = [];
-
-/* style */
-const __vue_inject_styles__ = undefined;
-/* scoped */
-const __vue_scope_id__ = undefined;
-/* module identifier */
-const __vue_module_identifier__ = undefined;
-/* functional template */
-const __vue_is_functional_template__ = false;
-/* style inject */
-
-/* style inject SSR */
-
-/* style inject shadow dom */
-
-const __vue_component__ = /*#__PURE__*/normalizeComponent({
-  render: __vue_render__,
-  staticRenderFns: __vue_staticRenderFns__
-}, __vue_inject_styles__, __vue_script__, __vue_scope_id__, __vue_is_functional_template__, __vue_module_identifier__, false, undefined, undefined, undefined);
-
-export { __vue_component__ as OrSidebarCollapseButton };

package/dist/esm/v2/components/or-sidebar-v3/partials/or-sidebar-collapse-button/OrSidebarCollapseButton.vue.d.ts

@@ -1,51 +0,0 @@
-import { PropType } from 'vue-demi';
-import { SidebarPlacement } from '../../props';
-declare const _default: import("vue").ComponentOptions<import("vue").default, import("@vue/composition-api").ShallowUnwrapRef<{
-    root: import("@vue/composition-api").Ref<HTMLDivElement | undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    buttonStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    icon: import("@vue/composition-api").ComputedRef<"keyboard_arrow_left" | "keyboard_arrow_right">;
-}> & import("@vue/composition-api").Data, {}, {}, {
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    side: {
-        type: PropType<"left" | "right">;
-        default: SidebarPlacement;
-    };
-}, import("@vue/composition-api").ExtractPropTypes<{
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    side: {
-        type: PropType<"left" | "right">;
-        default: SidebarPlacement;
-    };
-}>> & Omit<import("vue").VueConstructor<import("vue").default>, never> & (new (...args: any[]) => import("@vue/composition-api").ComponentRenderProxy<{
-    modelValue: boolean;
-    side: "left" | "right";
-} & {} & {
-    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, import("@vue/composition-api").ShallowUnwrapRef<{
-    root: import("@vue/composition-api").Ref<HTMLDivElement | undefined>;
-    rootStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    buttonStyles: import("@vue/composition-api").ComputedRef<string[]>;
-    icon: import("@vue/composition-api").ComputedRef<"keyboard_arrow_left" | "keyboard_arrow_right">;
-}>, import("@vue/composition-api").Data, {}, {}, {}, {}, string[], {
-    modelValue: boolean;
-    side: "left" | "right";
-} & {} & {
-    [x: `on${Capitalize<string>}`]: ((...args: any[]) => any) | undefined;
-}, {
-    modelValue: boolean;
-    side: "left" | "right";
-}, true>);
-export default _default;

package/dist/esm/v2/components/or-sidebar-v3/partials/or-sidebar-collapse-button/styles.d.ts

@@ -1,2 +0,0 @@
-export declare const CollapseButton: string[];
-export declare const CollapseButtonButton: string[];

package/dist/esm/v2/props-e9140ae3.js

@@ -1,9 +0,0 @@
-import './OrResizeablePanel.vue_rollup-plugin-vue_script-69f831ae.js';
-
-var SidebarPlacement;
-(function (SidebarPlacement) {
-  SidebarPlacement["Left"] = "left";
-  SidebarPlacement["Right"] = "right";
-})(SidebarPlacement || (SidebarPlacement = {}));
-
-export { SidebarPlacement as S };

package/dist/esm/v3/components/or-sidebar-v3/partials/index.d.ts

@@ -1 +0,0 @@
-export { default as OrSidebarCollapseButton } from './or-sidebar-collapse-button/OrSidebarCollapseButton.vue';

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

@@ -1,108 +0,0 @@
-import { defineComponent, ref, computed } from 'vue-demi';
-import { s as script$1 } from '../../../OrIconButton-a55f5ac0.js';
-import { S as SidebarPlacement } from '../../../props-aedf339b.js';
-import { resolveComponent, openBlock, createElementBlock, normalizeClass, createVNode, withModifiers } from 'vue';
-import '../../../OrIcon-8f6c9c29.js';
-import '../../../OrTooltip-bdd46da2.js';
-import '@vueuse/core';
-import '../../../dom-aecadd9a.js';
-import 'lodash/isElement';
-import 'lodash/get';
-import '../../../usePopoverState-b92c698b.js';
-import '@onereach/styles/tailwind/plugins/core';
-import '@onereach/styles/tailwind.config.json';
-import '../../../OrPopover-3b07d49e.js';
-import '@floating-ui/dom';
-import '../../../useElevation-a50ec347.js';
-import '../../../useResponsive-5c8291da.js';
-import '../../../OrBottomSheet-375aa75c.js';
-import '../../../OrOverlay-6269c33a.js';
-import '../../../OrTeleport.vue3-8099178c.js';
-import '../../../useTheme-0ef25778.js';
-import '../../../OrResizeablePanel-81a57c7a.js';
-
-const CollapseButton = [
-// Box
-'w-[24px]', 'h-[24px]', 'rounded-full',
-// Theme
-'text-primary dark:text-primary-dark', 'bg-background dark:bg-background-dark'];
-const CollapseButtonButton = [
-// Box
-'w-[24px]', 'h-[24px]', 'rounded-full',
-// Typography
-'!text-[16px]',
-// Borders
-'!border-[1px]', '!border-solid',
-// Theme
-'!text-primary dark:!text-primary-dark', '!bg-background dark:!bg-background-dark', '!border-outline-variant dark:!border-outline-variant-dark', '!outline-none',
-// Theme (hover)
-'hover:!text-primary hover:dark:!text-primary-dark', 'hover:!bg-primary-opacity-0-08 dark:hover:!bg-primary-opacity-0-08-dark', 'hover:!border-outline dark:hover:!border-outline-dark',
-// Theme (active)
-'active:!text-primary active:dark:!text-primary-dark', 'active:!bg-primary-opacity-0-12 dark:active:!bg-primary-opacity-0-12-dark', 'active:!border-primary dark:active:!border-primary-dark',
-// Theme (focus)
-'focus-visible:!text-primary focus-visible:dark:!text-primary-dark', 'focus-visible:!bg-primary-opacity-0-12 dark:focus-visible:!bg-primary-opacity-0-12-dark', 'focus-visible:!border-outline dark:focus-visible:!border-outline-dark',
-// Theme (disabled)
-'disabled:!text-on-disabled disabled:dark:!text-on-disabled-dark', 'disabled:!bg-background disabled:dark:!bg-background-dark', 'disabled:!border-outline-variant disabled:dark:!border-outline-variant-dark'];
-
-var script = defineComponent({
-  name: 'OrSidebarCollapseButton',
-  components: {
-    OrIconButton: script$1
-  },
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-      type: Boolean,
-      default: false
-    },
-    side: {
-      type: String,
-      default: SidebarPlacement.Right
-    }
-  },
-  emits: ['update:modelValue'],
-  expose: ['root'],
-  setup(props) {
-    // Refs
-    const root = ref();
-    const rootStyles = computed(() => ['or-sidebar-collapse-button-v3', ...CollapseButton]);
-    const buttonStyles = computed(() => [...CollapseButtonButton]);
-    // State
-    const icon = computed(() => {
-      return props.side === SidebarPlacement.Left !== props.modelValue ? 'keyboard_arrow_left' : 'keyboard_arrow_right';
-    });
-    return {
-      root,
-      rootStyles,
-      buttonStyles,
-      icon
-    };
-  }
-});
-
-function render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_OrIconButton = resolveComponent("OrIconButton");
-  return openBlock(), createElementBlock("div", {
-    ref: "root",
-    class: normalizeClass(_ctx.rootStyles)
-  }, [createVNode(_component_OrIconButton, {
-    "additional-styles": _ctx.buttonStyles,
-    icon: {
-      icon: _ctx.icon,
-      size: 'inherit'
-    },
-    color: 'inherit',
-    onClick: _cache[0] || (_cache[0] = withModifiers($event => _ctx.$emit('update:modelValue', !_ctx.modelValue), ["stop"]))
-  }, null, 8 /* PROPS */, ["additional-styles", "icon"])], 2 /* CLASS */);
-}
-
-script.render = render;
-script.__file = "src/components/or-sidebar-v3/partials/or-sidebar-collapse-button/OrSidebarCollapseButton.vue";
-
-export { script as OrSidebarCollapseButton };

package/dist/esm/v3/components/or-sidebar-v3/partials/or-sidebar-collapse-button/OrSidebarCollapseButton.vue.d.ts

@@ -1,38 +0,0 @@
-import { PropType } from 'vue-demi';
-import { SidebarPlacement } from '../../props';
-declare const _default: import("vue-demi").DefineComponent<{
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    side: {
-        type: PropType<"left" | "right">;
-        default: SidebarPlacement;
-    };
-}, {
-    root: import("vue-demi").Ref<HTMLDivElement | undefined>;
-    rootStyles: import("vue-demi").ComputedRef<string[]>;
-    buttonStyles: import("vue-demi").ComputedRef<string[]>;
-    icon: import("vue-demi").ComputedRef<"keyboard_arrow_left" | "keyboard_arrow_right">;
-}, unknown, {}, {}, import("vue-demi").ComponentOptionsMixin, import("vue-demi").ComponentOptionsMixin, "update:modelValue"[], "update:modelValue", import("vue-demi").VNodeProps & import("vue-demi").AllowedComponentProps & import("vue-demi").ComponentCustomProps, Readonly<import("vue-demi").ExtractPropTypes<{
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-        type: BooleanConstructor;
-        default: boolean;
-    };
-    side: {
-        type: PropType<"left" | "right">;
-        default: SidebarPlacement;
-    };
-}>> & {
-    "onUpdate:modelValue"?: ((...args: any[]) => any) | undefined;
-}, {
-    modelValue: boolean;
-    side: "left" | "right";
-}>;
-export default _default;

package/dist/esm/v3/components/or-sidebar-v3/partials/or-sidebar-collapse-button/styles.d.ts

@@ -1,2 +0,0 @@
-export declare const CollapseButton: string[];
-export declare const CollapseButtonButton: string[];

package/dist/esm/v3/props-aedf339b.js

@@ -1,9 +0,0 @@
-import './OrResizeablePanel-81a57c7a.js';
-
-var SidebarPlacement;
-(function (SidebarPlacement) {
-  SidebarPlacement["Left"] = "left";
-  SidebarPlacement["Right"] = "right";
-})(SidebarPlacement || (SidebarPlacement = {}));
-
-export { SidebarPlacement as S };

package/src/components/or-sidebar-v3/partials/index.ts

@@ -1 +0,0 @@
-export { default as OrSidebarCollapseButton } from './or-sidebar-collapse-button/OrSidebarCollapseButton.vue';

package/src/components/or-sidebar-v3/partials/or-sidebar-collapse-button/OrSidebarCollapseButton.vue

@@ -1,84 +0,0 @@
-<template>
-  <div
-    ref="root"
-    :class="rootStyles"
-  >
-    <OrIconButton
-      :additional-styles="buttonStyles"
-      :icon="{ icon, size: 'inherit' }"
-      :color="'inherit'"
-      @click.stop="$emit('update:modelValue', !modelValue)"
-    />
-  </div>
-</template>
-
-<script lang="ts">
-import { computed, defineComponent, PropType, ref } from 'vue-demi';
-import { OrIconButtonV3 as OrIconButton } from '../../../or-icon-button-v3';
-import { SidebarPlacement } from '../../props';
-import { CollapseButton, CollapseButtonButton } from './styles';
-
-export default defineComponent({
-  name: 'OrSidebarCollapseButton',
-
-  components: {
-    OrIconButton,
-  },
-
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue',
-  },
-
-  props: {
-    /**
-     * Must be `true` if sidebar is collapsed.
-     */
-    modelValue: {
-      type: Boolean,
-      default: false,
-    },
-
-    side: {
-      type: String as PropType<`${SidebarPlacement}`>,
-      default: SidebarPlacement.Right,
-    },
-  },
-
-  emits: [
-    'update:modelValue',
-  ],
-
-  expose: [
-    'root',
-  ],
-
-  setup(props) {
-    // Refs
-    const root = ref<InstanceType<typeof HTMLDivElement>>();
-
-    const rootStyles = computed(() => [
-      'or-sidebar-collapse-button-v3',
-      ...CollapseButton,
-    ]);
-
-    const buttonStyles = computed(() => [
-      ...CollapseButtonButton,
-    ]);
-
-    // State
-    const icon = computed(() => {
-      return props.side === SidebarPlacement.Left !== props.modelValue
-        ? 'keyboard_arrow_left'
-        : 'keyboard_arrow_right';
-    });
-
-    return {
-      root,
-      rootStyles,
-      buttonStyles,
-      icon,
-    };
-  },
-});
-</script>

package/src/components/or-sidebar-v3/partials/or-sidebar-collapse-button/styles.ts

@@ -1,50 +0,0 @@
-export const CollapseButton: string[] = [
-  // Box
-  'w-[24px]',
-  'h-[24px]',
-  'rounded-full',
-
-  // Theme
-  'text-primary dark:text-primary-dark',
-  'bg-background dark:bg-background-dark',
-];
-
-export const CollapseButtonButton: string[] = [
-  // Box
-  'w-[24px]',
-  'h-[24px]',
-  'rounded-full',
-
-  // Typography
-  '!text-[16px]',
-
-  // Borders
-  '!border-[1px]',
-  '!border-solid',
-
-  // Theme
-  '!text-primary dark:!text-primary-dark',
-  '!bg-background dark:!bg-background-dark',
-  '!border-outline-variant dark:!border-outline-variant-dark',
-  '!outline-none',
-
-  // Theme (hover)
-  'hover:!text-primary hover:dark:!text-primary-dark',
-  'hover:!bg-primary-opacity-0-08 dark:hover:!bg-primary-opacity-0-08-dark',
-  'hover:!border-outline dark:hover:!border-outline-dark',
-
-  // Theme (active)
-  'active:!text-primary active:dark:!text-primary-dark',
-  'active:!bg-primary-opacity-0-12 dark:active:!bg-primary-opacity-0-12-dark',
-  'active:!border-primary dark:active:!border-primary-dark',
-
-  // Theme (focus)
-  'focus-visible:!text-primary focus-visible:dark:!text-primary-dark',
-  'focus-visible:!bg-primary-opacity-0-12 dark:focus-visible:!bg-primary-opacity-0-12-dark',
-  'focus-visible:!border-outline dark:focus-visible:!border-outline-dark',
-
-  // Theme (disabled)
-  'disabled:!text-on-disabled disabled:dark:!text-on-disabled-dark',
-  'disabled:!bg-background disabled:dark:!bg-background-dark',
-  'disabled:!border-outline-variant disabled:dark:!border-outline-variant-dark',
-];