sprintify-ui 0.6.3 → 0.6.5

package/dist/types/src/components/BaseHeader.vue.d.ts

@@ -8,13 +8,6 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<ActionItem[]>;
         default: undefined;
     };
-    attributes: {
-        type: import("vue").PropType<{
-            icon: string;
-            label: string;
-        }[]>;
-        default: undefined;
-    };
     breadcrumbs: {
         type: import("vue").PropType<Breadcrumb[]>;
         default: undefined;
@@ -23,6 +16,13 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<"default" | "compact">;
         default: string;
     };
+    attributes: {
+        type: import("vue").PropType<{
+            icon: string;
+            label: string;
+        }[]>;
+        default: undefined;
+    };
     subtitle: {
         type: import("vue").PropType<string>;
         default: undefined;
@@ -48,13 +48,6 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<ActionItem[]>;
         default: undefined;
     };
-    attributes: {
-        type: import("vue").PropType<{
-            icon: string;
-            label: string;
-        }[]>;
-        default: undefined;
-    };
     breadcrumbs: {
         type: import("vue").PropType<Breadcrumb[]>;
         default: undefined;
@@ -63,6 +56,13 @@ declare const _default: import("vue").DefineComponent<{
         type: import("vue").PropType<"default" | "compact">;
         default: string;
     };
+    attributes: {
+        type: import("vue").PropType<{
+            icon: string;
+            label: string;
+        }[]>;
+        default: undefined;
+    };
     subtitle: {
         type: import("vue").PropType<string>;
         default: undefined;
@@ -81,12 +81,12 @@ declare const _default: import("vue").DefineComponent<{
     };
 }>>, {
     actions: ActionItem[];
+    breadcrumbs: Breadcrumb[];
+    layout: 'default' | 'compact';
     attributes: {
         icon: string;
         label: string;
     }[];
-    breadcrumbs: Breadcrumb[];
-    layout: 'default' | 'compact';
     subtitle: string;
     badge: {
         icon: string;

package/dist/types/src/components/BaseSwitch.vue.d.ts

@@ -24,6 +24,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: boolean;
         type: BooleanConstructor;
     };
+    disabled: {
+        default: boolean;
+        type: BooleanConstructor;
+    };
     checkedIcon: {
         default: string;
         type: StringConstructor;
@@ -59,6 +63,10 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
         default: boolean;
         type: BooleanConstructor;
     };
+    disabled: {
+        default: boolean;
+        type: BooleanConstructor;
+    };
     checkedIcon: {
         default: string;
         type: StringConstructor;
@@ -74,6 +82,7 @@ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<{
     name: string;
     color: "dark" | "light" | "danger" | "success" | "warning" | "primary" | "info";
     modelValue: string | number | boolean | null | undefined;
+    disabled: boolean;
     hasError: boolean;
     size: "base" | "xs" | "sm" | "lg" | "xl";
     checkedIcon: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sprintify-ui",
-  "version": "0.6.3",
+  "version": "0.6.5",
   "scripts": {
     "build": "rimraf dist && vue-tsc && vite build",
     "build-fast": "rimraf dist && vite build",

package/src/components/BaseSelect.vue

@@ -105,8 +105,6 @@ const { nameInternal, requiredInternal, hasErrorInternal, emitUpdate } =
     emit: emit,
   });
 
-const options = ref<HTMLOptionElement[]>([]);
-
 function isEmptyExternal(value: string | number | null | undefined) {
   if (value === undefined || value === EMPTY_VALUE_EXTERNAL) {
     return true;
@@ -132,46 +130,9 @@ const modelValueInternal = computed(() => {
     return EMPTY_VALUE_INTERNAL;
   }
 
-  if (!checkIfModelValueIsValid()) {
-    return EMPTY_VALUE_INTERNAL;
-  }
-
   return props.modelValue;
 });
 
-/**
- * Checks if the current modelValue is valid
- */
-useMutationObserver(
-  select,
-  () => {
-    options.value = getOptions();
-  },
-  { attributes: false, childList: true }
-);
-
-onMounted(() => {
-  options.value = getOptions();
-});
-
-function getOptions(): HTMLOptionElement[] {
-  return [...(select.value?.options ?? [])];
-}
-
-function checkIfModelValueIsValid(): boolean {
-  if (props.modelValue === EMPTY_VALUE_EXTERNAL) {
-    return true;
-  }
-
-  if (props.options && props.options.length) {
-    return props.options.some((o) =>
-      isEqual(o[props.valueKey as any], props.modelValue)
-    );
-  }
-
-  return options.value.some((o) => isEqual(o.value, props.modelValue));
-}
-
 /**
  *
  * Emit change while mutating internal empty value ''

package/src/components/BaseSwitch.stories.js

@@ -45,6 +45,11 @@ const Template = (args) => ({
 export const Demo = Template.bind({});
 Demo.args = {};
 
+export const Disabled = Template.bind({});
+Disabled.args = {
+  disabled: true,
+};
+
 const colors = [
   'primary',
   'info',

package/src/components/BaseSwitch.vue

@@ -5,7 +5,8 @@
         :model-value="normalizedModelValue"
         :class="[
           modelValue ? bg : 'bg-slate-200',
-          'relative inline-flex shrink-0 cursor-pointer items-center rounded-full transition-colors duration-200 ease-in-out focus:outline-none focus:ring-2 focus:ring-offset-2 ',
+          'relative inline-flex shrink-0 items-center rounded-full transition-colors duration-200 ease-in-out',
+          disabled ? 'opacity-50 cursor-not-allowed' : 'cursor-pointer focus:outline-none focus:ring-2 focus:ring-offset-2',
           focus,
         ]"
         :style="{
@@ -32,7 +33,9 @@
       </Switch>
       <SwitchLabel
         v-if="$slots.default"
-        class="cursor-pointer"
+        :class="[
+          disabled ? 'cursor-not-allowed' : 'cursor-pointer',
+        ]"
       >
         <slot />
       </SwitchLabel>
@@ -75,6 +78,10 @@ const props = defineProps({
     default: false,
     type: Boolean,
   },
+  disabled: {
+    default: false,
+    type: Boolean,
+  },
   checkedIcon: {
     default: '',
     type: String,
@@ -210,6 +217,10 @@ const icon = computed(() => {
 });
 
 function update(payload: any) {
+  if (props.disabled) {
+    return;
+  }
+
   emitUpdate(payload);
 }
 </script>