@dejwcake/craftable 2.0.2 → 2.1.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dejwcake/craftable",
-  "version": "2.0.2",
+  "version": "2.1.0",
   "description": "This is a frontend dependency for Craftable. Craftable is a Laravel-based open-source toolkit for building administration interfaces.",
   "type": "module",
   "main": "./dist/index.cjs",

package/src/components/ReadOnlySwitch.vue

@@ -0,0 +1,23 @@
+<template>
+    <div class="form-check form-switch form-switch-inline">
+        <input
+            class="form-check-input"
+            :class="switchClass"
+            type="checkbox"
+            role="switch"
+            :checked="!!modelValue"
+            disabled
+        />
+    </div>
+</template>
+
+<script setup>
+import { computed } from 'vue';
+
+const props = defineProps({
+    modelValue: { type: [Boolean, Number, String], default: false },
+    variant: { type: String, default: 'success' },
+});
+
+const switchClass = computed(() => `form-switch-${props.variant}`);
+</script>

package/src/components/show/ShowRow.vue

@@ -0,0 +1,17 @@
+<template>
+    <div class="mb-3 row align-items-center">
+        <label class="col-md-3 col-form-label text-md-end">{{ label }}</label>
+        <div class="col-md-9 col-xl-8">
+            <slot>
+                <span>{{ value }}</span>
+            </slot>
+        </div>
+    </div>
+</template>
+
+<script setup>
+defineProps({
+    label: { type: String, required: true },
+    value: { type: [String, Number, Boolean], default: '' },
+});
+</script>

package/src/index.js

@@ -26,6 +26,9 @@ export { default as EditButton } from './components/listing/EditButton.vue';
 export { default as DeleteButton } from './components/listing/DeleteButton.vue';
 export { default as ConfirmModal } from './components/ConfirmModal.vue';
 export { default as ToggleSwitch } from './components/listing/ToggleSwitch.vue';
+export { default as ReadOnlySwitch } from './components/ReadOnlySwitch.vue';
+
+export { default as ShowRow } from './components/show/ShowRow.vue';
 
 // Form components
 export { default as FormInput } from './components/form/FormInput.vue';