@onereach/ui-components 2.68.0-beta.2003.0 → 2.68.0-beta.2008.0

package/dist/bundled/{v2/OrModal-a5411b0d.js → v3/useFocusTrap-d21726e3.js}

@@ -1,20 +1,5 @@
-import './index-fa6eb4ca.js';
-import _ from 'lodash';
-import { unrefElement, tryOnScopeDispose, onClickOutside } from '@vueuse/core';
-import { ref, watch, defineComponent, onBeforeUnmount } from '@vue/composition-api/dist/vue-composition-api.mjs';
-import { O as OrIconButton } from './OrIconButton-65962c1c.js';
-import { O as OrOverlay } from './OrOverlay-47967a8b.js';
-import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
-import { c as createInjector } from './browser-82dea9ed.js';
-
-var OrModalSizes;
-(function (OrModalSizes) {
-  OrModalSizes["tiny"] = "tiny";
-  OrModalSizes["small"] = "small";
-  OrModalSizes["medium"] = "medium";
-  OrModalSizes["large"] = "large";
-  OrModalSizes["fullScreen"] = "fullScreen";
-})(OrModalSizes || (OrModalSizes = {}));
+import { unrefElement, tryOnScopeDispose } from '@vueuse/core';
+import { ref, watch } from 'vue';
 
 /*!
 * tabbable 6.0.1
@@ -1280,186 +1265,4 @@ function useFocusTrap(target, options = {}) {
   };
 }
 
-var script = defineComponent({
-  name: 'OrModal',
-  components: {
-    OrIconButton,
-    OrOverlay
-  },
-  props: {
-    titleText: {
-      type: String,
-      required: false,
-      default: null,
-      validator: _.isString
-    },
-    showClose: {
-      type: Boolean,
-      default: true,
-      validator: _.isBoolean
-    },
-    closeOnClickOutside: {
-      type: Boolean,
-      required: false,
-      default: false,
-      validator: _.isBoolean
-    },
-    size: {
-      type: String,
-      required: false,
-      default: OrModalSizes.small
-    },
-    isOpen: {
-      type: Boolean,
-      required: true,
-      validator: _.isBoolean
-    },
-    isWithoutOverlay: {
-      type: Boolean,
-      required: false,
-      default: false,
-      validator: _.isBoolean
-    },
-    trapFocus: {
-      type: Boolean,
-      default: true,
-      validator: _.isBoolean
-    }
-  },
-  emits: ['close'],
-  setup(props, {
-    emit
-  }) {
-    const overlay = ref();
-    let container = ref(null);
-    let trap = useFocusTrap(container, {
-      immediate: props.trapFocus,
-      fallbackFocus: '.container',
-      allowOutsideClick: true
-    });
-    const handleClose = () => emit('close');
-    onClickOutside(container, evt => {
-      if (!evt.composedPath().includes(overlay.value.$el)) return;
-      if (props.closeOnClickOutside) handleClose();
-    });
-    const toggleFocusTrap = isNeedToTrap => {
-      if (isNeedToTrap && props.isOpen) {
-        trap.activate();
-      } else {
-        trap === null || trap === void 0 ? void 0 : trap.deactivate();
-      }
-    };
-    watch(() => props.trapFocus, toggleFocusTrap, {
-      immediate: true
-    });
-    watch(() => props.isOpen, isOpen => {
-      toggleFocusTrap(false);
-      if (isOpen) {
-        container = ref(null);
-      } else {
-        trap === null || trap === void 0 ? void 0 : trap.deactivate();
-      }
-    });
-    onBeforeUnmount(() => {
-      trap === null || trap === void 0 ? void 0 : trap.deactivate();
-    });
-    return {
-      container,
-      overlay,
-      handleClose
-    };
-  },
-  computed: {
-    sizeClass() {
-      return `is-${this.size}`;
-    }
-  }
-});
-
-/* script */
-const __vue_script__ = script;
-
-/* template */
-var __vue_render__ = function () {
-  var _vm = this;
-  var _h = _vm.$createElement;
-  var _c = _vm._self._c || _h;
-  return _vm.isOpen ? _c('div', {
-    staticClass: "or-modal"
-  }, [_c('or-overlay', {
-    ref: "overlay",
-    attrs: {
-      "is-active": "",
-      "is-without-background": _vm.isWithoutOverlay
-    }
-  }, [_c('div', {
-    ref: "container",
-    class: [_vm.sizeClass, 'container', {
-      'is-without-overlay': _vm.isWithoutOverlay
-    }]
-  }, [_vm._t("header", function () {
-    return [_c('div', {
-      staticClass: "header"
-    }, [_vm._t("title", function () {
-      return [_c('div', {
-        staticClass: "title"
-      }, [_vm._v("\n              " + _vm._s(_vm.titleText) + "\n            ")])];
-    }), _vm._v(" "), _c('or-icon-button', {
-      directives: [{
-        name: "show",
-        rawName: "v-show",
-        value: _vm.showClose,
-        expression: "showClose"
-      }],
-      attrs: {
-        "icon": "close",
-        "icon-color": "neutral-6"
-      },
-      on: {
-        "click": _vm.handleClose
-      }
-    })], 2)];
-  }), _vm._v(" "), _vm._t("content", function () {
-    return [_c('div', {
-      staticClass: "content"
-    }, [_vm._t("default")], 2)];
-  }), _vm._v(" "), _c('div', {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.$slots.footer,
-      expression: "$slots.footer"
-    }],
-    staticClass: "footer"
-  }, [_vm._t("footer", null, {
-    "close": _vm.handleClose
-  })], 2)], 2)])], 1) : _vm._e();
-};
-var __vue_staticRenderFns__ = [];
-
-/* style */
-const __vue_inject_styles__ = function (inject) {
-  if (!inject) return;
-  inject("data-v-1caff449_0", {
-    source: "@keyframes spinAround-data-v-1caff449{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-1caff449{from{opacity:1}to{opacity:0}}.or-modal[data-v-1caff449]{position:fixed;top:0;left:0;z-index:50;width:100%;height:100%}.or-modal .or-overlay[data-v-1caff449]{align-items:center;justify-content:center}.or-modal .container[data-v-1caff449]{position:absolute;display:flex;flex-flow:column;max-width:100%;max-height:80%;background-color:var(--c-neutral-0);border-radius:var(--s-2);outline:0}.or-modal .container.is-without-overlay[data-v-1caff449]{box-shadow:0 .125rem .5rem 0 rgba(0,0,0,.1)}.or-modal .container.is-fullScreen[data-v-1caff449]{width:calc(100% - var(--s-7));height:calc(100% - var(--s-7));max-height:calc(100% - var(--s-7));margin:0 auto}.or-modal .container.is-tiny[data-v-1caff449]{width:320px}.or-modal .container.is-small[data-v-1caff449]{width:480px}.or-modal .container.is-medium[data-v-1caff449]{width:700px}.or-modal .container.is-large[data-v-1caff449]{width:1049px}.or-modal .container .header[data-v-1caff449]{display:flex;justify-content:space-between;padding:24px 24px 20px 24px;border-radius:var(--s-2) var(--s-2) 0 0}.or-modal .container .header .title[data-v-1caff449]{font-size:1.125rem;font-weight:700}.or-modal .container .content[data-v-1caff449]{flex-grow:1;padding:0 24px 24px 24px;overflow:auto}.or-modal .container .footer[data-v-1caff449]{padding:16px 24px 24px 24px;border-radius:0 0 var(--s-2) var(--s-2);box-shadow:0 -3px 4px 0 rgba(0,0,0,.08)}",
-    map: undefined,
-    media: undefined
-  });
-};
-/* scoped */
-const __vue_scope_id__ = "data-v-1caff449";
-/* module identifier */
-const __vue_module_identifier__ = undefined;
-/* functional template */
-const __vue_is_functional_template__ = false;
-/* 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, createInjector, undefined, undefined);
-var OrModal = __vue_component__;
-
-export { OrModal as O, OrModalSizes as a };
+export { useFocusTrap as u };