@onereach/ui-components 2.65.2-beta.1975.0 → 2.66.0

package/dist/v2/OrCode-da64b7ee.js

@@ -1,384 +0,0 @@
-import { EditorState } from '@codemirror/state';
-import { useElementHover } from '@vueuse/core';
-import { basicSetup, EditorView } from 'codemirror';
-import _ from 'lodash';
-import { defineComponent, ref } from 'vue-demi';
-import './OrIconButton.vue_rollup-plugin-vue_styles.0-dc224e53.js';
-import { _ as __vue_component__$1 } from './OrIconButton-cab39659.js';
-import { _ as __vue_component__$4 } from './OrError-efc74907.js';
-import { _ as __vue_component__$5 } from './OrHint-fe65fbe6.js';
-import { _ as __vue_component__$6 } from './OrLabel-931394a5.js';
-import { _ as __vue_component__$2 } from './OrModal-5c491f46.js';
-import { _ as __vue_component__$3 } from './OrTeleportVue2-fce4676d.js';
-import { html } from '@codemirror/lang-html';
-import { css } from '@codemirror/lang-css';
-import { json } from '@codemirror/lang-json';
-import { javascript } from '@codemirror/lang-javascript';
-import { markdown } from '@codemirror/lang-markdown';
-import { s as styleInject } from './style-inject.es-4c6f2515.js';
-import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
-
-var OrCodeLanguages;
-(function (OrCodeLanguages) {
-  OrCodeLanguages["JS"] = "javascript";
-  OrCodeLanguages["TS"] = "typescript";
-  OrCodeLanguages["CSS"] = "css";
-  OrCodeLanguages["HTML"] = "html";
-  OrCodeLanguages["JSON"] = "json";
-  OrCodeLanguages["MD"] = "markdown";
-})(OrCodeLanguages || (OrCodeLanguages = {}));
-
-const JS = javascript({
-  typescript: false
-});
-const TS = javascript({
-  typescript: true
-});
-const CSS = css();
-const HTML = html();
-const JSON = json();
-const MD = markdown();
-var languages = {
-  [OrCodeLanguages.JS]: JS,
-  [OrCodeLanguages.TS]: TS,
-  [OrCodeLanguages.CSS]: CSS,
-  [OrCodeLanguages.HTML]: HTML,
-  [OrCodeLanguages.JSON]: JSON,
-  [OrCodeLanguages.MD]: MD
-};
-
-//partially based on https://github.com/logue/vue-codemirror6/blob/master/src/components/CodeMirror.vue
-var script = defineComponent({
-  name: 'OrCode',
-  components: {
-    OrIconButton: __vue_component__$1,
-    OrModal: __vue_component__$2,
-    OrTeleport: __vue_component__$3,
-    OrError: __vue_component__$4,
-    OrHint: __vue_component__$5,
-    OrLabel: __vue_component__$6
-  },
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    label: {
-      type: String,
-      default: '',
-      required: false
-    },
-    modelValue: {
-      type: String,
-      default: '',
-      required: false
-    },
-    language: {
-      type: [Object, String],
-      required: false,
-      default: OrCodeLanguages.JS
-    },
-    isReadonly: {
-      type: Boolean,
-      required: false,
-      default: false
-    },
-    extensions: {
-      type: Array,
-      required: false,
-      default: () => [basicSetup]
-    },
-    phrases: {
-      type: Object,
-      required: false,
-      default: null
-    },
-    isShowingFullscreen: {
-      type: Boolean,
-      default: true,
-      required: false
-    },
-    isInvalid: {
-      type: Boolean,
-      default: false,
-      required: false
-    },
-    error: {
-      type: String,
-      default: '',
-      required: false
-    },
-    hint: {
-      type: String,
-      default: '',
-      required: false
-    },
-    allowPaste: {
-      type: Boolean,
-      default: true
-    },
-    allowDrop: {
-      type: Boolean,
-      default: true
-    },
-    lineWrapping: {
-      type: Boolean,
-      default: false
-    }
-  },
-  emits: ['update:modelValue', 'focus', 'blur'],
-  setup(props, {
-    emit
-  }) {
-    const root = ref();
-    const target = ref();
-    const fullscreenTarget = ref();
-    const isHovered = useElementHover(root);
-    const editor = new EditorView({
-      state: EditorState.create({
-        doc: props.modelValue
-      }),
-      dispatch: tr => {
-        editor.update([tr]);
-        if (tr.changes.empty) return;
-        emit('update:modelValue', editor.state.doc.toString());
-      }
-    });
-    return {
-      root,
-      target,
-      fullscreenTarget,
-      editor,
-      isHovered
-    };
-  },
-  data() {
-    return {
-      isFullscreen: false
-    };
-  },
-  computed: {
-    localLanguage() {
-      if (_.includes(_.values(OrCodeLanguages), this.language)) {
-        return languages[this.language];
-      } else {
-        return this.language;
-      }
-    },
-    localExtensions() {
-      const {
-        allowDrop,
-        allowPaste,
-        lineWrapping
-      } = this;
-      const ext = _.compact([
-      // Toggle light/dark mode
-      EditorView.baseTheme({}),
-      // locale settings
-      this.phrases ? EditorState.phrases.of(this.phrases) : undefined,
-      // Parser language setting
-      this.localLanguage,
-      // Editable option
-      EditorView.editable.of(!this.isReadonly),
-      // Focus and blur listener
-      EditorView.updateListener.of(viewUpdate => {
-        if (viewUpdate.focusChanged) {
-          viewUpdate.view.hasFocus ? this.$emit('focus') : this.$emit('blur', viewUpdate.state.doc.toString());
-        }
-      }), EditorView.domEventHandlers({
-        drop(event) {
-          if (!allowDrop) {
-            event.preventDefault();
-            return true;
-          }
-        },
-        paste(event) {
-          if (!allowPaste) {
-            event.preventDefault();
-            return true;
-          }
-        }
-      }),
-      // line wrapping
-      lineWrapping ? EditorView.lineWrapping : undefined]);
-      // Append Extensions (such as basic-setup)
-      if (this.extensions.length !== 0) _.merge(ext, this.extensions);
-      return ext;
-    },
-    isShowingError() {
-      return !!this.error && this.isInvalid;
-    },
-    isShowingHint() {
-      return !!this.hint && !this.isShowingError;
-    },
-    isShowingHeader() {
-      var _a;
-      return this.isShowingFullscreen || this.$slots.label || this.$slots.actions || ((_a = this.$scopedSlots) === null || _a === void 0 ? void 0 : _a.actions);
-    }
-  },
-  watch: {
-    modelValue(value) {
-      if (this.editor.composing) return;
-      if (this.editor.state.doc.toString() === value) return;
-      const previous = this.editor.state.selection;
-      this.editor.setState(EditorState.create({
-        doc: value,
-        extensions: this.localExtensions,
-        selection: _.some(previous.ranges, range => range.to > value.length) ? {
-          anchor: value.length
-        } : previous
-      }));
-    },
-    isFullscreen(value) {
-      if (value) {
-        this.fullscreenTarget.append(this.editor.dom);
-      } else {
-        this.target.append(this.editor.dom);
-      }
-    },
-    localExtensions() {
-      this.updateEditorState();
-    }
-  },
-  mounted() {
-    this.updateEditorState();
-    this.target.append(this.editor.dom);
-  },
-  beforeUnmount() {
-    var _a;
-    (_a = this.editor) === null || _a === void 0 ? void 0 : _a.destroy();
-  },
-  methods: {
-    updateEditorState() {
-      this.editor.setState(EditorState.create({
-        doc: this.modelValue,
-        extensions: this.localExtensions
-      }));
-    },
-    toggleFullscreen(value) {
-      this.isFullscreen = value === undefined ? !this.isFullscreen : value;
-    }
-  }
-});
-
-var css_248z = "@keyframes spinAround-data-v-2a2e4862{from{transform:rotate(0)}to{transform:rotate(359deg)}}@keyframes fade-data-v-2a2e4862{from{opacity:1}to{opacity:0}}.or-code .fullscreen-button[data-v-2a2e4862]{width:2.25rem;height:2.25rem}.or-code .fullscreen-button>.or-icon[data-v-2a2e4862]{font-size:1.5rem}.or-code .footer .or-code-error[data-v-2a2e4862],.or-code .footer .or-code-hint[data-v-2a2e4862]{flex-shrink:1;transition-timing-function:var(--t-func);transition-duration:var(--t-duration);transition-property:height,opacity}.header[data-v-2a2e4862]{display:flex;flex-direction:row;align-items:center;height:36px}.header .actions[data-v-2a2e4862]{margin-left:auto}.header .actions[data-v-2a2e4862]:not(.is-visible){display:none}.or-code-editor[data-v-2a2e4862]{min-height:calc(1.4em + 8px);overflow:auto;font-size:var(--fs-0);border:1px solid var(--c-neutral-2);border-radius:var(--s-2)}.or-code-editor.is-invalid[data-v-2a2e4862]{border-color:var(--c-error)}.or-code-editor[data-v-2a2e4862]> *{width:100%;height:100%}.or-code[data-v-2a2e4862],.or-modal[data-v-2a2e4862]  .content{display:flex;flex-direction:column}.or-code .or-code-editor[data-v-2a2e4862],.or-modal[data-v-2a2e4862]  .content .or-code-editor{flex-grow:1;text-align:left!important}";
-styleInject(css_248z);
-
-/* 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",
-    staticClass: "or-code"
-  }, [_vm.isShowingHeader ? _c('div', {
-    staticClass: "header"
-  }, [_c('or-label', {
-    attrs: {
-      "label": _vm.label
-    },
-    scopedSlots: _vm._u([{
-      key: "append",
-      fn: function () {
-        return [_vm._t("label-append")];
-      },
-      proxy: true
-    }], null, true)
-  }, [_vm._t("label")], 2), _vm._v(" "), _c('div', {
-    staticClass: "actions",
-    class: {
-      'is-visible': _vm.isHovered
-    }
-  }, [_vm._t("actions", function () {
-    return [_vm.isShowingFullscreen ? _c('or-icon-button', {
-      staticClass: "fullscreen-button",
-      attrs: {
-        "icon": "fullscreen",
-        "icon-color": "neutral-3"
-      },
-      on: {
-        "click": function ($event) {
-          return _vm.toggleFullscreen(true);
-        }
-      }
-    }) : _vm._e()];
-  }, {
-    "toggleFullscreen": _vm.toggleFullscreen
-  })], 2)], 1) : _vm._e(), _vm._v(" "), _c('div', {
-    ref: "target",
-    staticClass: "or-code-editor",
-    class: {
-      'is-invalid': _vm.isInvalid
-    }
-  }), _vm._v(" "), _c('div', {
-    staticClass: "footer"
-  }, [_vm.isShowingError ? _c('or-error', {
-    staticClass: "or-code-error",
-    attrs: {
-      "error": _vm.error
-    }
-  }) : _vm._e(), _vm._v(" "), _vm.isShowingHint ? _c('or-hint', {
-    staticClass: "or-code-hint",
-    attrs: {
-      "hint": _vm.hint
-    }
-  }) : _vm._e()], 1), _vm._v(" "), _c('or-teleport', [_c('or-modal', {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.isFullscreen,
-      expression: "isFullscreen"
-    }],
-    attrs: {
-      "title-text": _vm.label,
-      "size": "fullScreen",
-      "is-open": "",
-      "trap-focus": false
-    },
-    on: {
-      "close": function ($event) {
-        return _vm.toggleFullscreen(false);
-      }
-    }
-  }, [_vm.$slots['modal-actions'] ? _c('div', {
-    staticClass: "header"
-  }, [_c('div', {
-    staticClass: "actions is-visible"
-  }, [_vm._t("modal-actions")], 2)]) : _vm._e(), _vm._v(" "), _c('div', {
-    ref: "fullscreenTarget",
-    staticClass: "or-code-editor",
-    class: {
-      'is-invalid': _vm.isInvalid
-    }
-  }), _vm._v(" "), _vm.isShowingError ? _c('or-error', {
-    staticClass: "or-code-error",
-    attrs: {
-      "error": _vm.error
-    }
-  }) : _vm._e()], 1)], 1)], 1);
-};
-var __vue_staticRenderFns__ = [];
-
-/* style */
-const __vue_inject_styles__ = undefined;
-/* scoped */
-const __vue_scope_id__ = "data-v-2a2e4862";
-/* 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 { OrCodeLanguages as O, __vue_component__ as _ };

package/dist/v2/OrCollapse-50e3914c.js

@@ -1,168 +0,0 @@
-import { defineComponent, ref, computed, onBeforeUnmount, watch } from 'vue-demi';
-import { p as pxToRem } from './px-to-rem-0b26b83e.js';
-import { s as setStyle, r as requestAF, a as reflow, b as removeStyle, c as cancelAF, g as getBCR } from './dom-7a41831b.js';
-import _ from 'lodash';
-import { s as styleInject } from './style-inject.es-4c6f2515.js';
-import { n as normalizeComponent } from './normalize-component-6e8e3d80.js';
-
-var script = defineComponent({
-  name: 'OrCollapse',
-  model: {
-    prop: 'modelValue',
-    event: 'update:modelValue'
-  },
-  props: {
-    modelValue: {
-      type: Boolean,
-      default: false,
-      required: false,
-      validator: _.isBoolean
-    },
-    isVisible: {
-      type: Boolean,
-      default: false,
-      required: false,
-      validator: _.isBoolean
-    },
-    keepState: {
-      type: Boolean,
-      default: false,
-      required: false,
-      validator: _.isBoolean
-    }
-  },
-  emits: ['update:modelValue'],
-  setup(props, {
-    emit
-  }) {
-    // data
-    const isActive = ref(props.modelValue || props.isVisible);
-    const reqAF = ref(null);
-    const slotScope = computed(() => ({
-      isVisible: isActive,
-      hide
-    }));
-    // methods
-    function hide() {
-      isActive.value = false;
-    }
-    function beforeEnter(el) {
-      setStyle(el, 'height', 0);
-      setStyle(el, 'overflow', 'hidden');
-    }
-    function enter(el) {
-      const {
-        scrollHeight
-      } = el;
-      reqAF.value = requestAF(() => {
-        reflow(el);
-        setStyle(el, 'height', pxToRem(scrollHeight));
-      });
-    }
-    function afterEnter(el) {
-      removeStyle(el, 'height');
-      removeStyle(el, 'overflow');
-      cancelAF(reqAF.value);
-    }
-    function beforeLeave(el) {
-      setStyle(el, 'overflow', 'hidden');
-    }
-    function leave(el) {
-      setStyle(el, 'height', 'auto');
-      setStyle(el, 'display', 'block');
-      reqAF.value = requestAF(() => {
-        var _a;
-        setStyle(el, 'height', pxToRem((_a = getBCR(el)) === null || _a === void 0 ? void 0 : _a.height));
-        reflow(el);
-        setStyle(el, 'height', 0);
-      });
-    }
-    function afterLeave(el) {
-      removeStyle(el, 'height');
-      removeStyle(el, 'overflow');
-      cancelAF(reqAF.value);
-    }
-    // hooks
-    onBeforeUnmount(() => {
-      isActive.value = false;
-      reqAF.value = null;
-    });
-    // watchers
-    watch([() => props.modelValue, () => props.isVisible], ([newValue, newIsVisible]) => {
-      if (newValue !== isActive.value || newIsVisible !== isActive.value) {
-        isActive.value = newValue || newIsVisible;
-      }
-    });
-    watch(isActive, (nv, ov) => {
-      if (nv !== ov) {
-        emit('update:modelValue', nv);
-      }
-    });
-    return {
-      // data
-      isActive,
-      slotScope,
-      // methods
-      beforeEnter,
-      enter,
-      afterEnter,
-      beforeLeave,
-      leave,
-      afterLeave
-    };
-  }
-});
-
-var css_248z = ".or-collapse[data-v-55ba4cbb]{padding:0;transition-timing-function:var(--t-func);transition-duration:var(--t-duration);transition-property:height}";
-styleInject(css_248z);
-
-/* 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('transition', {
-    on: {
-      "before-enter": _vm.beforeEnter,
-      "enter": _vm.enter,
-      "after-enter": _vm.afterEnter,
-      "before-leave": _vm.beforeLeave,
-      "leave": _vm.leave,
-      "after-leave": _vm.afterLeave
-    }
-  }, [_vm.keepState ? [_c('div', {
-    directives: [{
-      name: "show",
-      rawName: "v-show",
-      value: _vm.isActive,
-      expression: "isActive"
-    }],
-    staticClass: "or-collapse"
-  }, [_vm._t("default", null, null, _vm.slotScope)], 2)] : [_vm.isActive ? _c('div', {
-    staticClass: "or-collapse"
-  }, [_vm._t("default", null, null, _vm.slotScope)], 2) : _vm._e()]], 2);
-};
-var __vue_staticRenderFns__ = [];
-
-/* style */
-const __vue_inject_styles__ = undefined;
-/* scoped */
-const __vue_scope_id__ = "data-v-55ba4cbb";
-/* 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 _ };