ep-lib-ts 0.1.33 → 0.1.34

package/src/components/basics/EpListitem.vue

@@ -0,0 +1,70 @@
+
+<script setup lang="ts">
+
+import { computed, useSlots } from "vue";
+
+type Type = "default" | "nested"
+type Disabled="false"|"true"
+
+interface Props {
+    type?: Type;
+    disabled?:Disabled;
+}
+
+const props = withDefaults(defineProps<Props>(), {
+    type: 'default',
+    disabled:'false'
+})
+
+const slots = useSlots()
+console.log(slots)
+const hasLeftContent = computed(()=>{
+    return slots.leftContent?true:false
+})
+
+const hasRigthContent = computed(()=>{
+    return slots.rightContent?true:false
+})
+const isNested = computed(()=>{
+    if (props.type=="nested")
+        return "px-10"
+    else
+        return ""   
+})
+const isDisabled = computed(()=>{
+    if (props.disabled=="true")
+        return "opacity-75 text-slate-500 "
+    else
+        return "hover:bg-gray-200 active:bg-gray-300"   
+})
+</script>
+
+<template>
+    <li :class="`flex flex-row flex-nowrap justify-between font-medium items-center py-4  ${isNested} ${isDisabled}`">     
+          <div class="flex items-center">
+                <div v-if="hasLeftContent" class="mr-2 min-w-fit">
+                    <slot name="leftContent"></slot>
+                </div>
+                <div>
+                    <slot></slot>
+                </div> 
+            </div>
+            <div v-if="hasRigthContent"  class="px-2 ">
+                <slot name="rightContent"></slot>
+            </div>   
+    </li>
+
+</template>
+
+
+
+
+
+
+
+
+
+
+
+
+

package/src/components/educationals/EpReading.vue

@@ -115,7 +115,7 @@ const {
               <div class="flex-1 py-2" v-if="hasDetails">
                 <p class="font-medium">
                   <span class="text-sm italic pr-1" v-if="author">par</span>
-                  <span class="font-bold" v-if="author">{{ author }}</span>
+                  <span class="font-bold mr-1" v-if="author">{{ author }}</span>
                   <span v-if="year">({{ year }})</span>
                   <span v-if="year && editor">, </span>
                   <span v-if="editor">{{ editor }}</span>
@@ -195,7 +195,7 @@ const {
                             <p class="font-medium">
                               <span class="text-sm italic pr-1" v-if="author">par</span>
                               <span class="font-bold mr-2" v-if="author">{{ author }}</span>
-                              <span v-if="year">({{ year }})</span>
+                              <span v-if="year"> ({{ year }})</span>
                               <span v-if="year && editor">, </span>
                               <span v-if="editor">{{ editor }}</span>
                             </p>

package/src/components/forms/EpSwitch.vue

@@ -4,7 +4,7 @@ import { toRefs } from "vue";
 interface Props {
   id?: string;
   label?: string;
-  modelValue?: string;
+  modelValue?: boolean;
   type?: string;
   placeholder?: string;
   disabled?: boolean;
@@ -15,7 +15,7 @@ interface Props {
 const props = withDefaults(defineProps<Props>(), {
   id: "toggle",
   label: "label",
-  modelValue: "",
+  modelValue: false,
   type: "checkbox",
   placeholder: "",
   disabled: false,
@@ -24,9 +24,14 @@ const props = withDefaults(defineProps<Props>(), {
 });
 
 const emit = defineEmits<{
-  (e: "update:modelValue", modelValue: string): void;
+  (e: "update:modelValue", modelValue: boolean): void;
 }>();
 
+const onChange = (event:Event) => {
+  const target = event.target as HTMLInputElement
+  emit('update:modelValue', true)
+}
+
 const {
   id,
   label,
@@ -48,6 +53,7 @@ const {
       class="form-checkbox mr-2 mt-[0rem] h-4 w-8 appearance-none rounded-full bg-neutral-200 border-neutral-300 before:pointer-events-none before:absolute before:h-3.5 before:w-3.5 before:rounded-full before:bg-transparent before:content-[''] after:absolute after:z-[2] after:-mt-[0rem] after:h-3.5 after:w-3.5 after:rounded-full after:border-none after:bg-neutral-50 after:shadow-[0_0px_3px_0_rgb(0_0_0_/_7%),_0_2px_2px_0_rgb(0_0_0_/_4%)] after:transition-[background-color_0.2s,transform_0.2s] after:content-[''] checked:bg-none checked:bg-blue-600 checked:after:absolute checked:after:z-[2] checked:after:-mt-[0px] checked:after:ml-[1.0625rem] checked:after:h-3.5 checked:after:w-3.5 checked:after:rounded-full checked:after:border-none checked:after:bg-neutral-100 checked:after:shadow-[0_3px_1px_-2px_rgba(0,0,0,0.2),_0_2px_2px_0_rgba(0,0,0,0.14),_0_1px_5px_0_rgba(0,0,0,0.12)] checked:after:transition-[background-color_0.2s,transform_0.2s] checked:after:content-[''] hover:cursor-pointer focus:outline-none focus:ring-0 focus:before:scale-75 focus:before:opacity-[0.12] focus:before:mt-[0.1rem] focus:before:shadow-[3px_-1px_0px_13px_rgba(0,0,0,0.6)] focus:before:transition-[box-shadow_0.2s,transform_0.2s] focus:after:absolute focus:after:z-[1] focus:after:block focus:after:h-3.5 focus:after:w-3.5 focus:after:-mt-[0rem] focus:after:rounded-full focus:after:content-[''] checked:focus:border-neutral-200 checked:focus:bg-blue-600 checked:focus:before:ml-[1rem] checked:focus:before:mt-[0.1rem] checked:focus:before:scale-75 checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] checked:focus:before:transition-[box-shadow_0.2s,transform_0.2s] dark:bg-neutral-600 dark:after:bg-neutral-400 dark:checked:bg-blue-600 dark:checked:after:bg-blue-600 dark:focus:before:shadow-[3px_-1px_0px_13px_rgba(255,255,255,0.4)] dark:checked:focus:before:shadow-[3px_-1px_0px_13px_#3b71ca] disabled:opacity-40 disabled:cursor-not-allowed"
       role="switch"
       :disabled="disabled"
+      @change="onChange"
     />
     <label class="inline-block pl-[0.15rem] hover:cursor-pointer" :for="id"
       >Default switch checkbox input</label

package/src/components/signages/EpHeader.vue

@@ -101,7 +101,7 @@ const { title, headerImgColor, big } = toRefs(props);
         </div>
       </div>
 
-      <div v-if="props.big" class="animate-bounce absolute bottom-10 left-1/2">
+      <div v-if="props.big" class="animate-bounce absolute bottom-32 left-1/2">
         <div class="mx-auto w-12 bg-white rounded-full p-2" @click="clickScroll">
           <EpIcon :iconPath="mdiChevronDown" size="32"></EpIcon>
         </div>

package/src/components/signages/EpQuote.vue

@@ -49,7 +49,7 @@ const { author, img, card } = toRefs(props);
       <div class="flex flex-wrap rounded-md">
         <img
           v-if="img"
-          :class="`h-96 w-full object-cover h-auto w-48 ${imageStyle}`"
+          :class="`h-32 ${imageStyle}`"
           :src="img"
           alt="Image of quote"
         />

package/dist/EpBadge-1001b3f1.js

@@ -1,6 +0,0 @@
-import { c as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpBtn-d2ee85de.js

@@ -1,6 +0,0 @@
-import { d as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpCard-eb83211e.js

@@ -1,6 +0,0 @@
-import { e as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpChip-916932cb.js

@@ -1,6 +0,0 @@
-import { f as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpContentSlider-0cf1508d.js

@@ -1,6 +0,0 @@
-import { w as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpDivider-e7cb7f8a.js

@@ -1,6 +0,0 @@
-import { g as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpFlex-5a98c073.js

@@ -1,6 +0,0 @@
-import { h as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpHeader-6434c484.js

@@ -1,6 +0,0 @@
-import { J as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpIframe-22b07140.js

@@ -1,6 +0,0 @@
-import { A as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpImg-a6041dc8.js

@@ -1,6 +0,0 @@
-import { j as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpLineChart-2575d63d.js

@@ -1,6 +0,0 @@
-import { p as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpLink-973bc022.js

@@ -1,6 +0,0 @@
-import { B as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpLinkVersion-24002433.js

@@ -1,6 +0,0 @@
-import { C as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpModal-c85f0d51.js

@@ -1,6 +0,0 @@
-import { x as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpPieChart-0eb59e41.js

@@ -1,6 +0,0 @@
-import { q as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpQuestion-9a2344da.js

@@ -1,6 +0,0 @@
-import { y as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpQuote-aaa938d0.js

@@ -1,6 +0,0 @@
-import { K as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpRadio-57e34517.js

@@ -1,6 +0,0 @@
-import { v as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpReading-e17c098f.js

@@ -1,6 +0,0 @@
-import { b as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpResource-2adf0ce4.js

@@ -1,6 +0,0 @@
-import { s as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpSection-d658f245.js

@@ -1,6 +0,0 @@
-import { k as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpSkeleton-fccbc6be.js

@@ -1,6 +0,0 @@
-import { L as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpSoftware-32ca0529.js

@@ -1,6 +0,0 @@
-import { D as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpSpinner-d8682586.js

@@ -1,6 +0,0 @@
-import { l as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpSvg-7d74c2b2.js

@@ -1,6 +0,0 @@
-import { E as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpTable-e5bd6c19.js

@@ -1,6 +0,0 @@
-import { m as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpTerm-427f5b86.js

@@ -1,6 +0,0 @@
-import { _ as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpText-f96b3863.js

@@ -1,6 +0,0 @@
-import { n as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpTimeLine-54cbf65e.js

@@ -1,6 +0,0 @@
-import { F as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpVideo-9a9ce1e1.js

@@ -1,6 +0,0 @@
-import { G as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};

package/dist/EpVideoPanopto-f42c01cc.js

@@ -1,6 +0,0 @@
-import { H as o } from "./index-a7b2a6d7.js";
-import "vue";
-import "vue-router";
-export {
-  o as default
-};