@toife/vue 3.7.2 → 3.7.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -98,6 +98,7 @@ The default prefix is `t-`. The **Tag** column is `prefix` + name (e.g. `t-butto
98
98
  | `t-segmented-field` | SegmentedField |
99
99
  | `t-skeleton` | Skeleton |
100
100
  | `t-switch` | Switch |
101
+ | `t-tag-field` | TagField |
101
102
  | `t-tabs` | Tabs |
102
103
  | `t-toast` | Toast |
103
104
  | `t-toast-content` | ToastContent |
@@ -34,5 +34,6 @@ export * from './dropdown';
34
34
  export * from './select';
35
35
  export * from './slide-range';
36
36
  export * from './tag';
37
+ export * from './tag-field';
37
38
  export * from './tooltip';
38
39
  export * from './virtual-list';
@@ -0,0 +1 @@
1
+ export { default as TagField } from './tag-field.vue';
@@ -0,0 +1,33 @@
1
+ import { TagFieldProps } from '../../core';
2
+ declare const _default: import('vue').DefineComponent<TagFieldProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {} & {
3
+ blur: (ev: FocusEvent) => any;
4
+ focus: (ev: FocusEvent) => any;
5
+ input: (text: string) => any;
6
+ "update:modelValue": (value: string[]) => any;
7
+ add: (tag: string) => any;
8
+ remove: (tag: string) => any;
9
+ }, string, import('vue').PublicProps, Readonly<TagFieldProps> & Readonly<{
10
+ onBlur?: ((ev: FocusEvent) => any) | undefined;
11
+ onFocus?: ((ev: FocusEvent) => any) | undefined;
12
+ onInput?: ((text: string) => any) | undefined;
13
+ "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
14
+ onAdd?: ((tag: string) => any) | undefined;
15
+ onRemove?: ((tag: string) => any) | undefined;
16
+ }>, {
17
+ role: string;
18
+ shape: string;
19
+ size: import('../../core').TagFieldSize;
20
+ direction: import('../../core').AppDirection;
21
+ variant: import('../../core').TagFieldVariant;
22
+ disabled: boolean;
23
+ message: string;
24
+ max: number | string;
25
+ modelValue: string[];
26
+ readonly: boolean;
27
+ placeholder: string;
28
+ separators: string[];
29
+ allowDuplicates: boolean;
30
+ addOnBlur: boolean;
31
+ suggestions: string[];
32
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
33
+ export default _default;
@@ -32,6 +32,7 @@ export * from './slide-range';
32
32
  export * from './switch';
33
33
  export * from './tabs';
34
34
  export * from './tag';
35
+ export * from './tag-field';
35
36
  export * from './toast';
36
37
  export * from './toolbar';
37
38
  export * from './tooltip';
@@ -8,8 +8,19 @@ export declare const getScrollbarAttrs: (options: ScrollbarAttrOptions) => {
8
8
  [x: string]: string;
9
9
  };
10
10
  };
11
- export declare const getScrollbarContentAttrs: () => {
12
- class: string[];
11
+ /**
12
+ * An axis only scrolls natively while it really overflows. Sub-pixel overflow
13
+ * would otherwise keep the wheel latched on the port with nothing to scroll,
14
+ * instead of chaining to the ancestor.
15
+ */
16
+ export declare const getScrollbarContentAttrs: (options: {
17
+ x: boolean;
18
+ y: boolean;
19
+ }) => {
20
+ class: (string | {
21
+ "scroll-x": boolean;
22
+ "scroll-y": boolean;
23
+ })[];
13
24
  };
14
25
  export declare const getScrollbarTrackAttrs: (options: ScrollbarTrackAttrOptions) => {
15
26
  class: (string | {
@@ -0,0 +1,3 @@
1
+ export * from './tag-field.constants';
2
+ export * from './tag-field.type';
3
+ export * from './tag-field.logic';
@@ -0,0 +1,20 @@
1
+ /**
2
+ * TagField Default Props
3
+ */
4
+ export declare const TAG_FIELD_DEFAULT_PROPS: {
5
+ readonly modelValue: () => never[];
6
+ readonly variant: "outline";
7
+ readonly size: "standard";
8
+ readonly role: undefined;
9
+ readonly shape: undefined;
10
+ readonly direction: undefined;
11
+ readonly disabled: false;
12
+ readonly readonly: false;
13
+ readonly placeholder: "";
14
+ readonly message: "";
15
+ readonly max: undefined;
16
+ readonly separators: () => string[];
17
+ readonly allowDuplicates: false;
18
+ readonly addOnBlur: false;
19
+ readonly suggestions: () => never[];
20
+ };
@@ -0,0 +1,46 @@
1
+ import { TagFieldAttrOptions } from './tag-field.type';
2
+ export declare const getTagFieldAttrs: (options: TagFieldAttrOptions) => {
3
+ class: (string | {
4
+ disabled: boolean;
5
+ focus: boolean;
6
+ readonly: boolean;
7
+ full: boolean;
8
+ })[];
9
+ };
10
+ export declare const getTagFieldContentAttrs: () => {
11
+ class: string[];
12
+ };
13
+ export declare const getTagFieldChipAttrs: () => {
14
+ class: string[];
15
+ };
16
+ export declare const getTagFieldTextAttrs: () => {
17
+ class: string[];
18
+ };
19
+ export declare const getTagFieldRemoveAttrs: () => {
20
+ class: string[];
21
+ };
22
+ export declare const getTagFieldInputAttrs: () => {
23
+ class: string[];
24
+ };
25
+ export declare const getTagFieldMessageAttrs: () => {
26
+ class: string[];
27
+ };
28
+ export declare const getTagFieldSuggestionsAttrs: () => {
29
+ class: string[];
30
+ };
31
+ export declare const getTagFieldSuggestionAttrs: () => {
32
+ class: string[];
33
+ };
34
+ /**
35
+ * Clean the text of one tag: trimmed, inner whitespace collapsed.
36
+ */
37
+ export declare const normalizeTagText: (text: string) => string;
38
+ /**
39
+ * Split pasted text into tags at every separator that is a single character
40
+ * (`Enter` counts as a line break) and drop the empty ones.
41
+ */
42
+ export declare const splitTagText: (text: string, separators: string[]) => string[];
43
+ /**
44
+ * Whether a tag is already in the list (case-insensitive).
45
+ */
46
+ export declare const hasTag: (tags: string[], tag: string) => boolean;
@@ -0,0 +1,52 @@
1
+ import { AppDirection } from '../app/app.type';
2
+ export type TagFieldVariant = "outline" | "fill" | "underline";
3
+ export type TagFieldSize = string;
4
+ export type TagFieldProps = {
5
+ modelValue?: string[];
6
+ name?: string;
7
+ variant?: TagFieldVariant;
8
+ role?: string;
9
+ shape?: string;
10
+ size?: TagFieldSize;
11
+ direction?: AppDirection;
12
+ id?: string;
13
+ placeholder?: string;
14
+ disabled?: boolean;
15
+ readonly?: boolean;
16
+ autocomplete?: string;
17
+ maxLength?: number | string;
18
+ tabindex?: number | string;
19
+ message?: string;
20
+ /** Maximum number of tags; once reached the text input is hidden. */
21
+ max?: number | string;
22
+ /** `KeyboardEvent.key` values (and pasted characters) that turn the text into a tag. */
23
+ separators?: string[];
24
+ /** Allow the same tag twice. Comparison ignores case. */
25
+ allowDuplicates?: boolean;
26
+ /** Turn the text left in the input into a tag when it loses focus. */
27
+ addOnBlur?: boolean;
28
+ /** Tags offered under the field; picking one adds it. */
29
+ suggestions?: string[];
30
+ };
31
+ export type TagFieldEvent = {
32
+ (e: "update:modelValue", value: string[]): void;
33
+ /** A tag was added by the user. */
34
+ (e: "add", tag: string): void;
35
+ /** A tag was removed by the user. */
36
+ (e: "remove", tag: string): void;
37
+ /** The text being typed changed (use it to load `suggestions`). */
38
+ (e: "input", text: string): void;
39
+ (e: "focus", ev: FocusEvent): void;
40
+ (e: "blur", ev: FocusEvent): void;
41
+ };
42
+ export type TagFieldAttrOptions = {
43
+ role: string;
44
+ shape: string;
45
+ size: string;
46
+ direction: string;
47
+ variant: TagFieldVariant;
48
+ disabled: boolean;
49
+ focus: boolean;
50
+ readonly: boolean;
51
+ full: boolean;
52
+ };