@3t-transform/threeteeui 0.1.5 → 0.1.7

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 (167) hide show
  1. package/dist/cjs/app-globals-3a1e7e63.js +5 -0
  2. package/dist/cjs/css-shim-211819bc.js +6 -0
  3. package/dist/cjs/dom-9deb26c8.js +75 -0
  4. package/dist/cjs/index-11cfdabe.js +3297 -0
  5. package/dist/cjs/{index-906c2757.js → index-451f61dd.js} +3 -102
  6. package/dist/cjs/loader.cjs.js +19 -4
  7. package/dist/cjs/shadow-css-bf3843d2.js +389 -0
  8. package/dist/cjs/{tttx-button_2.cjs.entry.js → tttx-button.cjs.entry.js} +24 -50
  9. package/dist/cjs/tttx-form.cjs.entry.js +364 -364
  10. package/dist/cjs/tttx-icon.cjs.entry.js +21 -0
  11. package/dist/cjs/tttx-keyvalue-block.cjs.entry.js +57 -57
  12. package/dist/cjs/tttx-list.cjs.entry.js +76 -46
  13. package/dist/cjs/tttx-loading-spinner.cjs.entry.js +16 -16
  14. package/dist/cjs/tttx-standalone-input.cjs.entry.js +61 -58
  15. package/dist/cjs/tttx-toolbar.cjs.entry.js +20 -0
  16. package/dist/cjs/tttx.cjs.js +117 -9
  17. package/dist/collection/collection-manifest.json +4 -3
  18. package/dist/collection/components/atoms/tttx-button/test/tttx-button.e2e.js +9 -0
  19. package/dist/collection/components/atoms/tttx-button/test/tttx-button.spec.js +83 -0
  20. package/dist/collection/components/atoms/tttx-button/tttx-button.js +110 -116
  21. package/dist/collection/components/atoms/tttx-button/tttx-button.stories.js +14 -14
  22. package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.e2e.js +9 -0
  23. package/dist/collection/components/atoms/tttx-icon/test/tttx-icon.spec.js +16 -0
  24. package/dist/collection/components/atoms/tttx-icon/tttx-icon.css +4 -0
  25. package/dist/collection/components/atoms/tttx-icon/tttx-icon.js +62 -62
  26. package/dist/collection/components/atoms/tttx-icon/tttx-icon.stories.js +22 -22
  27. package/dist/collection/components/atoms/tttx-keyvalue-block/test/tttx-keyvalue-block.spec.js +216 -0
  28. package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.js +107 -107
  29. package/dist/collection/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.js +38 -38
  30. package/dist/collection/components/atoms/tttx-loading-spinner/Test/tttx-loading-spinner.spec.js +64 -0
  31. package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.js +67 -67
  32. package/dist/collection/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.js +17 -17
  33. package/dist/collection/components/molecules/tttx-form/lib/setErrorState.js +35 -35
  34. package/dist/collection/components/molecules/tttx-form/lib/setErrorState.spec.js +38 -0
  35. package/dist/collection/components/molecules/tttx-form/lib/validityCheck.js +58 -58
  36. package/dist/collection/components/molecules/tttx-form/lib/validityCheck.spec.js +214 -0
  37. package/dist/collection/components/molecules/tttx-form/test/tttx-form.e2e.js +9 -0
  38. package/dist/collection/components/molecules/tttx-form/test/tttx-form.spec.js +232 -0
  39. package/dist/collection/components/molecules/tttx-form/tttx-form.css +32 -3
  40. package/dist/collection/components/molecules/tttx-form/tttx-form.js +364 -364
  41. package/dist/collection/components/molecules/tttx-form/tttx-form.stories.js +127 -127
  42. package/dist/collection/components/molecules/tttx-list/test/ttttx-list.spec.e2e.js +26 -0
  43. package/dist/collection/components/molecules/tttx-list/test/tttx-list.spec.js +183 -0
  44. package/dist/collection/components/molecules/tttx-list/tttx-list.js +105 -105
  45. package/dist/collection/components/molecules/tttx-list/tttx-list.stories.js +43 -43
  46. package/dist/collection/components/molecules/tttx-standalone-input/test/tttx-standalone-input.e2e.js +9 -0
  47. package/dist/collection/components/molecules/tttx-standalone-input/test/tttx-standalone-input.spec.js +219 -0
  48. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.css +32 -3
  49. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.js +627 -572
  50. package/dist/collection/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.js +148 -135
  51. package/dist/collection/components/molecules/tttx-toolbar/test/tttx-toolbar.test.js +0 -0
  52. package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.css +30 -0
  53. package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.js +44 -0
  54. package/dist/collection/components/molecules/tttx-toolbar/tttx-toolbar.stories.js +20 -0
  55. package/dist/collection/components/palette.stories.js +7 -7
  56. package/dist/collection/docs/gettingstarted-developer.stories.js +5 -5
  57. package/dist/collection/icons.js +2838 -2838
  58. package/dist/collection/index.js +1 -1
  59. package/dist/collection/shared/domsanitiser.options.js +14 -14
  60. package/dist/collection/shared/test/domsanitiser.options.spec.js +23 -0
  61. package/dist/components/index.d.ts +1 -9
  62. package/dist/components/index.js +6 -1
  63. package/dist/components/tttx-button.js +48 -59
  64. package/dist/components/tttx-form.js +381 -381
  65. package/dist/components/tttx-icon2.js +29 -29
  66. package/dist/components/tttx-keyvalue-block.js +74 -74
  67. package/dist/components/tttx-list.js +98 -68
  68. package/dist/components/tttx-loading-spinner.js +33 -33
  69. package/dist/components/tttx-standalone-input.js +108 -102
  70. package/dist/components/tttx-toolbar.d.ts +11 -0
  71. package/dist/components/tttx-toolbar.js +36 -0
  72. package/dist/esm/app-globals-0f993ce5.js +3 -0
  73. package/dist/esm/css-shim-9d54a2f2.js +4 -0
  74. package/dist/esm/dom-6be6f662.js +73 -0
  75. package/dist/esm/{index-4010ad69.js → index-0350f122.js} +4 -101
  76. package/dist/esm/index-dbe25028.js +3262 -0
  77. package/dist/esm/loader.js +19 -4
  78. package/dist/esm/polyfills/core-js.js +0 -0
  79. package/dist/esm/polyfills/css-shim.js +1 -1
  80. package/dist/esm/polyfills/dom.js +0 -0
  81. package/dist/esm/polyfills/es5-html-element.js +0 -0
  82. package/dist/esm/polyfills/index.js +0 -0
  83. package/dist/esm/polyfills/system.js +0 -0
  84. package/dist/esm/shadow-css-ed4599f8.js +387 -0
  85. package/dist/esm/{tttx-button_2.entry.js → tttx-button.entry.js} +25 -50
  86. package/dist/esm/tttx-form.entry.js +364 -364
  87. package/dist/esm/tttx-icon.entry.js +17 -0
  88. package/dist/esm/tttx-keyvalue-block.entry.js +57 -57
  89. package/dist/esm/tttx-list.entry.js +76 -46
  90. package/dist/esm/tttx-loading-spinner.entry.js +16 -16
  91. package/dist/esm/tttx-standalone-input.entry.js +61 -58
  92. package/dist/esm/tttx-toolbar.entry.js +16 -0
  93. package/dist/esm/tttx.js +117 -6
  94. package/dist/tttx/app-globals-0f993ce5.js +3 -0
  95. package/dist/tttx/css-shim-9d54a2f2.js +4 -0
  96. package/dist/tttx/dom-6be6f662.js +73 -0
  97. package/dist/tttx/index-dbe25028.js +3262 -0
  98. package/dist/tttx/index.esm.js +1 -0
  99. package/dist/tttx/p-0a85dda4.entry.js +1 -0
  100. package/dist/tttx/{p-3281444a.entry.js → p-1b015a9d.entry.js} +1 -1
  101. package/dist/tttx/p-4f3958fa.entry.js +1 -0
  102. package/dist/tttx/p-5cae1beb.entry.js +1 -0
  103. package/dist/tttx/p-62869344.js +2 -0
  104. package/dist/tttx/p-92465671.entry.js +1 -0
  105. package/dist/tttx/{p-dab7ee1b.entry.js → p-a0179cb1.entry.js} +1 -1
  106. package/dist/tttx/p-cc6644c9.entry.js +1 -0
  107. package/dist/tttx/p-cd1565e0.entry.js +3 -0
  108. package/dist/tttx/shadow-css-ed4599f8.js +387 -0
  109. package/dist/tttx/tttx-button.entry.js +30 -0
  110. package/dist/tttx/tttx-form.entry.js +373 -0
  111. package/dist/tttx/tttx-icon.entry.js +17 -0
  112. package/dist/tttx/tttx-keyvalue-block.entry.js +63 -0
  113. package/dist/tttx/tttx-list.entry.js +1730 -0
  114. package/dist/tttx/tttx-loading-spinner.entry.js +22 -0
  115. package/dist/tttx/tttx-standalone-input.entry.js +66 -0
  116. package/dist/tttx/tttx-toolbar.entry.js +16 -0
  117. package/dist/tttx/tttx.esm.js +129 -1
  118. package/dist/types/components/atoms/tttx-button/test/tttx-button.e2e.d.ts +1 -0
  119. package/dist/types/components/atoms/tttx-button/test/tttx-button.spec.d.ts +1 -0
  120. package/dist/types/components/atoms/tttx-button/tttx-button.d.ts +10 -13
  121. package/dist/types/components/atoms/tttx-button/tttx-button.stories.d.ts +10 -10
  122. package/dist/types/components/atoms/tttx-icon/test/tttx-icon.e2e.d.ts +1 -0
  123. package/dist/types/components/atoms/tttx-icon/test/tttx-icon.spec.d.ts +1 -0
  124. package/dist/types/components/atoms/tttx-icon/tttx-icon.d.ts +5 -5
  125. package/dist/types/components/atoms/tttx-icon/tttx-icon.stories.d.ts +20 -20
  126. package/dist/types/components/atoms/tttx-keyvalue-block/test/tttx-keyvalue-block.spec.d.ts +1 -0
  127. package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.d.ts +7 -7
  128. package/dist/types/components/atoms/tttx-keyvalue-block/tttx-keyvalue-block.stories.d.ts +9 -9
  129. package/dist/types/components/atoms/tttx-loading-spinner/Test/tttx-loading-spinner.spec.d.ts +1 -0
  130. package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.d.ts +6 -6
  131. package/dist/types/components/atoms/tttx-loading-spinner/tttx-loading-spinner.stories.d.ts +17 -17
  132. package/dist/types/components/molecules/tttx-form/lib/setErrorState.d.ts +13 -13
  133. package/dist/types/components/molecules/tttx-form/lib/setErrorState.spec.d.ts +1 -0
  134. package/dist/types/components/molecules/tttx-form/lib/validityCheck.d.ts +17 -17
  135. package/dist/types/components/molecules/tttx-form/lib/validityCheck.spec.d.ts +1 -0
  136. package/dist/types/components/molecules/tttx-form/test/tttx-form.e2e.d.ts +1 -0
  137. package/dist/types/components/molecules/tttx-form/test/tttx-form.spec.d.ts +1 -0
  138. package/dist/types/components/molecules/tttx-form/tttx-form.d.ts +114 -114
  139. package/dist/types/components/molecules/tttx-form/tttx-form.stories.d.ts +13 -13
  140. package/dist/types/components/molecules/tttx-list/test/ttttx-list.spec.e2e.d.ts +1 -0
  141. package/dist/types/components/molecules/tttx-list/test/tttx-list.spec.d.ts +1 -0
  142. package/dist/types/components/molecules/tttx-list/tttx-list.d.ts +11 -11
  143. package/dist/types/components/molecules/tttx-list/tttx-list.stories.d.ts +14 -14
  144. package/dist/types/components/molecules/tttx-standalone-input/test/tttx-standalone-input.e2e.d.ts +1 -0
  145. package/dist/types/components/molecules/tttx-standalone-input/test/tttx-standalone-input.spec.d.ts +1 -0
  146. package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.d.ts +56 -53
  147. package/dist/types/components/molecules/tttx-standalone-input/tttx-standalone-input.stories.d.ts +122 -106
  148. package/dist/types/components/molecules/tttx-toolbar/test/tttx-toolbar.test.d.ts +0 -0
  149. package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.d.ts +4 -0
  150. package/dist/types/components/molecules/tttx-toolbar/tttx-toolbar.stories.d.ts +13 -0
  151. package/dist/types/components/palette.stories.d.ts +6 -6
  152. package/dist/types/components.d.ts +21 -0
  153. package/dist/types/docs/gettingstarted-developer.stories.d.ts +5 -5
  154. package/dist/types/icons.d.ts +2 -2
  155. package/dist/types/index.d.ts +1 -1
  156. package/dist/types/shared/domsanitiser.options.d.ts +10 -10
  157. package/dist/types/shared/test/domsanitiser.options.spec.d.ts +1 -0
  158. package/dist/types/stencil-public-runtime.d.ts +3 -59
  159. package/loader/index.d.ts +0 -9
  160. package/package.json +1 -1
  161. package/dist/collection/transform-tag-name.js +0 -5
  162. package/dist/tttx/p-083eeedc.entry.js +0 -1
  163. package/dist/tttx/p-5687f4ad.js +0 -2
  164. package/dist/tttx/p-5c9a1626.entry.js +0 -3
  165. package/dist/tttx/p-931e42c9.entry.js +0 -1
  166. package/dist/tttx/p-b5c1dd86.entry.js +0 -1
  167. package/dist/types/transform-tag-name.d.ts +0 -1
@@ -1,114 +1,114 @@
1
- import { EventEmitter } from '../../../stencil-public-runtime';
2
- import { ChangeEvent } from 'react';
3
- export declare class TttxForm {
4
- private fieldset;
5
- private template;
6
- private _formSchema;
7
- formschema: any;
8
- submitValue: any;
9
- dataSubmitted: EventEmitter<FormData>;
10
- dataChanged: EventEmitter<{
11
- name: string;
12
- value: any;
13
- }>;
14
- onFormSchemaChange(newValue: any): void;
15
- /**
16
- * Handles the focus event for a form field and emits a "dataChanged" event
17
- * to the parent component with the field name and its new value.
18
- *
19
- * @param {ChangeEvent} event - The focus event triggered by the field.
20
- * @return {void}
21
- */
22
- fieldChanged(event: ChangeEvent): void;
23
- /**
24
- * Submits the form data to the server.
25
- *
26
- * @param {SubmitEvent} event - The event object for the form submission.
27
- * @returns {void}
28
- *
29
- * @example
30
- * const form = document.getElementById('myForm');
31
- * form.addEventListener('submit', (event) => {
32
- * doSubmit(event);
33
- * });
34
- */
35
- doSubmit(event: SubmitEvent): void;
36
- componentWillLoad(): void;
37
- componentWillRender(): void;
38
- /**
39
- * Creates a new HTMLInputElement with the specified name, type, and placeholder (if any),
40
- * and sets its autocomplete and autocapitalization properties to off.
41
- *
42
- * @param {string} formKey - The name of the input field, as specified in the form schema.
43
- * @param {Object} formProperties - An object containing additional properties for the input field, such as its type and placeholder value.
44
- * @param {string} formProperties.type - The type of the input field (e.g., "text", "email", "number", etc.).
45
- * @param {string} [formProperties.placeholder] - An optional placeholder value to display in the input field.
46
- * @return {HTMLInputElement} - The new input element.
47
- */
48
- createInput(formKey: any, formProperties: any): HTMLInputElement;
49
- /**
50
- * Applies validation attributes to an input element based on the specified validation object.
51
- * If a certain property is present in the object, it will set the corresponding attribute on
52
- * the input element (e.g., "required" will set the "required" and "data-required" attributes,
53
- * "pattern" will set the "pattern" and "data-pattern" attributes, etc.).
54
- *
55
- * @param {HTMLInputElement} input - The input element to apply validation attributes to.
56
- * @param {Object} validation - An object containing the validation rules for the input field.
57
- * @param {Object} [validation.required] - An object containing a "message" property to display if the field is required.
58
- * @param {Object} [validation.pattern] - An object containing a "pattern" property to match against the field value, and a "message" property to display if the pattern doesn't match.
59
- * @param {Object} [validation.badInput] - An object containing a "message" property to display if the field value is invalid.
60
- * @param {Object} [validation.minmax] - An object containing "min" and "max" properties to validate the field value against, and a "message" property to display if the value is out of range.
61
- * @param {string} [validation.maxlength] - The maximum length of the input field.
62
- * @return {void}
63
- */
64
- applyValidation(input: any, validation: any): void;
65
- createErrorBubble(): HTMLDivElement;
66
- /**
67
- * Creates a new <label> element with the "inputBlock" class and the specified label text,
68
- * and appends the input element and error bubble element to it. If the form property has
69
- * no validation object, it adds an "optional" span element to the label.
70
- *
71
- * @param {Object} formProperties - An object containing properties for the form field, including its label text and validation rules.
72
- * @param {HTMLInputElement} input - The input element to associate with the label.
73
- * @param {HTMLDivElement} errorBubble - The error bubble element to display error messages in.
74
- * @return {HTMLLabelElement} - The new label element.
75
- */
76
- createLabel(formProperties: any, input: any, errorBubble: any): HTMLLabelElement;
77
- /**
78
- * Creates a new <input> element with the "submit" type, the "primary-blue" class, and the
79
- * specified label text (i.e., "Save" by default), and returns the new submit button element.
80
- *
81
- * @return {HTMLInputElement} - The new submit button element.
82
- */
83
- createSubmitButton(): HTMLInputElement;
84
- /**
85
- * Populates the form template with input fields and labels based on the properties of the
86
- * current form schema. For each property in the schema, it creates an input element, applies
87
- * any validation rules to it, creates an error bubble and label element, and appends them
88
- * to the form template. Finally, it creates and appends a submit button element to the form.
89
- *
90
- * @return {void}
91
- */
92
- populateFormFromSchema(): void;
93
- /**
94
- * Clones the form template and binds event listeners to its input elements. First, it checks if
95
- * there is a form schema present. If so, it clones the template's content, binds events to form
96
- * input elements, and appends the cloned form elements to the fieldset. The event listeners include
97
- * "oninvalid" (to check input validity on submit), "onblur" (to check input validity on blur),
98
- * "onkeyup" (to handle changes in input fields), and "onchange" (to handle changes in select fields).
99
- *
100
- * @return {void}
101
- */
102
- componentDidRender(): void;
103
- validityCheckWrapper(event: any): void;
104
- /**
105
- * Renders the component's template as a form element with a fieldset container. The form's
106
- * "onSubmit" event is bound to the "doSubmit" function, which handles the form submission
107
- * and emits a "dataSubmitted" event with the form data. The fieldset element is assigned
108
- * to the "fieldset" instance variable using a ref, so it can be populated with form elements
109
- * later on.
110
- *
111
- * @return {JSX.Element} - The rendered form template as a JSX element.
112
- */
113
- render(): any;
114
- }
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ import { ChangeEvent } from 'react';
3
+ export declare class TttxForm {
4
+ private fieldset;
5
+ private template;
6
+ private _formSchema;
7
+ formschema: any;
8
+ submitValue: any;
9
+ dataSubmitted: EventEmitter<FormData>;
10
+ dataChanged: EventEmitter<{
11
+ name: string;
12
+ value: any;
13
+ }>;
14
+ onFormSchemaChange(newValue: any): void;
15
+ /**
16
+ * Handles the focus event for a form field and emits a "dataChanged" event
17
+ * to the parent component with the field name and its new value.
18
+ *
19
+ * @param {ChangeEvent} event - The focus event triggered by the field.
20
+ * @return {void}
21
+ */
22
+ fieldChanged(event: ChangeEvent): void;
23
+ /**
24
+ * Submits the form data to the server.
25
+ *
26
+ * @param {SubmitEvent} event - The event object for the form submission.
27
+ * @returns {void}
28
+ *
29
+ * @example
30
+ * const form = document.getElementById('myForm');
31
+ * form.addEventListener('submit', (event) => {
32
+ * doSubmit(event);
33
+ * });
34
+ */
35
+ doSubmit(event: SubmitEvent): void;
36
+ componentWillLoad(): void;
37
+ componentWillRender(): void;
38
+ /**
39
+ * Creates a new HTMLInputElement with the specified name, type, and placeholder (if any),
40
+ * and sets its autocomplete and autocapitalization properties to off.
41
+ *
42
+ * @param {string} formKey - The name of the input field, as specified in the form schema.
43
+ * @param {Object} formProperties - An object containing additional properties for the input field, such as its type and placeholder value.
44
+ * @param {string} formProperties.type - The type of the input field (e.g., "text", "email", "number", etc.).
45
+ * @param {string} [formProperties.placeholder] - An optional placeholder value to display in the input field.
46
+ * @return {HTMLInputElement} - The new input element.
47
+ */
48
+ createInput(formKey: any, formProperties: any): HTMLInputElement;
49
+ /**
50
+ * Applies validation attributes to an input element based on the specified validation object.
51
+ * If a certain property is present in the object, it will set the corresponding attribute on
52
+ * the input element (e.g., "required" will set the "required" and "data-required" attributes,
53
+ * "pattern" will set the "pattern" and "data-pattern" attributes, etc.).
54
+ *
55
+ * @param {HTMLInputElement} input - The input element to apply validation attributes to.
56
+ * @param {Object} validation - An object containing the validation rules for the input field.
57
+ * @param {Object} [validation.required] - An object containing a "message" property to display if the field is required.
58
+ * @param {Object} [validation.pattern] - An object containing a "pattern" property to match against the field value, and a "message" property to display if the pattern doesn't match.
59
+ * @param {Object} [validation.badInput] - An object containing a "message" property to display if the field value is invalid.
60
+ * @param {Object} [validation.minmax] - An object containing "min" and "max" properties to validate the field value against, and a "message" property to display if the value is out of range.
61
+ * @param {string} [validation.maxlength] - The maximum length of the input field.
62
+ * @return {void}
63
+ */
64
+ applyValidation(input: any, validation: any): void;
65
+ createErrorBubble(): HTMLDivElement;
66
+ /**
67
+ * Creates a new <label> element with the "inputBlock" class and the specified label text,
68
+ * and appends the input element and error bubble element to it. If the form property has
69
+ * no validation object, it adds an "optional" span element to the label.
70
+ *
71
+ * @param {Object} formProperties - An object containing properties for the form field, including its label text and validation rules.
72
+ * @param {HTMLInputElement} input - The input element to associate with the label.
73
+ * @param {HTMLDivElement} errorBubble - The error bubble element to display error messages in.
74
+ * @return {HTMLLabelElement} - The new label element.
75
+ */
76
+ createLabel(formProperties: any, input: any, errorBubble: any): HTMLLabelElement;
77
+ /**
78
+ * Creates a new <input> element with the "submit" type, the "primary-blue" class, and the
79
+ * specified label text (i.e., "Save" by default), and returns the new submit button element.
80
+ *
81
+ * @return {HTMLInputElement} - The new submit button element.
82
+ */
83
+ createSubmitButton(): HTMLInputElement;
84
+ /**
85
+ * Populates the form template with input fields and labels based on the properties of the
86
+ * current form schema. For each property in the schema, it creates an input element, applies
87
+ * any validation rules to it, creates an error bubble and label element, and appends them
88
+ * to the form template. Finally, it creates and appends a submit button element to the form.
89
+ *
90
+ * @return {void}
91
+ */
92
+ populateFormFromSchema(): void;
93
+ /**
94
+ * Clones the form template and binds event listeners to its input elements. First, it checks if
95
+ * there is a form schema present. If so, it clones the template's content, binds events to form
96
+ * input elements, and appends the cloned form elements to the fieldset. The event listeners include
97
+ * "oninvalid" (to check input validity on submit), "onblur" (to check input validity on blur),
98
+ * "onkeyup" (to handle changes in input fields), and "onchange" (to handle changes in select fields).
99
+ *
100
+ * @return {void}
101
+ */
102
+ componentDidRender(): void;
103
+ validityCheckWrapper(event: any): void;
104
+ /**
105
+ * Renders the component's template as a form element with a fieldset container. The form's
106
+ * "onSubmit" event is bound to the "doSubmit" function, which handles the form submission
107
+ * and emits a "dataSubmitted" event with the form data. The fieldset element is assigned
108
+ * to the "fieldset" instance variable using a ref, so it can be populated with form elements
109
+ * later on.
110
+ *
111
+ * @return {JSX.Element} - The rendered form template as a JSX element.
112
+ */
113
+ render(): any;
114
+ }
@@ -1,13 +1,13 @@
1
- declare const _default: {
2
- title: string;
3
- component: string;
4
- parameters: {
5
- actions: {
6
- handles: string[];
7
- };
8
- };
9
- decorators: import("@storybook/types").Addon_DecoratorFunction<unknown>[];
10
- };
11
- export default _default;
12
- export declare const ExampleFormFromJSON: () => string;
13
- export declare const SingleFormItem: () => string;
1
+ declare const _default: {
2
+ title: string;
3
+ component: string;
4
+ parameters: {
5
+ actions: {
6
+ handles: string[];
7
+ };
8
+ };
9
+ decorators: import("@storybook/types").Addon_DecoratorFunction<unknown>[];
10
+ };
11
+ export default _default;
12
+ export declare const ExampleFormFromJSON: () => string;
13
+ export declare const SingleFormItem: () => string;
@@ -1,11 +1,11 @@
1
- import { EventEmitter } from '../../../stencil-public-runtime';
2
- import { ListItem } from './interfaces';
3
- export declare class TttxList {
4
- data: string | ListItem[];
5
- name: string;
6
- rowClick: EventEmitter;
7
- private _data;
8
- onRowClickHandler(item: ListItem): void;
9
- renderListItem(item: ListItem): any;
10
- render(): any;
11
- }
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ import { ListItem } from './interfaces';
3
+ export declare class TttxList {
4
+ data: string | ListItem[];
5
+ name: string;
6
+ rowClick: EventEmitter;
7
+ private _data;
8
+ onRowClickHandler(item: ListItem): void;
9
+ renderListItem(item: ListItem): any;
10
+ render(): any;
11
+ }
@@ -1,14 +1,14 @@
1
- declare const _default: {
2
- title: string;
3
- component: string;
4
- parameters: {
5
- actions: {
6
- handles: string[];
7
- };
8
- };
9
- decorators: import("@storybook/types").Addon_DecoratorFunction<unknown>[];
10
- };
11
- export default _default;
12
- export declare const BasicStringList: any;
13
- export declare const BasicObjectList: any;
14
- export declare const BasicClickableList: any;
1
+ declare const _default: {
2
+ title: string;
3
+ component: string;
4
+ parameters: {
5
+ actions: {
6
+ handles: string[];
7
+ };
8
+ };
9
+ decorators: import("@storybook/types").Addon_DecoratorFunction<unknown>[];
10
+ };
11
+ export default _default;
12
+ export declare const BasicStringList: any;
13
+ export declare const BasicObjectList: any;
14
+ export declare const BasicClickableList: any;
@@ -1,53 +1,56 @@
1
- import { EventEmitter } from '../../../stencil-public-runtime';
2
- export type DateSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}`;
3
- export type MonthSyntax = `${number}${number}${number}${number}-${number}${number}`;
4
- export type WeekSyntax = `${number}${number}${number}${number}-W${number}${number}`;
5
- export type TimeSyntax = `${number}${number}:${number}${number}`;
6
- export type DateTimeLocalSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}`;
7
- export type MinMaxDates = DateSyntax | MonthSyntax | WeekSyntax | TimeSyntax | DateTimeLocalSyntax;
8
- export declare class TttxInput {
9
- label: string;
10
- showerrormsg: boolean;
11
- errormsg: string;
12
- iconleft: string;
13
- iconright: string;
14
- inputAutocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
15
- inputAutofocus: boolean;
16
- /**
17
- * Defines what action to present for the enter key on virtual keyboards
18
- */
19
- inputKeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
20
- /**
21
- * tabindex - Allows the HTML elements to be focusable
22
- * @example <caption>In HTML (like `index.html`)</caption>
23
- * <tttx-standalone-input input-index="1" />
24
- * @example <caption>In TSX files</caption>
25
- * <tttx-standalone-input inputIndex={1} />
26
- */
27
- inputIndex: string | number;
28
- inputTitle: string;
29
- autocomplete: 'off' | 'on';
30
- checked: boolean;
31
- disabled: boolean;
32
- max: MinMaxDates | number;
33
- maxlength: string | number;
34
- min: MinMaxDates | number;
35
- minlength: string | number;
36
- name: string;
37
- pattern: string;
38
- placeholder: string;
39
- readonly: string | boolean;
40
- required: boolean;
41
- step: string | number;
42
- type: string;
43
- value: string | number;
44
- valueChanged: EventEmitter<string>;
45
- handleChange(event: Event | InputEvent): void;
46
- focusChanged: EventEmitter<string>;
47
- handleFocus(event: Event | InputEvent): void;
48
- blurChanged: EventEmitter<string>;
49
- handleBlur(event: Event | InputEvent): void;
50
- invalidChanged: EventEmitter<string>;
51
- handleInvalid(event: Event | InputEvent): void;
52
- render(): any;
53
- }
1
+ import { EventEmitter } from '../../../stencil-public-runtime';
2
+ export declare type DateSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}`;
3
+ export declare type MonthSyntax = `${number}${number}${number}${number}-${number}${number}`;
4
+ export declare type WeekSyntax = `${number}${number}${number}${number}-W${number}${number}`;
5
+ export declare type TimeSyntax = `${number}${number}:${number}${number}`;
6
+ export declare type DateTimeLocalSyntax = `${number}${number}${number}${number}-${number}${number}-${number}${number}T${number}${number}:${number}${number}`;
7
+ export declare type MinMaxDates = DateSyntax | MonthSyntax | WeekSyntax | TimeSyntax | DateTimeLocalSyntax;
8
+ export declare class TttxInput {
9
+ label: string;
10
+ showerrormsg: boolean;
11
+ showerrorbubble: boolean;
12
+ errormsg: string;
13
+ iconleft: string;
14
+ iconright: string;
15
+ inputicon: string;
16
+ inline: boolean;
17
+ inputAutocapitalize: 'off' | 'none' | 'on' | 'sentences' | 'words' | 'characters';
18
+ inputAutofocus: boolean;
19
+ /**
20
+ * Defines what action to present for the enter key on virtual keyboards
21
+ */
22
+ inputKeyhint: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
23
+ /**
24
+ * tabindex - Allows the HTML elements to be focusable
25
+ * @example <caption>In HTML (like `index.html`)</caption>
26
+ * <tttx-standalone-input input-index="1" />
27
+ * @example <caption>In TSX files</caption>
28
+ * <tttx-standalone-input inputIndex={1} />
29
+ */
30
+ inputIndex: string | number;
31
+ inputTitle: string;
32
+ autocomplete: 'off' | 'on';
33
+ checked: boolean;
34
+ disabled: boolean;
35
+ max: MinMaxDates | number;
36
+ maxlength: string | number;
37
+ min: MinMaxDates | number;
38
+ minlength: string | number;
39
+ name: string;
40
+ pattern: string;
41
+ placeholder: string;
42
+ readonly: string | boolean;
43
+ required: boolean;
44
+ step: string | number;
45
+ type: string;
46
+ value: string | number;
47
+ valueChanged: EventEmitter<string>;
48
+ handleChange(event: Event | InputEvent): void;
49
+ focusChanged: EventEmitter<string>;
50
+ handleFocus(event: Event | InputEvent): void;
51
+ blurChanged: EventEmitter<string>;
52
+ handleBlur(event: Event | InputEvent): void;
53
+ invalidChanged: EventEmitter<string>;
54
+ handleInvalid(event: Event | InputEvent): void;
55
+ render(): any;
56
+ }