nuance-ui 0.3.0 → 0.3.2

package/dist/runtime/components/collapsible/collapsible-content.vue

@@ -1,76 +0,0 @@
-<script>
-
-</script>
-
-<script setup>
-import { unrefElement, useEventListener } from "@vueuse/core";
-import { computed, onMounted, ref, shallowRef, useTemplateRef, watch } from "vue";
-import Box from "../box.vue";
-import { useCollapsibleState } from "./collapsible-root.vue";
-const props = defineProps({
-  forceMount: { type: Boolean, required: false },
-  is: { type: null, required: false },
-  mod: { type: [Object, Array, null], required: false }
-});
-const ctx = useCollapsibleState();
-const el = useTemplateRef("el");
-const width = ref(0);
-const height = ref(0);
-const isMountAnimationPrevented = ref(ctx.open.value);
-const savedStyle = shallowRef();
-watch(() => ctx.open.value, () => {
-  const node = unrefElement(el);
-  if (!node)
-    return;
-  if (!savedStyle.value) {
-    savedStyle.value = {
-      transitionDuration: node.style.transitionDuration,
-      animationName: node.style.animationName
-    };
-  }
-  node.style.transitionDuration = "0s";
-  node.style.animationName = "none";
-  height.value = node.scrollHeight;
-  width.value = node.scrollWidth;
-  if (!isMountAnimationPrevented.value) {
-    requestAnimationFrame(() => {
-      node.style.transitionDuration = savedStyle.value.transitionDuration;
-      node.style.animationName = savedStyle.value.animationName;
-    });
-  }
-}, { immediate: true, flush: "post" });
-onMounted(() => {
-  requestAnimationFrame(() => {
-    isMountAnimationPrevented.value = false;
-  });
-});
-const isPresent = computed(() => props.forceMount || ctx.open.value);
-const dataState = computed(() => {
-  if (isMountAnimationPrevented.value)
-    return void 0;
-  return ctx.open.value ? "open" : "closed";
-});
-useEventListener(el, "beforematch", () => {
-  requestAnimationFrame(() => ctx.onOpenToggle());
-});
-</script>
-
-<template>
-	<Box
-		v-if='ctx.unmountOnHide.value ? isPresent : true'
-		v-bind='$attrs'
-		:id='ctx.contentId'
-		ref='el'
-		:hidden='isPresent ? void 0 : ctx.unmountOnHide.value ? void 0 : "until-found"'
-		:mod='[{
-  disabled: ctx.disabled,
-  state: dataState
-}, mod]'
-		:style='{
-  "--collapsible-content-height": `${height}px`,
-  "--collapsible-content-width": `${width}px`
-}'
-	>
-		<slot />
-	</Box>
-</template>

package/dist/runtime/components/collapsible/collapsible-content.vue.d.ts

@@ -1,18 +0,0 @@
-import type { BoxProps } from '../box.vue.js';
-export interface CollapsibleContentProps extends BoxProps {
-    /**
-     * Used to force mounting when more control is needed. Useful when
-     * controlling animation with Vue animation libraries.
-     */
-    forceMount?: boolean;
-}
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<CollapsibleContentProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<CollapsibleContentProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: (props: {}) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/components/collapsible/collapsible-root.d.vue.ts

@@ -1,42 +0,0 @@
-import type { Ref } from 'vue';
-import type { BoxProps } from '../box.vue.js';
-export interface CollapsibleRootProps extends BoxProps {
-    /**
-     * The open state of the collapsible when it is initially rendered.
-     * Use when you do not need to control its open state.
-     */
-    defaultOpen?: boolean;
-    /** When `true`, prevents the user from interacting with the collapsible. */
-    disabled?: boolean;
-    /** When `true`, the element will be unmounted on closed state. */
-    unmountOnHide?: boolean;
-}
-interface CollapsibleRootContext {
-    contentId: string;
-    disabled?: Ref<boolean>;
-    open: Ref<boolean>;
-    unmountOnHide: Ref<boolean>;
-    onOpenToggle: () => void;
-}
-export declare const useCollapsibleState: () => CollapsibleRootContext;
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<CollapsibleRootProps & {
-    open?: boolean;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<CollapsibleRootProps & {
-    open?: boolean;
-}> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: (props: {
-        /** Current open state */
-        open: boolean;
-    }) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/components/collapsible/collapsible-root.vue

@@ -1,41 +0,0 @@
-<script>
-import { toRefs } from "vue";
-import { createStrictInjection } from "#imports";
-import Box from "../box.vue";
-const injectionKey = /* @__PURE__ */ Symbol("collapsible-ctx");
-const [useProvide, useInject] = createStrictInjection((state) => state, {
-  name: "CollapsibleRoot",
-  injectionKey
-});
-export const useCollapsibleState = useInject;
-</script>
-
-<script setup>
-const props = defineProps({
-  defaultOpen: { type: Boolean, required: false },
-  disabled: { type: Boolean, required: false },
-  unmountOnHide: { type: Boolean, required: false },
-  is: { type: null, required: false },
-  mod: { type: [Object, Array, null], required: false }
-});
-defineSlots();
-const open = defineModel("open", { type: Boolean, ...{ default: false } });
-const { disabled, unmountOnHide } = toRefs(props);
-useProvide({
-  contentId: "",
-  disabled,
-  open,
-  unmountOnHide,
-  onOpenToggle: () => {
-    if (disabled.value)
-      return;
-    open.value = !open.value;
-  }
-});
-</script>
-
-<template>
-	<Box :mod='[{ disabled, open: open ? "open" : "closed" }, mod]'>
-		<slot :open='open' />
-	</Box>
-</template>

package/dist/runtime/components/collapsible/collapsible-root.vue.d.ts

@@ -1,42 +0,0 @@
-import type { Ref } from 'vue';
-import type { BoxProps } from '../box.vue.js';
-export interface CollapsibleRootProps extends BoxProps {
-    /**
-     * The open state of the collapsible when it is initially rendered.
-     * Use when you do not need to control its open state.
-     */
-    defaultOpen?: boolean;
-    /** When `true`, prevents the user from interacting with the collapsible. */
-    disabled?: boolean;
-    /** When `true`, the element will be unmounted on closed state. */
-    unmountOnHide?: boolean;
-}
-interface CollapsibleRootContext {
-    contentId: string;
-    disabled?: Ref<boolean>;
-    open: Ref<boolean>;
-    unmountOnHide: Ref<boolean>;
-    onOpenToggle: () => void;
-}
-export declare const useCollapsibleState: () => CollapsibleRootContext;
-declare const _default: typeof __VLS_export;
-export default _default;
-declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<CollapsibleRootProps & {
-    open?: boolean;
-}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
-    "update:open": (value: boolean) => any;
-}, string, import("vue").PublicProps, Readonly<CollapsibleRootProps & {
-    open?: boolean;
-}> & Readonly<{
-    "onUpdate:open"?: ((value: boolean) => any) | undefined;
-}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {
-    default?: (props: {
-        /** Current open state */
-        open: boolean;
-    }) => any;
-}>;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/components/collapsible/collapsible-trigger.d.vue.ts

@@ -1,13 +0,0 @@
-declare var __VLS_10: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_10) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/components/collapsible/collapsible-trigger.vue

@@ -1,20 +0,0 @@
-<script setup>
-import Renderless from "../renderless/renderless.vue";
-import { useCollapsibleState } from "./collapsible-root.vue";
-const ctx = useCollapsibleState();
-</script>
-
-<template>
-	<Renderless
-		:mod='{
-  disabled: ctx.disabled?.value,
-  state: ctx.open.value ? "open" : "closed"
-}'
-		:aria-controls='ctx.contentId'
-		:aria-expanded='ctx.open.value'
-		:disabled='ctx.disabled?.value'
-		@click='ctx.onOpenToggle()'
-	>
-		<slot />
-	</Renderless>
-</template>

package/dist/runtime/components/collapsible/collapsible-trigger.vue.d.ts

@@ -1,13 +0,0 @@
-declare var __VLS_10: {};
-type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_10) => any;
-};
-declare const __VLS_base: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-export default _default;
-type __VLS_WithSlots<T, S> = T & {
-    new (): {
-        $slots: S;
-    };
-};

package/dist/runtime/components/collapsible/index.d.ts

@@ -1,3 +0,0 @@
-export type * from './collapsible-content.vue';
-export { type CollapsibleRootProps, useCollapsibleState } from './collapsible-root.vue.js';
-export type * from './collapsible-trigger.vue';

package/dist/runtime/components/collapsible/index.js

@@ -1 +0,0 @@
-export { useCollapsibleState } from "./collapsible-root.vue";

package/dist/runtime/components/transition.vue

@@ -1,42 +0,0 @@
-<script setup>
-import { computed } from "vue";
-const {
-  name = "pop-bottom-left",
-  duration = 250,
-  delay,
-  appear,
-  mode
-} = defineProps({
-  name: { type: String, required: false },
-  duration: { type: Number, required: false },
-  delay: { type: Number, required: false },
-  mode: { type: String, required: false },
-  appear: { type: Boolean, required: false }
-});
-const emit = defineEmits(["afterLeave"]);
-const style = computed(() => ({
-  "--transition-duration": `${duration}ms`,
-  "--transition-delay": delay ? `${delay}ms` : void 0
-}));
-</script>
-
-<template>
-	<Transition
-		:class='$style.root'
-		:style
-		:name
-		:mode
-		:appear
-		@after-leave='() => emit("afterLeave")'
-	>
-		<slot />
-	</Transition>
-</template>
-
-<style module>
-.root{--transition-delay:0ms;--transition-duration:250ms}
-</style>
-
-<style>
-.fade-enter-active,.fade-leave-active{transition:opacity var(--transition-duration) var(--transition-delay) ease}.fade-enter-from,.fade-leave-to{opacity:0}.fade-up-enter-active,.fade-up-leave-active{transform:translateY(0);transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.fade-up-enter-from,.fade-up-leave-to{opacity:0;transform:translateY(30px)}.fade-down-enter-active,.fade-down-leave-active{transform:translateY(0);transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.fade-down-enter-from,.fade-down-leave-to{opacity:0;transform:translateY(-30px)}.fade-left-enter-active,.fade-left-leave-active{transform:translateX(0);transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.fade-left-enter-from,.fade-left-leave-to{opacity:0;transform:translateX(30px)}.fade-right-enter-active,.fade-right-leave-active{transform:translateX(0);transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.fade-right-enter-from,.fade-right-leave-to{opacity:0;transform:translateX(-30px)}.scale-enter-active,.scale-leave-active{transform:scale(1);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.scale-enter-from,.scale-leave-to{opacity:0;transform:scale(0)}.scale-y-enter-active,.scale-y-leave-active{transform:scaleY(1);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.scale-y-enter-from,.scale-y-leave-to{opacity:0;transform:scaleY(0)}.scale-x-enter-active,.scale-x-leave-active{transform:scaleX(1);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.scale-x-enter-from,.scale-x-leave-to{opacity:0;transform:scaleX(0)}.skew-up-enter-active,.skew-up-leave-active{transform:translateY(0) skew(0deg,0deg);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.skew-up-enter-from,.skew-up-leave-to{opacity:0;transform:translateY(-20px) skew(-10deg,-5deg)}.skew-down-enter-active,.skew-down-leave-active{transform:translateY(0) skew(0deg,0deg);transform-origin:bottom;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.skew-down-enter-from,.skew-down-leave-to{opacity:0;transform:translateY(20px) skew(-10deg,-5deg)}.rotate-left-enter-active,.rotate-left-leave-active{transform:translateY(0) rotate(0deg);transform-origin:bottom;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.rotate-left-enter-from,.rotate-left-leave-to{opacity:0;transform:translateY(20px) rotate(-5deg)}.rotate-right-enter-active,.rotate-right-leave-active{transform:translateY(0) rotate(0deg);transform-origin:bottom;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.rotate-right-enter-from,.rotate-right-leave-to{opacity:0;transform:translateY(20px) rotate(5deg)}.slide-down-enter-active,.slide-down-leave-active{transform:translateY(0);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.slide-down-enter-from,.slide-down-leave-to{opacity:0;transform:translateY(-100%)}.slide-up-enter-active,.slide-up-leave-active{transform:translateY(0);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.slide-up-enter-from,.slide-up-leave-to{opacity:0;transform:translateY(100%)}.slide-left-enter-active,.slide-left-leave-active{transform:translateX(0);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.slide-left-enter-from,.slide-left-leave-to{opacity:0;transform:translateX(100%)}.slide-right-enter-active,.slide-right-leave-active{transform:translateX(0);transform-origin:top;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.slide-right-enter-from,.slide-right-leave-to{opacity:0;transform:translateX(-100%)}.pop-enter-active,.pop-leave-active{transform:scale(1);transform-origin:center center;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.pop-enter-from,.pop-leave-to{opacity:0;transform:scale(.9) translateY(10px);transform-origin:center center}.pop-bottom-left-enter-active,.pop-bottom-left-leave-active{transform:scale(1);transform-origin:bottom left;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.pop-bottom-left-enter-from,.pop-bottom-left-leave-to{opacity:0;transform:scale(.9) translateY(10px);transform-origin:bottom left}.pop-bottom-right-enter-active,.pop-bottom-right-leave-active{transform:scale(1);transform-origin:bottom right;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.pop-bottom-right-enter-from,.pop-bottom-right-leave-to{opacity:0;transform:scale(.9) translateY(10px);transform-origin:bottom right}.pop-top-left-enter-active,.pop-top-left-leave-active{transform:scale(1);transform-origin:top left;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.pop-top-left-enter-from,.pop-top-left-leave-to{opacity:0;transform:scale(.9) translateY(-10px);transform-origin:top left}.pop-top-right-enter-active,.pop-top-right-leave-active{transform:scale(1);transform-origin:top right;transition:opacity var(--transition-duration) var(--transition-delay) ease,transform var(--transition-duration) ease}.pop-top-right-enter-from,.pop-top-right-leave-to{opacity:0;transform:scale(.9) translateY(-10px);transform-origin:top right}
-</style>