pxd 0.0.64 → 0.1.2

package/dist/components/tooltip/index.vue

@@ -1,83 +1,138 @@
 <script setup>
 import { computed } from "vue";
-import { getFallbackValue } from "../../utils/get";
-import { isTouchDevice } from "../../utils/is";
+import { getFallbackValue } from "../../utils/helper.js";
+import { isTouchDevice } from "../../utils/is.js";
 import PPopover from "../popover/index.vue";
 defineOptions({
-  name: "PTooltip",
-  inheritAttrs: false
+	name: "PTooltip",
+	inheritAttrs: false
 });
 const props = defineProps({
-  offset: { type: Number, required: false },
-  content: { type: String, required: false },
-  variant: { type: String, required: false, default: "default" },
-  position: { type: null, required: false, default: "top" },
-  disabled: { type: Boolean, required: false },
-  showDelay: { type: Number, required: false, default: 300 },
-  hideDelay: { type: Number, required: false, default: 300 },
-  showArrow: { type: Boolean, required: false, default: true },
-  desktopOnly: { type: Boolean, required: false },
-  contentClass: { type: [String, Array, Object], required: false },
-  contentStyle: { type: [Object, String], required: false }
+	offset: {
+		type: Number,
+		required: false
+	},
+	content: {
+		type: String,
+		required: false
+	},
+	variant: {
+		type: String,
+		required: false,
+		default: "default"
+	},
+	position: {
+		type: null,
+		required: false,
+		default: "top"
+	},
+	disabled: {
+		type: Boolean,
+		required: false
+	},
+	showDelay: {
+		type: Number,
+		required: false,
+		default: 300
+	},
+	hideDelay: {
+		type: Number,
+		required: false,
+		default: 300
+	},
+	triggerSelector: {
+		type: String,
+		required: false
+	},
+	showArrow: {
+		type: Boolean,
+		required: false,
+		default: true
+	},
+	desktopOnly: {
+		type: Boolean,
+		required: false
+	},
+	contentClass: {
+		type: [
+			String,
+			Array,
+			Object
+		],
+		required: false
+	},
+	contentStyle: {
+		type: [Object, String],
+		required: false
+	}
 });
 const VARIANTS = {
-  invert: {
-    bg: "var(--color-background-100)",
-    base: "text-foreground border"
-  },
-  default: {
-    bg: "var(--color-gray-1000)",
-    base: "text-gray-100"
-  },
-  error: {
-    bg: "var(--color-red-700)",
-    base: "text-gray-100 dark:text-gray-1000"
-  },
-  warning: {
-    bg: "var(--color-amber-700)",
-    base: "text-gray-1000 dark:text-gray-100"
-  },
-  success: {
-    bg: "var(--color-green-700)",
-    base: "text-gray-100 dark:text-gray-1000"
-  },
-  violet: {
-    bg: "var(--color-purple-700)",
-    base: "text-gray-100 dark:text-gray-1000"
-  }
+	invert: {
+		bg: "var(--color-background-100)",
+		base: "text-foreground border variant-invert"
+	},
+	default: {
+		bg: "var(--color-gray-1000)",
+		base: "text-gray-100"
+	},
+	error: {
+		bg: "var(--color-red-700)",
+		base: "text-gray-100 dark:text-gray-1000"
+	},
+	warning: {
+		bg: "var(--color-amber-700)",
+		base: "text-gray-1000 dark:text-gray-100"
+	},
+	success: {
+		bg: "var(--color-green-700)",
+		base: "text-gray-100 dark:text-gray-1000"
+	},
+	violet: {
+		bg: "var(--color-purple-700)",
+		base: "text-gray-100 dark:text-gray-1000"
+	}
 };
 const computedVariant = computed(() => getFallbackValue(props.variant, VARIANTS, "default"));
 const isDisabled = computed(() => {
-  return props.disabled || props.desktopOnly && isTouchDevice();
+	return props.disabled || props.desktopOnly && isTouchDevice();
 });
-const computedClasses = computed(() => {
-  return [
-    "px-3 py-2 rounded-md text-13 break-words shadow-tooltip whitespace-pre-line bg-(--popover-arrow-color)",
-    computedVariant.value.base,
-    props.contentClass
-  ].join(" ");
+const contentClassComputed = computed(() => {
+	const classes = [
+		"px-3 py-2 rounded-md text-13 break-words whitespace-pre-line bg-(--popover-arrow-color)",
+		computedVariant.value.base,
+		props.contentClass
+	];
+	return classes;
 });
 </script>
 
 <template>
   <PPopover
+    data-tooltip
     role="tooltip"
     class="pxd-tooltip"
+    :data-variant="variant"
     :position="position"
     :disabled="isDisabled"
     :show-arrow="showArrow"
     :show-delay="showDelay"
     :hide-delay="hideDelay"
-    wrapper-class="max-sm:data-[position^=top]:px-1 max-sm:data-[position^=bottom]:px-1 max-sm:data-[position^=left]:pl-1 max-sm:data-[position^=right]:pr-1"
+    :fill-trigger-width="false"
+    :trigger-selector="triggerSelector"
+    wrapper-class="max-sm:data-[position^=top]:px-1 max-sm:data-[position^=bottom]:px-1 max-sm:data-[position^=left]:ps-1 max-sm:data-[position^=right]:pe-1"
     :arrow-color="computedVariant.bg"
-    :content-class="computedClasses"
+    :content-class="contentClassComputed"
     :content-style="contentStyle"
     v-bind="$attrs"
   >
     <slot />
 
-    <template #content>
-      <slot name="content">
+    <template #content="{ activeTrigger, activeTriggerIndex }">
+      <slot
+        name="content"
+        :active-trigger="activeTrigger"
+        :active-trigger-index="activeTriggerIndex"
+      >
         {{ content }}
       </slot>
     </template>

package/dist/components/tooltip/types.d.ts

@@ -9,6 +9,7 @@ export interface TooltipProps {
   disabled?: boolean
   showDelay?: number
   hideDelay?: number
+  triggerSelector?: string
   showArrow?: boolean
   desktopOnly?: boolean
   contentClass?: ComponentClass

package/dist/components/tree/index.d.vue.ts

@@ -0,0 +1,108 @@
+import type { ComponentValue } from '../../types/shared';
+import type { TreeModelValue, TreeOption, TreeProps } from './types';
+declare function expandAll(): void;
+declare function collapseAll(): void;
+declare function scrollToKey(value: ComponentValue): void;
+declare function setActiveKey(value: ComponentValue): void;
+/**
+ * Reads the whole index rather than the rendered rows: a collapsed subtree still holds checked
+ * nodes, and this is the same set, in the same document order, that `change` reports.
+ */
+declare function getCheckedKeys(includeIndeterminate?: boolean): ComponentValue[];
+declare function getVisibleKeys(): ComponentValue[];
+/** The source node behind a key, collapsed subtree included, so callers never lose data the tree hides. */
+declare function getData(value: ComponentValue): TreeOption | undefined;
+declare var __VLS_1: {}, __VLS_22: any, __VLS_25: {
+    node: TreeOption;
+    depth: number;
+    expanded: boolean;
+}, __VLS_28: {
+    node: TreeOption;
+    depth: number;
+    expanded: boolean;
+}, __VLS_31: {
+    node: TreeOption;
+    depth: number;
+}, __VLS_34: {
+    node: TreeOption;
+}, __VLS_37: {
+    node: TreeOption;
+    depth: number;
+}, __VLS_49: {}, __VLS_57: {
+    node: TreeOption | undefined;
+};
+type __VLS_Slots = {} & {
+    search?: (props: typeof __VLS_1) => any;
+} & {
+    node?: (props: typeof __VLS_22) => any;
+} & {
+    'node-switcher'?: (props: typeof __VLS_25) => any;
+} & {
+    'node-icon'?: (props: typeof __VLS_28) => any;
+} & {
+    'node-content'?: (props: typeof __VLS_31) => any;
+} & {
+    'node-suffix'?: (props: typeof __VLS_34) => any;
+} & {
+    'node-drag-handle'?: (props: typeof __VLS_37) => any;
+} & {
+    empty?: (props: typeof __VLS_49) => any;
+} & {
+    'node-drag-preview'?: (props: typeof __VLS_57) => any;
+};
+declare const __VLS_base: import("vue").DefineComponent<TreeProps, {
+    focus: () => void | undefined;
+    scrollToKey: typeof scrollToKey;
+    setActiveKey: typeof setActiveKey;
+    expandKey: (value: ComponentValue) => void;
+    collapseKey: (value: ComponentValue) => void;
+    expandAll: typeof expandAll;
+    collapseAll: typeof collapseAll;
+    getCheckedKeys: typeof getCheckedKeys;
+    getVisibleKeys: typeof getVisibleKeys;
+    getData: typeof getData;
+    activeIndex: import("vue").ShallowRef<number>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (args_0: import("./types").TreeChangeDetail) => any;
+    "update:modelValue": (args_0: TreeModelValue) => any;
+    expand: (args_0: import("./types").TreeNodeDetail) => any;
+    collapse: (args_0: import("./types").TreeNodeDetail) => any;
+    move: (args_0: import("./types").TreeMoveDetail) => any;
+    "update:data": (args_0: import("./types").TreeOptions) => any;
+    "update:expandedKeys": (args_0: ComponentValue[]) => any;
+    "update:searchValue": (args_0: string) => any;
+}, string, import("vue").PublicProps, Readonly<TreeProps> & Readonly<{
+    onChange?: ((args_0: import("./types").TreeChangeDetail) => any) | undefined;
+    "onUpdate:modelValue"?: ((args_0: TreeModelValue) => any) | undefined;
+    onExpand?: ((args_0: import("./types").TreeNodeDetail) => any) | undefined;
+    onCollapse?: ((args_0: import("./types").TreeNodeDetail) => any) | undefined;
+    onMove?: ((args_0: import("./types").TreeMoveDetail) => any) | undefined;
+    "onUpdate:data"?: ((args_0: import("./types").TreeOptions) => any) | undefined;
+    "onUpdate:expandedKeys"?: ((args_0: ComponentValue[]) => any) | undefined;
+    "onUpdate:searchValue"?: ((args_0: string) => any) | undefined;
+}>, {
+    data: import("./types").TreeOptions;
+    disabled: boolean;
+    itemSize: number;
+    overScan: number;
+    multiple: boolean;
+    virtual: boolean;
+    searchPlaceholder: string;
+    indent: number;
+    showIcon: boolean;
+    draggable: boolean;
+    checkStrictly: boolean;
+    expandOnClick: boolean;
+    childrenField: string;
+    filterable: boolean;
+    highlightMatch: boolean;
+    defaultSearchValue: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, 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;
+    };
+};