@naptics/vue-collection 0.2.15 → 0.3.1

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.
Files changed (171) hide show
  1. package/.github/workflows/build.yml +26 -0
  2. package/.github/workflows/deploy-demo.yml +46 -0
  3. package/.github/workflows/deploy-lib.yml +59 -0
  4. package/.gitlab-ci.yml +57 -0
  5. package/.nvmrc +1 -0
  6. package/.prettierrc +8 -0
  7. package/.vscode/extensions.json +10 -0
  8. package/.vscode/launch.json +23 -0
  9. package/.vscode/settings.json +13 -0
  10. package/babel.config.json +3 -0
  11. package/components/NAlert.d.ts +1 -44
  12. package/components/NBadge.d.ts +1 -133
  13. package/components/NBreadcrub.d.ts +2 -106
  14. package/components/NBreadcrub.js +1 -1
  15. package/components/NButton.d.ts +2 -118
  16. package/components/NCheckbox.d.ts +1 -32
  17. package/components/NCheckboxLabel.d.ts +1 -45
  18. package/components/NCheckboxLabel.js +1 -1
  19. package/components/NCrudModal.d.ts +7 -251
  20. package/components/NCrudModal.js +1 -1
  21. package/components/NDialog.d.ts +1 -110
  22. package/components/NDialog.js +1 -1
  23. package/components/NDropdown.d.ts +1 -69
  24. package/components/NDropdown.js +1 -1
  25. package/components/NDropzone.d.ts +1 -115
  26. package/components/NDropzone.js +1 -1
  27. package/components/NForm.d.ts +1 -23
  28. package/components/NFormModal.d.ts +7 -151
  29. package/components/NIconButton.d.ts +3 -159
  30. package/components/NIconButton.js +1 -1
  31. package/components/NIconCircle.d.ts +1 -87
  32. package/components/NInput.d.ts +1 -164
  33. package/components/NInput.js +1 -1
  34. package/components/NInputPhone.d.ts +2 -114
  35. package/components/NInputPhone.js +1 -1
  36. package/components/NInputSelect.d.ts +2 -187
  37. package/components/NInputSelect.js +1 -1
  38. package/components/NInputSuggestion.d.ts +2 -155
  39. package/components/NInputSuggestion.js +1 -1
  40. package/components/NLink.d.ts +6 -70
  41. package/components/NLink.js +8 -1
  42. package/components/NList.d.ts +1 -43
  43. package/components/NList.js +1 -1
  44. package/components/NLoadingIndicator.d.ts +1 -49
  45. package/components/NModal.d.ts +12 -250
  46. package/components/NModal.js +15 -9
  47. package/components/NPagination.d.ts +1 -63
  48. package/components/NSearchbar.d.ts +1 -56
  49. package/components/NSearchbarList.d.ts +3 -63
  50. package/components/NSearchbarList.js +1 -1
  51. package/components/NSelect.d.ts +2 -148
  52. package/components/NSelect.js +1 -1
  53. package/components/NSuggestionList.d.ts +3 -126
  54. package/components/NSuggestionList.js +5 -2
  55. package/components/NTable.d.ts +1 -85
  56. package/components/NTable.js +12 -6
  57. package/components/NTableAction.d.ts +2 -46
  58. package/components/NTableAction.js +1 -1
  59. package/components/NTextArea.d.ts +2 -181
  60. package/components/NTextArea.js +1 -1
  61. package/components/NTooltip.d.ts +1 -105
  62. package/components/NTooltip.js +1 -1
  63. package/components/NValInput.d.ts +7 -182
  64. package/components/NValInput.js +1 -1
  65. package/env.d.ts +15 -0
  66. package/eslint.config.cjs +29 -0
  67. package/index.html +13 -0
  68. package/package.json +21 -19
  69. package/postcss.config.js +6 -0
  70. package/public/favicon.ico +0 -0
  71. package/scripts/build-lib.sh +52 -0
  72. package/scripts/sync-node-types.js +70 -0
  73. package/src/demo/App.css +9 -0
  74. package/src/demo/App.tsx +5 -0
  75. package/src/demo/components/ColorGrid.tsx +26 -0
  76. package/src/demo/components/ComponentGrid.tsx +26 -0
  77. package/src/demo/components/ComponentSection.tsx +30 -0
  78. package/src/demo/components/VariantSection.tsx +18 -0
  79. package/src/demo/i18n/de.ts +7 -0
  80. package/src/demo/i18n/en.ts +7 -0
  81. package/src/demo/i18n/index.ts +24 -0
  82. package/src/demo/main.ts +13 -0
  83. package/src/demo/router/index.ts +21 -0
  84. package/src/demo/views/HomeView.tsx +94 -0
  85. package/src/demo/views/NavigationView.tsx +43 -0
  86. package/src/demo/views/presentation/AlertView.tsx +40 -0
  87. package/src/demo/views/presentation/BadgeView.tsx +61 -0
  88. package/src/demo/views/presentation/BreadcrumbView.tsx +52 -0
  89. package/src/demo/views/presentation/ButtonView.tsx +49 -0
  90. package/src/demo/views/presentation/CheckboxView.tsx +59 -0
  91. package/src/demo/views/presentation/DropdownView.tsx +59 -0
  92. package/src/demo/views/presentation/DropzoneView.tsx +39 -0
  93. package/src/demo/views/presentation/IconButtonView.tsx +47 -0
  94. package/src/demo/views/presentation/IconCircleView.tsx +38 -0
  95. package/src/demo/views/presentation/InputView.tsx +179 -0
  96. package/src/demo/views/presentation/LinkView.tsx +60 -0
  97. package/src/demo/views/presentation/ListView.tsx +29 -0
  98. package/src/demo/views/presentation/LoadingIndicatorView.tsx +38 -0
  99. package/src/demo/views/presentation/ModalView.tsx +210 -0
  100. package/src/demo/views/presentation/PaginationView.tsx +25 -0
  101. package/src/demo/views/presentation/SearchbarView.tsx +80 -0
  102. package/src/demo/views/presentation/TableView.tsx +146 -0
  103. package/src/demo/views/presentation/TooltipView.tsx +86 -0
  104. package/src/lib/components/NAlert.tsx +85 -0
  105. package/src/lib/components/NBadge.tsx +75 -0
  106. package/src/lib/components/NBreadcrub.tsx +97 -0
  107. package/src/lib/components/NButton.tsx +80 -0
  108. package/src/lib/components/NCheckbox.tsx +55 -0
  109. package/src/lib/components/NCheckboxLabel.tsx +51 -0
  110. package/src/lib/components/NCrudModal.tsx +133 -0
  111. package/src/lib/components/NDialog.tsx +182 -0
  112. package/src/lib/components/NDropdown.tsx +167 -0
  113. package/src/lib/components/NDropzone.tsx +265 -0
  114. package/src/lib/components/NForm.tsx +32 -0
  115. package/src/lib/components/NFormModal.tsx +66 -0
  116. package/src/lib/components/NIconButton.tsx +92 -0
  117. package/src/lib/components/NIconCircle.tsx +78 -0
  118. package/src/lib/components/NInput.css +11 -0
  119. package/src/lib/components/NInput.tsx +139 -0
  120. package/src/lib/components/NInputPhone.tsx +53 -0
  121. package/src/lib/components/NInputSelect.tsx +126 -0
  122. package/src/lib/components/NInputSuggestion.tsx +80 -0
  123. package/src/lib/components/NLink.tsx +82 -0
  124. package/src/lib/components/NList.tsx +67 -0
  125. package/src/lib/components/NLoadingIndicator.css +46 -0
  126. package/src/lib/components/NLoadingIndicator.tsx +63 -0
  127. package/src/lib/components/NModal.tsx +243 -0
  128. package/src/lib/components/NPagination.css +15 -0
  129. package/src/lib/components/NPagination.tsx +131 -0
  130. package/src/lib/components/NSearchbar.tsx +78 -0
  131. package/src/lib/components/NSearchbarList.tsx +47 -0
  132. package/src/lib/components/NSelect.tsx +128 -0
  133. package/src/lib/components/NSuggestionList.tsx +216 -0
  134. package/src/lib/components/NTable.css +3 -0
  135. package/src/lib/components/NTable.tsx +247 -0
  136. package/src/lib/components/NTableAction.tsx +49 -0
  137. package/src/lib/components/NTextArea.tsx +159 -0
  138. package/src/lib/components/NTooltip.css +37 -0
  139. package/src/lib/components/NTooltip.tsx +250 -0
  140. package/src/lib/components/NValInput.tsx +163 -0
  141. package/src/lib/components/ValidatedForm.ts +71 -0
  142. package/src/lib/components/__tests__/NButton.spec.tsx +26 -0
  143. package/src/lib/components/__tests__/NCheckbox.spec.tsx +39 -0
  144. package/src/lib/i18n/de/vue-collection.json +58 -0
  145. package/src/lib/i18n/en/vue-collection.json +58 -0
  146. package/src/lib/i18n/index.ts +54 -0
  147. package/src/lib/index.ts +2 -0
  148. package/src/lib/jsx.d.ts +13 -0
  149. package/src/lib/utils/__tests__/identifiable.spec.ts +72 -0
  150. package/src/lib/utils/__tests__/validation.spec.ts +92 -0
  151. package/src/lib/utils/breakpoints.ts +47 -0
  152. package/src/lib/utils/component.tsx +131 -0
  153. package/src/lib/utils/deferred.ts +28 -0
  154. package/src/lib/utils/identifiable.ts +87 -0
  155. package/src/lib/utils/stringMaxLength.ts +25 -0
  156. package/src/lib/utils/tailwind.ts +41 -0
  157. package/src/lib/utils/utils.ts +90 -0
  158. package/src/lib/utils/vModel.ts +260 -0
  159. package/src/lib/utils/validation.ts +189 -0
  160. package/src/lib/utils/vue.ts +25 -0
  161. package/tailwind.config.js +38 -0
  162. package/tsconfig.config.json +9 -0
  163. package/tsconfig.demo.json +19 -0
  164. package/tsconfig.json +16 -0
  165. package/tsconfig.lib.json +18 -0
  166. package/tsconfig.vitest.json +8 -0
  167. package/utils/breakpoints.d.ts +1 -1
  168. package/utils/component.d.ts +3 -7
  169. package/utils/component.js +5 -2
  170. package/utils/identifiable.js +5 -1
  171. package/vite.config.ts +28 -0
@@ -63,73 +63,5 @@ export type DropdownItem = {
63
63
  * The `NDropdown` consists of a button and a panel with multiple actions.
64
64
  * It is useful to group multiple actions together in one place.
65
65
  */
66
- declare const Component: import("vue").DefineComponent<{
67
- /**
68
- * The title of the dropdown-button.
69
- */
70
- readonly title: StringConstructor;
71
- /**
72
- * The items of the dropdown.
73
- * The second dimension of the array is used
74
- * to create groups of items, which are visually seperated.
75
- */
76
- readonly items: {
77
- readonly type: PropType<DropdownItem[] | DropdownItem[][]>;
78
- readonly default: () => never[];
79
- };
80
- /**
81
- * If set to `true` the panel is right-aligned to the button.
82
- */
83
- readonly right: BooleanConstructor;
84
- /**
85
- * If set to `true` the dropdown-button is disabled and no interaction is possible.
86
- */
87
- readonly disabled: BooleanConstructor;
88
- /**
89
- * Adds the classes to the Button of the dropdown.
90
- */
91
- readonly buttonClass: StringConstructor;
92
- /**
93
- * A slot to replace the button of the dropdown.
94
- * The passed parameter is the HeadlessUI `MenuButton` which should be
95
- * used to create the button for the Dropdown to work properly.
96
- */
97
- readonly button: PropType<(button: typeof MenuButton) => JSX.Element>;
98
- }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
99
- /**
100
- * The title of the dropdown-button.
101
- */
102
- readonly title: StringConstructor;
103
- /**
104
- * The items of the dropdown.
105
- * The second dimension of the array is used
106
- * to create groups of items, which are visually seperated.
107
- */
108
- readonly items: {
109
- readonly type: PropType<DropdownItem[] | DropdownItem[][]>;
110
- readonly default: () => never[];
111
- };
112
- /**
113
- * If set to `true` the panel is right-aligned to the button.
114
- */
115
- readonly right: BooleanConstructor;
116
- /**
117
- * If set to `true` the dropdown-button is disabled and no interaction is possible.
118
- */
119
- readonly disabled: BooleanConstructor;
120
- /**
121
- * Adds the classes to the Button of the dropdown.
122
- */
123
- readonly buttonClass: StringConstructor;
124
- /**
125
- * A slot to replace the button of the dropdown.
126
- * The passed parameter is the HeadlessUI `MenuButton` which should be
127
- * used to create the button for the Dropdown to work properly.
128
- */
129
- readonly button: PropType<(button: typeof MenuButton) => JSX.Element>;
130
- }>> & {}, {
131
- readonly right: boolean;
132
- readonly disabled: boolean;
133
- readonly items: DropdownItem[] | DropdownItem[][];
134
- }>;
66
+ declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
135
67
  export { Component as NDropdown, Component as default };
@@ -1,4 +1,4 @@
1
- import { isVNode as _isVNode, createVNode as _createVNode } from "vue";
1
+ import { createVNode as _createVNode, isVNode as _isVNode } from "vue";
2
2
  import { createComponentWithSlots } from '../utils/component';
3
3
  import { computed, Transition } from 'vue';
4
4
  import { RouterLink } from 'vue-router';
@@ -57,119 +57,5 @@ export declare const nDropzoneProps: {
57
57
  * The `NDropzone` is an area where files can be added by the user by drag & drop.
58
58
  * Files can also be selected with a file chooser by clicking on the dropzone.
59
59
  */
60
- declare const Component: import("vue").DefineComponent<{
61
- /**
62
- * A description which files are allowed for this dropzone.
63
- * This should include everything the user needs to know about
64
- * the file type / the extensions and the maximum size of the file.
65
- * @see {@link nDropzoneProps.accept}
66
- * @see {@link nDropzoneProps.maxFileSize}
67
- */
68
- readonly description: StringConstructor;
69
- /**
70
- * The maximum amount of files which can be added to the dropzone.
71
- */
72
- readonly maxFiles: {
73
- readonly type: NumberConstructor;
74
- readonly default: 1;
75
- };
76
- /**
77
- * Specifies which file types are accepted. The same syntax as with inputs of type file is used.
78
- * Make sure to explain the requirements to the user in the {@link nDropzoneProps.description}.
79
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers
80
- */
81
- readonly accept: StringConstructor;
82
- /**
83
- * Specifies the maximum size of an individual file in bytes.
84
- * Make sure to explain the max size to the user in the {@link nDropzoneProps.description}.
85
- */
86
- readonly maxFileSize: {
87
- readonly type: NumberConstructor;
88
- readonly default: number;
89
- };
90
- /**
91
- * The maximum length of the file names.
92
- * Files names longer than the specified amount of characters will be shortened.
93
- * @see {@link maxLengthSplitCenter}
94
- */
95
- readonly maxLengthFileNames: {
96
- readonly type: NumberConstructor;
97
- readonly default: 35;
98
- };
99
- /**
100
- * A tailwind height class, which is applied to the dropzone area.
101
- * It is recommended to use `min-h-*` classes,
102
- * so the box is always large enough to display it's text.
103
- */
104
- readonly height: {
105
- readonly type: StringConstructor;
106
- readonly default: "min-h-36";
107
- };
108
- /**
109
- * If set to `true`, the dropzone is disabled and does not accept input anymore.
110
- */
111
- readonly disabled: BooleanConstructor;
112
- readonly value: import("vue").PropType<File[]>;
113
- readonly onUpdateValue: import("vue").PropType<(newValue: File[]) => void>;
114
- }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
115
- /**
116
- * A description which files are allowed for this dropzone.
117
- * This should include everything the user needs to know about
118
- * the file type / the extensions and the maximum size of the file.
119
- * @see {@link nDropzoneProps.accept}
120
- * @see {@link nDropzoneProps.maxFileSize}
121
- */
122
- readonly description: StringConstructor;
123
- /**
124
- * The maximum amount of files which can be added to the dropzone.
125
- */
126
- readonly maxFiles: {
127
- readonly type: NumberConstructor;
128
- readonly default: 1;
129
- };
130
- /**
131
- * Specifies which file types are accepted. The same syntax as with inputs of type file is used.
132
- * Make sure to explain the requirements to the user in the {@link nDropzoneProps.description}.
133
- * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/file#unique_file_type_specifiers
134
- */
135
- readonly accept: StringConstructor;
136
- /**
137
- * Specifies the maximum size of an individual file in bytes.
138
- * Make sure to explain the max size to the user in the {@link nDropzoneProps.description}.
139
- */
140
- readonly maxFileSize: {
141
- readonly type: NumberConstructor;
142
- readonly default: number;
143
- };
144
- /**
145
- * The maximum length of the file names.
146
- * Files names longer than the specified amount of characters will be shortened.
147
- * @see {@link maxLengthSplitCenter}
148
- */
149
- readonly maxLengthFileNames: {
150
- readonly type: NumberConstructor;
151
- readonly default: 35;
152
- };
153
- /**
154
- * A tailwind height class, which is applied to the dropzone area.
155
- * It is recommended to use `min-h-*` classes,
156
- * so the box is always large enough to display it's text.
157
- */
158
- readonly height: {
159
- readonly type: StringConstructor;
160
- readonly default: "min-h-36";
161
- };
162
- /**
163
- * If set to `true`, the dropzone is disabled and does not accept input anymore.
164
- */
165
- readonly disabled: BooleanConstructor;
166
- readonly value: import("vue").PropType<File[]>;
167
- readonly onUpdateValue: import("vue").PropType<(newValue: File[]) => void>;
168
- }>> & {}, {
169
- readonly disabled: boolean;
170
- readonly maxFiles: number;
171
- readonly maxFileSize: number;
172
- readonly maxLengthFileNames: number;
173
- readonly height: string;
174
- }>;
60
+ declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
175
61
  export { Component as NDropzone, Component as default };
@@ -1,4 +1,4 @@
1
- import { isVNode as _isVNode, createTextVNode as _createTextVNode, Fragment as _Fragment, createVNode as _createVNode } from "vue";
1
+ import { createVNode as _createVNode, Fragment as _Fragment, createTextVNode as _createTextVNode, isVNode as _isVNode } from "vue";
2
2
  import { trslc } from '../i18n';
3
3
  import { createComponent } from '../utils/component';
4
4
  import { maxLengthSplitCenter } from '../utils/stringMaxLength';
@@ -17,27 +17,5 @@ export declare const nFormProps: {
17
17
  * If it contains a button of type `submit` in it's hierarchy,
18
18
  * it catches the submit event and passes it to the {@link ValidatedForm} in its `form` prop.
19
19
  */
20
- declare const Component: import("vue").DefineComponent<{
21
- /**
22
- * The {@link ValidatedForm} which will be used to validate the inputs.
23
- * All inputs in this forms hierarchy should be added to the {@link ValidatedForm}.
24
- */
25
- readonly form: PropType<ValidatedForm>;
26
- /**
27
- * This is called, when a button of type `submit` in the hierarchy of this view is clicked
28
- * and when the validation of the `form` was successful.
29
- */
30
- readonly onSubmit: PropType<() => void>;
31
- }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
32
- /**
33
- * The {@link ValidatedForm} which will be used to validate the inputs.
34
- * All inputs in this forms hierarchy should be added to the {@link ValidatedForm}.
35
- */
36
- readonly form: PropType<ValidatedForm>;
37
- /**
38
- * This is called, when a button of type `submit` in the hierarchy of this view is clicked
39
- * and when the validation of the `form` was successful.
40
- */
41
- readonly onSubmit: PropType<() => void>;
42
- }>> & {}, {}>;
20
+ declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
43
21
  export { Component as NForm, Component as default };
@@ -25,89 +25,6 @@ export declare const nFormModalProps: {
25
25
  readonly hideHeader: BooleanConstructor;
26
26
  readonly hideFooter: BooleanConstructor;
27
27
  readonly hideX: BooleanConstructor;
28
- readonly title: StringConstructor;
29
- readonly okText: {
30
- readonly type: StringConstructor;
31
- readonly default: string;
32
- };
33
- readonly okColor: {
34
- readonly type: StringConstructor;
35
- readonly default: "primary";
36
- };
37
- readonly closeOnOk: {
38
- readonly type: BooleanConstructor;
39
- readonly default: true;
40
- };
41
- readonly verticalPosition: {
42
- readonly type: PropType<"start" | "center" | "end">;
43
- readonly default: "center";
44
- };
45
- readonly horizontalPosition: {
46
- readonly type: PropType<"start" | "center" | "end">;
47
- readonly default: "center";
48
- };
49
- readonly hideOk: BooleanConstructor;
50
- readonly okDisabled: BooleanConstructor;
51
- readonly cancelText: {
52
- readonly type: StringConstructor;
53
- readonly default: string;
54
- };
55
- readonly cancelColor: {
56
- readonly type: StringConstructor;
57
- readonly default: "default";
58
- };
59
- readonly hideCancel: BooleanConstructor;
60
- readonly onOk: PropType<() => void>;
61
- readonly onCancel: PropType<() => void>;
62
- readonly modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
63
- readonly content: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
64
- readonly header: PropType<() => JSX.Element>;
65
- readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
66
- readonly value: PropType<boolean>;
67
- readonly onUpdateValue: PropType<(newValue: boolean) => void>;
68
- };
69
- /**
70
- * The `NFormModal` is a {@link NModal} with an integrated form.
71
- * When submitting a `NFormModal` the form is first validated and
72
- * only if the validation is succesful the `onOk` event is called.
73
- */
74
- declare const Component: import("vue").DefineComponent<{
75
- /**
76
- * The maximum width of the modal. A regular tailwind class.
77
- */
78
- readonly maxWidth: {
79
- readonly type: PropType<TWMaxWidth>;
80
- readonly default: "max-w-lg";
81
- };
82
- /**
83
- * If set to `true` the modal closes when clicking on the background.
84
- * Default is `false` as the accidental reseting of the whole form is very annoying.
85
- */
86
- readonly closeOnBackground: {
87
- readonly type: BooleanConstructor;
88
- readonly default: false;
89
- };
90
- /**
91
- * The {@link ValidatedForm} to validate the inputs.
92
- * All inputs should be added to the form.
93
- */
94
- readonly form: PropType<ValidatedForm>;
95
- readonly hideHeader: BooleanConstructor;
96
- readonly hideFooter: BooleanConstructor;
97
- readonly hideX: BooleanConstructor;
98
- readonly title: StringConstructor;
99
- readonly okText: {
100
- readonly type: StringConstructor;
101
- readonly default: string;
102
- };
103
- readonly okColor: {
104
- readonly type: StringConstructor;
105
- readonly default: "primary";
106
- };
107
- readonly closeOnOk: {
108
- readonly type: BooleanConstructor;
109
- readonly default: true;
110
- };
111
28
  readonly verticalPosition: {
112
29
  readonly type: PropType<"start" | "center" | "end">;
113
30
  readonly default: "center";
@@ -116,49 +33,6 @@ declare const Component: import("vue").DefineComponent<{
116
33
  readonly type: PropType<"start" | "center" | "end">;
117
34
  readonly default: "center";
118
35
  };
119
- readonly hideOk: BooleanConstructor;
120
- readonly okDisabled: BooleanConstructor;
121
- readonly cancelText: {
122
- readonly type: StringConstructor;
123
- readonly default: string;
124
- };
125
- readonly cancelColor: {
126
- readonly type: StringConstructor;
127
- readonly default: "default";
128
- };
129
- readonly hideCancel: BooleanConstructor;
130
- readonly onOk: PropType<() => void>;
131
- readonly onCancel: PropType<() => void>;
132
- readonly modal: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
133
- readonly content: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
134
- readonly header: PropType<() => JSX.Element>;
135
- readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
136
- readonly value: PropType<boolean>;
137
- readonly onUpdateValue: PropType<(newValue: boolean) => void>;
138
- }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
139
- /**
140
- * The maximum width of the modal. A regular tailwind class.
141
- */
142
- readonly maxWidth: {
143
- readonly type: PropType<TWMaxWidth>;
144
- readonly default: "max-w-lg";
145
- };
146
- /**
147
- * If set to `true` the modal closes when clicking on the background.
148
- * Default is `false` as the accidental reseting of the whole form is very annoying.
149
- */
150
- readonly closeOnBackground: {
151
- readonly type: BooleanConstructor;
152
- readonly default: false;
153
- };
154
- /**
155
- * The {@link ValidatedForm} to validate the inputs.
156
- * All inputs should be added to the form.
157
- */
158
- readonly form: PropType<ValidatedForm>;
159
- readonly hideHeader: BooleanConstructor;
160
- readonly hideFooter: BooleanConstructor;
161
- readonly hideX: BooleanConstructor;
162
36
  readonly title: StringConstructor;
163
37
  readonly okText: {
164
38
  readonly type: StringConstructor;
@@ -172,14 +46,6 @@ declare const Component: import("vue").DefineComponent<{
172
46
  readonly type: BooleanConstructor;
173
47
  readonly default: true;
174
48
  };
175
- readonly verticalPosition: {
176
- readonly type: PropType<"start" | "center" | "end">;
177
- readonly default: "center";
178
- };
179
- readonly horizontalPosition: {
180
- readonly type: PropType<"start" | "center" | "end">;
181
- readonly default: "center";
182
- };
183
49
  readonly hideOk: BooleanConstructor;
184
50
  readonly okDisabled: BooleanConstructor;
185
51
  readonly cancelText: {
@@ -199,21 +65,11 @@ declare const Component: import("vue").DefineComponent<{
199
65
  readonly footer: PropType<(props: import("./NModal").ModalSlotProps) => JSX.Element>;
200
66
  readonly value: PropType<boolean>;
201
67
  readonly onUpdateValue: PropType<(newValue: boolean) => void>;
202
- }>> & {}, {
203
- readonly maxWidth: TWMaxWidth;
204
- readonly hideX: boolean;
205
- readonly hideHeader: boolean;
206
- readonly hideFooter: boolean;
207
- readonly okText: string;
208
- readonly okColor: string;
209
- readonly closeOnOk: boolean;
210
- readonly verticalPosition: "start" | "center" | "end";
211
- readonly horizontalPosition: "start" | "center" | "end";
212
- readonly hideOk: boolean;
213
- readonly okDisabled: boolean;
214
- readonly cancelText: string;
215
- readonly cancelColor: string;
216
- readonly closeOnBackground: boolean;
217
- readonly hideCancel: boolean;
218
- }>;
68
+ };
69
+ /**
70
+ * The `NFormModal` is a {@link NModal} with an integrated form.
71
+ * When submitting a `NFormModal` the form is first validated and
72
+ * only if the validation is succesful the `onOk` event is called.
73
+ */
74
+ declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
219
75
  export { Component as NFormModal, Component as default };
@@ -7,9 +7,7 @@ export declare const nIconButtonProps: {
7
7
  readonly tooltipHide: BooleanConstructor;
8
8
  readonly tooltipShow: BooleanConstructor;
9
9
  readonly tooltipPlacement: {
10
- readonly type: PropType<import("./NTooltip").TooltipPlacement>; /**
11
- * If set to `true` the icon-button is disabled and no interaction is possible.
12
- */
10
+ readonly type: PropType<import("./NTooltip").TooltipPlacement>;
13
11
  readonly default: "auto";
14
12
  };
15
13
  readonly tooltipMaxWidth: {
@@ -55,7 +53,7 @@ export declare const nIconButtonProps: {
55
53
  * The html attribute, which indicates the type of the button.
56
54
  */
57
55
  readonly type: {
58
- readonly type: PropType<"button" | "submit" | "reset">;
56
+ readonly type: PropType<"submit" | "button" | "reset">;
59
57
  readonly default: "button";
60
58
  };
61
59
  /**
@@ -77,159 +75,5 @@ export declare const nIconButtonProps: {
77
75
  /**
78
76
  * The `NIconButton` is a regular button which does not have any text but an icon instead.
79
77
  */
80
- declare const Component: import("vue").DefineComponent<{
81
- readonly tooltipText: StringConstructor;
82
- readonly tooltipContent: PropType<() => JSX.Element>;
83
- readonly tooltipHide: BooleanConstructor;
84
- readonly tooltipShow: BooleanConstructor;
85
- readonly tooltipPlacement: {
86
- readonly type: PropType<import("./NTooltip").TooltipPlacement>; /**
87
- * If set to `true` the icon-button is disabled and no interaction is possible.
88
- */
89
- readonly default: "auto";
90
- };
91
- readonly tooltipMaxWidth: {
92
- readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
93
- readonly default: "max-w-xs";
94
- };
95
- readonly tooltipWrapperClass: StringConstructor;
96
- readonly tooltipContentClass: StringConstructor;
97
- readonly tooltipArrowClass: StringConstructor;
98
- /**
99
- * The icon of the icon-button.
100
- */
101
- readonly icon: {
102
- readonly type: PropType<HeroIcon>;
103
- readonly required: true;
104
- };
105
- /**
106
- * The route of the icon-button. If this is set, the icon-button becomes a {@link RouterLink}.
107
- */
108
- readonly route: PropType<RouteLocationRaw>;
109
- /**
110
- * The color of the icon-button.
111
- */
112
- readonly color: {
113
- readonly type: StringConstructor;
114
- readonly default: "default";
115
- };
116
- /**
117
- * The shade of the icon-button.
118
- */
119
- readonly shade: {
120
- readonly type: NumberConstructor;
121
- readonly default: 500;
122
- };
123
- /**
124
- * The size of the icon in tailwind-units.
125
- */
126
- readonly size: {
127
- readonly type: NumberConstructor;
128
- readonly default: 5;
129
- };
130
- /**
131
- * The html attribute, which indicates the type of the button.
132
- */
133
- readonly type: {
134
- readonly type: PropType<"button" | "submit" | "reset">;
135
- readonly default: "button";
136
- };
137
- /**
138
- * If set to `true` the icon-button is disabled and no interaction is possible.
139
- */
140
- readonly disabled: BooleanConstructor;
141
- /**
142
- * Adds the classes to the icon-button.
143
- * Use this instead of `class` to style the button, because the button is wrapped inside
144
- * a div for the tooltip and `class` would be applied to the wrapping div.
145
- */
146
- readonly buttonClass: StringConstructor;
147
- /**
148
- * This is called when the icon-button is clicked.
149
- * It is only called when the `route` prop is not set on the icon-button.
150
- */
151
- readonly onClick: PropType<() => void>;
152
- }, import("vue").RenderFunction, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, never[], never, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
153
- readonly tooltipText: StringConstructor;
154
- readonly tooltipContent: PropType<() => JSX.Element>;
155
- readonly tooltipHide: BooleanConstructor;
156
- readonly tooltipShow: BooleanConstructor;
157
- readonly tooltipPlacement: {
158
- readonly type: PropType<import("./NTooltip").TooltipPlacement>; /**
159
- * If set to `true` the icon-button is disabled and no interaction is possible.
160
- */
161
- readonly default: "auto";
162
- };
163
- readonly tooltipMaxWidth: {
164
- readonly type: PropType<import("../utils/tailwind").TWMaxWidth>;
165
- readonly default: "max-w-xs";
166
- };
167
- readonly tooltipWrapperClass: StringConstructor;
168
- readonly tooltipContentClass: StringConstructor;
169
- readonly tooltipArrowClass: StringConstructor;
170
- /**
171
- * The icon of the icon-button.
172
- */
173
- readonly icon: {
174
- readonly type: PropType<HeroIcon>;
175
- readonly required: true;
176
- };
177
- /**
178
- * The route of the icon-button. If this is set, the icon-button becomes a {@link RouterLink}.
179
- */
180
- readonly route: PropType<RouteLocationRaw>;
181
- /**
182
- * The color of the icon-button.
183
- */
184
- readonly color: {
185
- readonly type: StringConstructor;
186
- readonly default: "default";
187
- };
188
- /**
189
- * The shade of the icon-button.
190
- */
191
- readonly shade: {
192
- readonly type: NumberConstructor;
193
- readonly default: 500;
194
- };
195
- /**
196
- * The size of the icon in tailwind-units.
197
- */
198
- readonly size: {
199
- readonly type: NumberConstructor;
200
- readonly default: 5;
201
- };
202
- /**
203
- * The html attribute, which indicates the type of the button.
204
- */
205
- readonly type: {
206
- readonly type: PropType<"button" | "submit" | "reset">;
207
- readonly default: "button";
208
- };
209
- /**
210
- * If set to `true` the icon-button is disabled and no interaction is possible.
211
- */
212
- readonly disabled: BooleanConstructor;
213
- /**
214
- * Adds the classes to the icon-button.
215
- * Use this instead of `class` to style the button, because the button is wrapped inside
216
- * a div for the tooltip and `class` would be applied to the wrapping div.
217
- */
218
- readonly buttonClass: StringConstructor;
219
- /**
220
- * This is called when the icon-button is clicked.
221
- * It is only called when the `route` prop is not set on the icon-button.
222
- */
223
- readonly onClick: PropType<() => void>;
224
- }>> & {}, {
225
- readonly color: string;
226
- readonly shade: number;
227
- readonly size: number;
228
- readonly type: "button" | "submit" | "reset";
229
- readonly tooltipHide: boolean;
230
- readonly tooltipShow: boolean;
231
- readonly tooltipPlacement: import("./NTooltip").TooltipPlacement;
232
- readonly tooltipMaxWidth: import("../utils/tailwind").TWMaxWidth;
233
- readonly disabled: boolean;
234
- }>;
78
+ declare const Component: import("vue").DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import("vue").PublicProps>;
235
79
  export { Component as NIconButton, Component as default };
@@ -1,4 +1,4 @@
1
- import { isVNode as _isVNode, createVNode as _createVNode } from "vue";
1
+ import { createVNode as _createVNode, isVNode as _isVNode } from "vue";
2
2
  import { createComponent } from '../utils/component';
3
3
  import { RouterLink } from 'vue-router';
4
4
  import { nButtonProps } from './NButton';