@witchcraft/ui 0.1.0 → 0.1.1

package/dist/runtime/components/LibDatePicker/LibSingleDatePicker.vue

@@ -1,69 +1,49 @@
-<script setup lang="ts">
-import { type DateValue, getLocalTimeZone } from "@internationalized/date"
-import { DatePickerArrow, DatePickerCalendar, DatePickerCell, DatePickerCellTrigger, DatePickerContent, DatePickerField, DatePickerGrid, DatePickerGridBody, DatePickerGridHead, DatePickerGridRow, DatePickerHeadCell, DatePickerHeader, DatePickerHeading, DatePickerInput, DatePickerNext, DatePickerPrev, DatePickerRoot, DatePickerTrigger } from "reka-ui"
-import { onBeforeUnmount, ref, toRaw, useAttrs, watch } from "vue"
-
-import { convertDateWithFallback, getNow,toEmittableDate } from "./helpers.js"
-
-import { useInjectedLocale } from "../../composables/useInjectedLocale.js"
-import type { SingleDate } from "../../types/index.js"
-import { twMerge } from "../../utils/twMerge.js"
-import Icon from "../Icon/Icon.vue"
-
-const attrs = useAttrs()
-
-const props = withDefaults(defineProps<{
-	useTime?: boolean
-	id: string
-	fallbackDate?: Date
-	timeZone?: string
-	updateInterval?: number
-}>(), {
-	timeZone: getLocalTimeZone(),
-	useTime: false,
-	fallbackDate: _ => getNow({ withTime: _.useTime ?? false }).toDate(_.timeZone ?? getLocalTimeZone()),
-	updateInterval: 10000
-})
-
-const locale = useInjectedLocale().timeLocale
-
-const date = defineModel<SingleDate>({ required: true })
-
-let justSet = false
-const tempDate = ref()
+<script setup>
+import { getLocalTimeZone } from "@internationalized/date";
+import { DatePickerArrow, DatePickerCalendar, DatePickerCell, DatePickerCellTrigger, DatePickerContent, DatePickerField, DatePickerGrid, DatePickerGridBody, DatePickerGridHead, DatePickerGridRow, DatePickerHeadCell, DatePickerHeader, DatePickerHeading, DatePickerInput, DatePickerNext, DatePickerPrev, DatePickerRoot, DatePickerTrigger } from "reka-ui";
+import { onBeforeUnmount, ref, toRaw, useAttrs, watch } from "vue";
+import { convertDateWithFallback, getNow, toEmittableDate } from "./helpers.js";
+import { useInjectedLocale } from "../../composables/useInjectedLocale.js";
+import { twMerge } from "../../utils/twMerge.js";
+import Icon from "../Icon/Icon.vue";
+const attrs = useAttrs();
+const props = defineProps({
+  useTime: { type: Boolean, required: false, default: false },
+  id: { type: String, required: true },
+  fallbackDate: { type: Date, required: false, default: (_) => getNow({ withTime: _.useTime ?? false }).toDate(_.timeZone ?? getLocalTimeZone()) },
+  timeZone: { type: String, required: false, default: getLocalTimeZone() },
+  updateInterval: { type: Number, required: false, default: 1e4 }
+});
+const locale = useInjectedLocale().timeLocale;
+const date = defineModel({ type: null, ...{ required: true } });
+let justSet = false;
+const tempDate = ref();
 function updateTempDate() {
-	tempDate.value = convertDateWithFallback(date.value, props)
+  tempDate.value = convertDateWithFallback(date.value, props);
 }
-
-updateTempDate()
-
+updateTempDate();
 watch(date, () => {
-	if (!justSet) {
-		updateTempDate()
-	} else {
-		justSet = false
-	}
-})
+  if (!justSet) {
+    updateTempDate();
+  } else {
+    justSet = false;
+  }
+});
 watch(tempDate, () => {
-	justSet = true
-	date.value = toEmittableDate(toRaw(tempDate.value as any))
-})
-
+  justSet = true;
+  date.value = toEmittableDate(toRaw(tempDate.value));
+});
 watch(() => props.timeZone, () => {
-	updateTempDate()
-})
-
+  updateTempDate();
+});
 const interval = setInterval(() => {
-	if (!date.value) {
-		// update suggested date if none is set
-		updateTempDate()
-	}
-}, props.updateInterval)
-
+  if (!date.value) {
+    updateTempDate();
+  }
+}, props.updateInterval);
 onBeforeUnmount(() => {
-	clearInterval(interval)
-})
-
+  clearInterval(interval);
+});
 </script>
 
 <template>
@@ -71,11 +51,13 @@ onBeforeUnmount(() => {
 	:id="id"
 	:locale="locale"
 	class="date-picker--root"
-	v-model="tempDate as DateValue"
+	v-model="tempDate"
 >
 	<DatePickerField
 		v-slot="{ segments }"
-		:class="twMerge(`
+		:class="
+  twMerge(
+    `
 			date-picker--field
 			flex items-center justify-between
 			select-none
@@ -83,8 +65,9 @@ onBeforeUnmount(() => {
 			metadata-input-border
 			rounded-sm
 		`,
-			(attrs as any).class)
-		"
+    attrs.class
+  )
+"
 	>
 		<div :class="twMerge(`
 			date-picker--segment
@@ -93,7 +76,7 @@ onBeforeUnmount(() => {
 			overflow-scroll
 			scrollbar-hidden
 			whitespace-nowrap
-		`, date === undefined && 'text-neutral-400')"
+		`, date === void 0 && 'text-neutral-400')"
 		>
 			<template
 				v-for="item in segments"
@@ -209,7 +192,7 @@ onBeforeUnmount(() => {
 						outlined
 						px-1
 					"
-					:prev-page="(date: DateValue) => date.subtract({ years: 1 })"
+					:prev-page="(date2) => date2.subtract({ years: 1 })"
 				>
 					<Icon class="scale-150">
 						<i-radix-icons-double-arrow-left/>
@@ -263,7 +246,7 @@ onBeforeUnmount(() => {
 						outlined
 						px-1
 					"
-					:next-page="(date: DateValue) => date.add({ years: 1 })"
+					:next-page="(date2) => date2.add({ years: 1 })"
 				>
 					<Icon class="scale-150">
 						<i-radix-icons-double-arrow-right/>
@@ -375,7 +358,7 @@ onBeforeUnmount(() => {
 					</DatePickerGridBody>
 				</DatePickerGrid>
 			</div>
-			<slot v-bind="{tempValue: tempDate}"/>
+			<slot v-bind="{ tempValue: tempDate }"/>
 		</DatePickerCalendar>
 	</DatePickerContent>
 </DatePickerRoot>

package/dist/runtime/components/LibDatePicker/LibSingleDatePicker.vue.d.ts

@@ -0,0 +1,34 @@
+import type { SingleDate } from "../../types/index.js.js";
+type __VLS_Props = {
+    useTime?: boolean;
+    id: string;
+    fallbackDate?: Date;
+    timeZone?: string;
+    updateInterval?: number;
+};
+type __VLS_PublicProps = __VLS_Props & {
+    modelValue: SingleDate;
+};
+declare var __VLS_157: {
+    tempValue: any;
+};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_157) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: SingleDate) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: SingleDate) => any) | undefined;
+}>, {
+    fallbackDate: Date;
+    timeZone: string;
+    useTime: boolean;
+    updateInterval: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDatePicker/LibTimeZonePicker.vue

@@ -1,11 +1,11 @@
-<script setup lang="ts">
-import { getLocalTimeZone } from "@internationalized/date"
-
-import { getTimeZoneList } from "../../helpers/getTimeZoneList.js"
-import LibInputDeprecated from "../LibInputDeprecated/LibInputDeprecated.vue"
-const timeZone = defineModel<string>({ default: getLocalTimeZone() })
-const label = defineModel<string>("label", { default: "Time Zone" })
+<script setup>
+import { getLocalTimeZone } from "@internationalized/date";
+import { getTimeZoneList } from "../../helpers/getTimeZoneList.js";
+import LibInputDeprecated from "../LibInputDeprecated/LibInputDeprecated.vue";
+const timeZone = defineModel({ type: String, ...{ default: getLocalTimeZone() } });
+const label = defineModel("label", { type: String, ...{ default: "Time Zone" } });
 </script>
+
 <template>
 <LibInputDeprecated
 	:restrict-to-suggestions="true"
@@ -24,4 +24,3 @@ const label = defineModel<string>("label", { default: "Time Zone" })
 	</template>
 </LibInputDeprecated>
 </template>
-

package/dist/runtime/components/LibDatePicker/LibTimeZonePicker.vue.d.ts

@@ -0,0 +1,22 @@
+type __VLS_PublicProps = {
+    modelValue?: string;
+    "label"?: string;
+};
+declare var __VLS_7: {};
+type __VLS_Slots = {} & {
+    default?: (props: typeof __VLS_7) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<__VLS_PublicProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    "update:modelValue": (value: string) => any;
+    "update:label": (value: string) => any;
+}, string, import("vue").PublicProps, Readonly<__VLS_PublicProps> & Readonly<{
+    "onUpdate:modelValue"?: ((value: string) => any) | undefined;
+    "onUpdate:label"?: ((value: string) => any) | undefined;
+}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDebug/LibDebug.vue

@@ -18,84 +18,56 @@
 		</LibButton>
 	</div>
 	<pre v-if="value"
-		:class="`
+		:class="
+  `
 			debug--value
 			[tab-size:${tab}]
 		`
-		"
+"
 	>{{ getStringValue(value) }}</pre>
-	<pre v-if="value === undefined"><slot/></pre>
+	<pre v-if="value === void 0"><slot/></pre>
 </div>
 </template>
 
-
-<script setup lang="ts">
-import { type PropType, useSlots } from "vue"
-
-import Icon from "../Icon/Icon.vue"
-import LibButton from "../LibButton/LibButton.vue"
-
-const $slots = useSlots()
-
-const props = withDefaults(defineProps<{
-	/** The value to debug, can be anything. */
-	// eslint-disable-next-line vue/no-restricted-props
-	value?: any
-	/** Sets the tab size in css. Defaults to 3. */
-	tab?: number
-	title?: string
-}>(), {
-	tab: 3,
-	title: "Debug",
-	value: undefined,
-})
-
-const getStringValue = (value: any): string => value === undefined
-	? "undefined"
-	: typeof value === "string"
-		? value
-		: JSON.stringify(value, null, "\t")
-
-const findText = (children: any[]): string => {
-	let res = ""
-	for (const child of children) {
-		if (child.children) {
-			if (typeof child.children === "string") res += child.children as string
-			else res += findText(child.children)
-		} else {
-			res += "\n"
-		}
-	}
-	return res
-}
-const copy = (): void => {
-	if (navigator.clipboard) {
-		const text = props.value
-			? getStringValue(props.value)
-			: $slots.default?.()?.[0]?.children
-			? findText([...$slots.default()[0]!.children as any[]])
-			: undefined
-		if (text === undefined) {
-			// eslint-disable-next-line no-console
-			console.warn("Cannot copy text, can't generate string value from `getStringValue` or `the default slot`.")
-			return
-		}
-		navigator.clipboard.writeText(text).catch(() => { })
-	}
-}
+<script setup>
+import { useSlots } from "vue";
+import Icon from "../Icon/Icon.vue";
+import LibButton from "../LibButton/LibButton.vue";
+const $slots = useSlots();
+const props = defineProps({
+  value: { type: null, required: false, default: void 0 },
+  tab: { type: Number, required: false, default: 3 },
+  title: { type: String, required: false, default: "Debug" }
+});
+const getStringValue = (value) => value === void 0 ? "undefined" : typeof value === "string" ? value : JSON.stringify(value, null, "	");
+const findText = (children) => {
+  let res = "";
+  for (const child of children) {
+    if (child.children) {
+      if (typeof child.children === "string") res += child.children;
+      else res += findText(child.children);
+    } else {
+      res += "\n";
+    }
+  }
+  return res;
+};
+const copy = () => {
+  if (navigator.clipboard) {
+    const text = props.value ? getStringValue(props.value) : $slots.default?.()?.[0]?.children ? findText([...$slots.default()[0].children]) : void 0;
+    if (text === void 0) {
+      console.warn("Cannot copy text, can't generate string value from `getStringValue` or `the default slot`.");
+      return;
+    }
+    navigator.clipboard.writeText(text).catch(() => {
+    });
+  }
+};
 </script>
 
-<script lang="ts">
-
-/**
- * Simple debug component for displaying objects and strings with whitespace.
- *
- * In the case of objects, it JSON.stringifies them with a tab character. The tab width can be controlled with the `tab` prop, which will set the `tab-size` css property on the element.
- *
- * The value can be undefined, it will just display undefined.
- */
+<script>
 export default {
-	name: "lib-debug",
-	// https://v3.vuejs.org/guide/typescript-support.html#annotating-props
-}
+  name: "lib-debug"
+  // https://v3.vuejs.org/guide/typescript-support.html#annotating-props
+};
 </script>

package/dist/runtime/components/LibDebug/LibDebug.vue.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Simple debug component for displaying objects and strings with whitespace.
+ *
+ * In the case of objects, it JSON.stringifies them with a tab character. The tab width can be controlled with the `tab` prop, which will set the `tab-size` css property on the element.
+ *
+ * The value can be undefined, it will just display undefined.
+ */
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    /** The value to debug, can be anything. */
+    value?: any;
+    /** Sets the tab size in css. Defaults to 3. */
+    tab?: number;
+    title?: string;
+}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    /** The value to debug, can be anything. */
+    value?: any;
+    /** Sets the tab size in css. Defaults to 3. */
+    tab?: number;
+    title?: string;
+}> & Readonly<{}>, {
+    value: any;
+    title: string;
+    tab: number;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/LibDevOnly/LibDevOnly.vue

@@ -1,8 +1,9 @@
 <template>
 <DevOnly>
-	<slot v-if="doShow && $attrs?.['as-child'] !== undefined"/>
+	<slot v-if="doShow && $attrs?.['as-child'] !== void 0"/>
 	<div v-else-if="doShow"
-		:class="twMerge(`
+		:class="twMerge(
+  `
 			dev-only
 			border
 			border-dashed
@@ -11,41 +12,27 @@
 			py-1
 			never-packaged
 		`,
-			($attrs.class as string)
-		)"
-		v-bind="{...$attrs, class: undefined}"
+  $attrs.class
+)"
+		v-bind="{ ...$attrs, class: void 0 }"
 	>
 		<slot/>
 	</div>
 </DevOnly>
 </template>
-<script lang="ts" setup>
-import { computed, inject, ref, useAttrs } from "vue"
-
-import { showDevOnlyInjectionKey } from "../../composables/useShowDevOnlyKey.js"
-import { twMerge } from "../../utils/twMerge.js"
-const $attrs = useAttrs()
-
-const props = withDefaults(defineProps<{
-	show?: boolean
-}>(), {
-	show: false
-})
-
-const injectedShow = inject(showDevOnlyInjectionKey, ref(false))
-const doShow = computed(() => props.show || injectedShow.value)
 
+<script setup>
+import { computed, inject, ref, useAttrs } from "vue";
+import { showDevOnlyInjectionKey } from "../../composables/useShowDevOnlyKey.js";
+import { twMerge } from "../../utils/twMerge.js";
+const $attrs = useAttrs();
+const props = defineProps({
+  show: { type: Boolean, required: false, default: false }
+});
+const injectedShow = inject(showDevOnlyInjectionKey, ref(false));
+const doShow = computed(() => props.show || injectedShow.value);
 </script>
-<script lang="ts">
-interface Props {
-	show?: boolean
-}
 
-// Not sure why nuxt's types aren't correctly getting detected
-// This should be enough to bypass the type lint error.
-declare module "vue" {
-	export interface GlobalComponents {
-		DevOnly: any
-	}
-}
+<script>
+
 </script>

package/dist/runtime/components/LibDevOnly/LibDevOnly.vue.d.ts

@@ -0,0 +1,22 @@
+declare module "vue" {
+    interface GlobalComponents {
+        DevOnly: any;
+    }
+}
+declare const _default: __VLS_WithSlots<import("vue").DefineComponent<{
+    show?: boolean;
+}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
+    show?: boolean;
+}> & Readonly<{}>, {
+    show: boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
+    default?: (props: {}) => any;
+} & {
+    default?: (props: {}) => any;
+}>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};