nwl-components 0.0.4 → 0.0.5

package/dist/nwl-components.es.js

@@ -35,7 +35,7 @@ var __privateMethod = (obj, member, method) => {
   return method;
 };
 var _transformProjectFiles, transformProjectFiles_fn;
-import { openBlock, createElementBlock, mergeProps, reactive, ref, watch, onMounted, onUnmounted, unref, createVNode, withKeys, withDirectives, createElementVNode, Fragment, renderList, normalizeClass, toDisplayString, vShow, renderSlot, isRef, vModelText, getCurrentInstance, createCommentVNode, createBlock, withCtx, pushScopeId, popScopeId, createTextVNode, inject, toRefs, vModelCheckbox } from "vue";
+import { openBlock, createElementBlock, mergeProps, reactive, ref, watch, onMounted, onUnmounted, unref, createVNode, withKeys, withDirectives, createElementVNode, Fragment, renderList, normalizeClass, toDisplayString, vShow, renderSlot, isRef, vModelText, getCurrentInstance, createCommentVNode, createBlock, withCtx, pushScopeId, popScopeId, createTextVNode, inject, toRefs } from "vue";
 let nanoid = (size = 21) => {
   let id = "";
   let bytes = crypto.getRandomValues(new Uint8Array(size));
@@ -61,8 +61,8 @@ var _export_sfc = (sfc, props) => {
   }
   return target;
 };
-const _hoisted_1$j = ["value"];
-const _sfc_main$p = {
+const _hoisted_1$k = ["value"];
+const _sfc_main$q = {
   props: {
     placeholder: String,
     disabled: Boolean,
@@ -78,20 +78,20 @@ const _sfc_main$p = {
       return openBlock(), createElementBlock("input", mergeProps({ type: "text" }, props, {
         value: __props.modelValue,
         onInput: handleInput
-      }), null, 16, _hoisted_1$j);
+      }), null, 16, _hoisted_1$k);
     };
   }
 };
-var TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-2cc3f9d3"]]);
+var TextInput = /* @__PURE__ */ _export_sfc(_sfc_main$q, [["__scopeId", "data-v-2cc3f9d3"]]);
 var Autocomplete_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$i = ["aria-owns", "aria-expanded"];
+const _hoisted_1$j = ["aria-owns", "aria-expanded"];
 const _hoisted_2$d = ["id"];
 const _hoisted_3$a = {
   key: 0,
   class: "loading"
 };
 const _hoisted_4$9 = ["onClick", "id", "aria-selected"];
-const _sfc_main$o = {
+const _sfc_main$p = {
   props: {
     items: {
       type: Array,
@@ -242,14 +242,14 @@ const _sfc_main$o = {
         ], 8, _hoisted_2$d), [
           [vShow, unref(state2).isOpen]
         ])
-      ], 8, _hoisted_1$i);
+      ], 8, _hoisted_1$j);
     };
   }
 };
-var Autocomplete = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-ee76199e"]]);
+var Autocomplete = /* @__PURE__ */ _export_sfc(_sfc_main$p, [["__scopeId", "data-v-ee76199e"]]);
 var Button_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$h = ["title", "disabled"];
-const _sfc_main$n = {
+const _hoisted_1$i = ["title", "disabled"];
+const _sfc_main$o = {
   props: {
     className: String,
     title: String,
@@ -269,13 +269,13 @@ const _sfc_main$n = {
         class: normalizeClass(classes)
       }, [
         renderSlot(_ctx.$slots, "default", {}, void 0, true)
-      ], 8, _hoisted_1$h);
+      ], 8, _hoisted_1$i);
     };
   }
 };
-var Button = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-5e5f2114"]]);
+var Button = /* @__PURE__ */ _export_sfc(_sfc_main$o, [["__scopeId", "data-v-5e5f2114"]]);
 var Select_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$m = {
+const _sfc_main$n = {
   props: {
     disabled: Boolean,
     modelValue: String
@@ -304,9 +304,9 @@ const _sfc_main$m = {
     };
   }
 };
-var Select = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-976df3ea"]]);
+var Select = /* @__PURE__ */ _export_sfc(_sfc_main$n, [["__scopeId", "data-v-976df3ea"]]);
 var TextArea_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _sfc_main$l = {
+const _sfc_main$m = {
   props: {
     placeholder: String,
     disabled: Boolean,
@@ -328,10 +328,10 @@ const _sfc_main$l = {
     };
   }
 };
-var TextArea = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-0c2bd53c"]]);
+var TextArea = /* @__PURE__ */ _export_sfc(_sfc_main$m, [["__scopeId", "data-v-0c2bd53c"]]);
 var Table_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _hoisted_1$g = ["id"];
-const _sfc_main$k = {
+const _hoisted_1$h = ["id"];
+const _sfc_main$l = {
   props: {
     id: String
   },
@@ -342,11 +342,45 @@ const _sfc_main$k = {
         id: props.id
       }, [
         renderSlot(_ctx.$slots, "default", {}, void 0, true)
-      ], 8, _hoisted_1$g);
+      ], 8, _hoisted_1$h);
     };
   }
 };
-var Table = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-6416d86a"]]);
+var Table = /* @__PURE__ */ _export_sfc(_sfc_main$l, [["__scopeId", "data-v-2b42a47b"]]);
+var Checkbox_vue_vue_type_style_index_0_scoped_true_lang = "";
+const _hoisted_1$g = ["aria-checked"];
+const _sfc_main$k = {
+  props: {
+    modelValue: Boolean
+  },
+  emits: ["update:modelValue", "change"],
+  setup(__props, { emit }) {
+    const props = __props;
+    const isChecked = ref(props.modelValue);
+    if (typeof props.modelValue === "string") {
+      isChecked.value === props.modelValue === "true";
+    }
+    const toggleCheckbox = (key) => {
+      if (key != null && key !== " ") {
+        return;
+      }
+      isChecked.value = !isChecked.value;
+      emit("change", isChecked.value);
+      emit("update:modelValue", isChecked.value);
+    };
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("span", {
+        role: "checkbox",
+        "aria-checked": isChecked.value,
+        onClick: _cache[0] || (_cache[0] = ($event) => toggleCheckbox()),
+        onKeydown: _cache[1] || (_cache[1] = ($event) => toggleCheckbox($event.key)),
+        tabindex: "0",
+        "aria-label": "label"
+      }, null, 40, _hoisted_1$g);
+    };
+  }
+};
+var Checkbox = /* @__PURE__ */ _export_sfc(_sfc_main$k, [["__scopeId", "data-v-f63b8f34"]]);
 var Tabs_vue_vue_type_style_index_0_scoped_true_lang = "";
 const _hoisted_1$f = { class: "tabs" };
 const _hoisted_2$c = ["onClick"];
@@ -6644,6 +6678,9 @@ const state = reactive({
 function useProject() {
   const { baseURL } = inject("config");
   const service = new ProjectService(baseURL);
+  const setProject = (project) => {
+    state.project = project;
+  };
   const fetchProject = async (id) => {
     state.loading = true;
     state.project = await service.fetch(id);
@@ -6721,6 +6758,7 @@ function useProject() {
     state.project.files.list = state.project.files.list.filter((file) => !filesIdx.includes(state.project.files.list.indexOf(file)));
   };
   return __spreadProps(__spreadValues({}, toRefs(state)), {
+    setProject,
     fetchProject,
     saveProject,
     deleteProject,
@@ -6753,7 +6791,7 @@ const _hoisted_6$5 = ["href"];
 const _hoisted_7$5 = /* @__PURE__ */ createTextVNode(" by ");
 const _hoisted_8$5 = ["href"];
 const _hoisted_9$4 = { id: "numCollaborators" };
-const _hoisted_10$4 = /* @__PURE__ */ createTextVNode(" Collaborators ");
+const _hoisted_10$3 = /* @__PURE__ */ createTextVNode(" Collaborators ");
 const _hoisted_11$2 = { id: "numAnnotations" };
 const _hoisted_12$2 = /* @__PURE__ */ createTextVNode(" Annotations ");
 const _hoisted_13$1 = { id: "numFiles" };
@@ -6827,7 +6865,7 @@ const _sfc_main$f = {
           }, null, 8, ["modelValue"]),
           createElementVNode("p", null, [
             createElementVNode("span", _hoisted_9$4, toDisplayString(unref(project).collaborators.list.length), 1),
-            _hoisted_10$4
+            _hoisted_10$3
           ]),
           createElementVNode("p", null, [
             createElementVNode("span", _hoisted_11$2, toDisplayString(unref(project).annotations.list.length), 1),
@@ -7162,7 +7200,7 @@ const _sfc_main$c = {
   }
 };
 var PureAnnotations_vue_vue_type_style_index_0_scoped_true_lang = "";
-const _withScopeId$4 = (n) => (pushScopeId("data-v-0abfcc3d"), n = n(), popScopeId(), n);
+const _withScopeId$4 = (n) => (pushScopeId("data-v-72fdca59"), n = n(), popScopeId(), n);
 const _hoisted_1$8 = { class: "wrapper" };
 const _hoisted_2$6 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ createElementVNode("h2", null, "Annotations", -1));
 const _hoisted_3$4 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ createElementVNode("thead", null, [
@@ -7176,10 +7214,9 @@ const _hoisted_3$4 = /* @__PURE__ */ _withScopeId$4(() => /* @__PURE__ */ create
 const _hoisted_4$4 = ["onClick"];
 const _hoisted_5$3 = ["value", "selected"];
 const _hoisted_6$3 = ["value", "selected"];
-const _hoisted_7$3 = ["onUpdate:modelValue", "onChange"];
-const _hoisted_8$3 = { class: "actions" };
-const _hoisted_9$3 = /* @__PURE__ */ createTextVNode(" + ");
-const _hoisted_10$3 = /* @__PURE__ */ createTextVNode(" - ");
+const _hoisted_7$3 = { class: "actions" };
+const _hoisted_8$3 = /* @__PURE__ */ createTextVNode(" + ");
+const _hoisted_9$3 = /* @__PURE__ */ createTextVNode(" - ");
 const _sfc_main$b = {
   props: {
     annotations: {
@@ -7231,6 +7268,7 @@ const _sfc_main$b = {
       emitAnnotationUpdate(idx, { values });
     };
     const handleDisplayChange = (annotation, display) => {
+      console.log("dsfsdfsdf", display);
       const idx = props.annotations.indexOf(annotation);
       if (idx < 0)
         return;
@@ -7296,13 +7334,11 @@ const _sfc_main$b = {
                     }, 1032, ["modelValue", "onUpdate:modelValue", "onChange"])) : createCommentVNode("", true)
                   ]),
                   createElementVNode("td", null, [
-                    withDirectives(createElementVNode("input", {
-                      type: "checkbox",
+                    createVNode(Checkbox, {
+                      modelValue: annotation.display,
                       "onUpdate:modelValue": ($event) => annotation.display = $event,
-                      onChange: ($event) => handleDisplayChange(annotation, $event.target.checked)
-                    }, null, 40, _hoisted_7$3), [
-                      [vModelCheckbox, annotation.display]
-                    ])
+                      onChange: ($event) => handleDisplayChange(annotation, $event)
+                    }, null, 8, ["modelValue", "onUpdate:modelValue", "onChange"])
                   ])
                 ], 10, _hoisted_4$4);
               }), 128))
@@ -7310,14 +7346,14 @@ const _sfc_main$b = {
           ]),
           _: 1
         }),
-        createElementVNode("div", _hoisted_8$3, [
+        createElementVNode("div", _hoisted_7$3, [
           createVNode(Button, {
             small: true,
             onClick: _cache[0] || (_cache[0] = ($event) => _ctx.$emit("addAnnotation")),
             title: "Add annotation"
           }, {
             default: withCtx(() => [
-              _hoisted_9$3
+              _hoisted_8$3
             ]),
             _: 1
           }),
@@ -7328,7 +7364,7 @@ const _sfc_main$b = {
             disabled: selected.value == null
           }, {
             default: withCtx(() => [
-              _hoisted_10$3
+              _hoisted_9$3
             ]),
             _: 1
           }, 8, ["disabled"])
@@ -7337,7 +7373,7 @@ const _sfc_main$b = {
     };
   }
 };
-var PureAnnotations = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-0abfcc3d"]]);
+var PureAnnotations = /* @__PURE__ */ _export_sfc(_sfc_main$b, [["__scopeId", "data-v-72fdca59"]]);
 const _sfc_main$a = {
   setup(__props) {
     const {
@@ -7781,20 +7817,20 @@ function _sfc_render(_ctx, _cache) {
 var Footer = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render], ["__scopeId", "data-v-79b1b506"]]);
 const _sfc_main$2 = {
   props: {
-    projectID: {
-      type: String,
+    project: {
+      type: Object,
       required: true
     }
   },
   setup(__props) {
     const props = __props;
-    const { project, fetchProject, updateProject } = useProject();
+    const { project, setProject, updateProject } = useProject();
+    setProject(props.project);
     const content = ref(project.name);
     const onTitleInput = (event) => {
       content.value = event.currentTarget.textContent;
       updateProject({ name: content.value });
     };
-    fetchProject(props.projectID);
     return (_ctx, _cache) => {
       return openBlock(), createBlock(Wrapper, null, {
         default: withCtx(() => [
@@ -7967,4 +8003,4 @@ const _sfc_main = {
   }
 };
 var NewProjectPage = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-34344f58"]]);
-export { Access, _sfc_main$a as Annotations, Autocomplete, Button, _sfc_main$c as Collaborators, _sfc_main$8 as Files, Footer, Header, ImportFilesDialog, Nav, NewProjectPage, ProjectInfo, PureAnnotations, PureCollaborators, PureFiles, Select, Settings, _sfc_main$2 as SettingsPage, Tab, Table, Tabs, TextArea, TextInput, _sfc_main$1 as UserPage, Wrapper };
+export { Access, _sfc_main$a as Annotations, Autocomplete, Button, Checkbox, _sfc_main$c as Collaborators, _sfc_main$8 as Files, Footer, Header, ImportFilesDialog, Nav, NewProjectPage, ProjectInfo, PureAnnotations, PureCollaborators, PureFiles, Select, Settings, _sfc_main$2 as SettingsPage, Tab, Table, Tabs, TextArea, TextInput, _sfc_main$1 as UserPage, Wrapper };