tyrell-react 1.0.0-RC6

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 (144) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +410 -0
  3. package/dist/components/TyButton.d.ts +50 -0
  4. package/dist/components/TyButton.d.ts.map +1 -0
  5. package/dist/components/TyButton.js +68 -0
  6. package/dist/components/TyButton.js.map +1 -0
  7. package/dist/components/TyCalendar.d.ts +63 -0
  8. package/dist/components/TyCalendar.d.ts.map +1 -0
  9. package/dist/components/TyCalendar.js +127 -0
  10. package/dist/components/TyCalendar.js.map +1 -0
  11. package/dist/components/TyCalendarMonth.d.ts +32 -0
  12. package/dist/components/TyCalendarMonth.d.ts.map +1 -0
  13. package/dist/components/TyCalendarMonth.js +54 -0
  14. package/dist/components/TyCalendarMonth.js.map +1 -0
  15. package/dist/components/TyCalendarNavigation.d.ts +21 -0
  16. package/dist/components/TyCalendarNavigation.d.ts.map +1 -0
  17. package/dist/components/TyCalendarNavigation.js +50 -0
  18. package/dist/components/TyCalendarNavigation.js.map +1 -0
  19. package/dist/components/TyCheckbox.d.ts +39 -0
  20. package/dist/components/TyCheckbox.d.ts.map +1 -0
  21. package/dist/components/TyCheckbox.js +83 -0
  22. package/dist/components/TyCheckbox.js.map +1 -0
  23. package/dist/components/TyCopy.d.ts +21 -0
  24. package/dist/components/TyCopy.d.ts.map +1 -0
  25. package/dist/components/TyCopy.js +42 -0
  26. package/dist/components/TyCopy.js.map +1 -0
  27. package/dist/components/TyDatePicker.d.ts +45 -0
  28. package/dist/components/TyDatePicker.d.ts.map +1 -0
  29. package/dist/components/TyDatePicker.js +119 -0
  30. package/dist/components/TyDatePicker.js.map +1 -0
  31. package/dist/components/TyDropdown.d.ts +56 -0
  32. package/dist/components/TyDropdown.d.ts.map +1 -0
  33. package/dist/components/TyDropdown.js +110 -0
  34. package/dist/components/TyDropdown.js.map +1 -0
  35. package/dist/components/TyIcon.d.ts +17 -0
  36. package/dist/components/TyIcon.d.ts.map +1 -0
  37. package/dist/components/TyIcon.js +41 -0
  38. package/dist/components/TyIcon.js.map +1 -0
  39. package/dist/components/TyInput.d.ts +65 -0
  40. package/dist/components/TyInput.d.ts.map +1 -0
  41. package/dist/components/TyInput.js +127 -0
  42. package/dist/components/TyInput.js.map +1 -0
  43. package/dist/components/TyModal.d.ts +29 -0
  44. package/dist/components/TyModal.d.ts.map +1 -0
  45. package/dist/components/TyModal.js +74 -0
  46. package/dist/components/TyModal.js.map +1 -0
  47. package/dist/components/TyMultiselect.d.ts +51 -0
  48. package/dist/components/TyMultiselect.d.ts.map +1 -0
  49. package/dist/components/TyMultiselect.js +107 -0
  50. package/dist/components/TyMultiselect.js.map +1 -0
  51. package/dist/components/TyOption.d.ts +10 -0
  52. package/dist/components/TyOption.d.ts.map +1 -0
  53. package/dist/components/TyOption.js +25 -0
  54. package/dist/components/TyOption.js.map +1 -0
  55. package/dist/components/TyPopup.d.ts +24 -0
  56. package/dist/components/TyPopup.d.ts.map +1 -0
  57. package/dist/components/TyPopup.js +61 -0
  58. package/dist/components/TyPopup.js.map +1 -0
  59. package/dist/components/TyRadio.d.ts +20 -0
  60. package/dist/components/TyRadio.d.ts.map +1 -0
  61. package/dist/components/TyRadio.js +46 -0
  62. package/dist/components/TyRadio.js.map +1 -0
  63. package/dist/components/TyRadioGroup.d.ts +40 -0
  64. package/dist/components/TyRadioGroup.d.ts.map +1 -0
  65. package/dist/components/TyRadioGroup.js +58 -0
  66. package/dist/components/TyRadioGroup.js.map +1 -0
  67. package/dist/components/TyResizeObserver.d.ts +11 -0
  68. package/dist/components/TyResizeObserver.d.ts.map +1 -0
  69. package/dist/components/TyResizeObserver.js +28 -0
  70. package/dist/components/TyResizeObserver.js.map +1 -0
  71. package/dist/components/TyScrollContainer.d.ts +25 -0
  72. package/dist/components/TyScrollContainer.d.ts.map +1 -0
  73. package/dist/components/TyScrollContainer.js +43 -0
  74. package/dist/components/TyScrollContainer.js.map +1 -0
  75. package/dist/components/TyStep.d.ts +17 -0
  76. package/dist/components/TyStep.d.ts.map +1 -0
  77. package/dist/components/TyStep.js +35 -0
  78. package/dist/components/TyStep.js.map +1 -0
  79. package/dist/components/TySwitch.d.ts +35 -0
  80. package/dist/components/TySwitch.d.ts.map +1 -0
  81. package/dist/components/TySwitch.js +69 -0
  82. package/dist/components/TySwitch.js.map +1 -0
  83. package/dist/components/TyTab.d.ts +13 -0
  84. package/dist/components/TyTab.d.ts.map +1 -0
  85. package/dist/components/TyTab.js +32 -0
  86. package/dist/components/TyTab.js.map +1 -0
  87. package/dist/components/TyTabs.d.ts +23 -0
  88. package/dist/components/TyTabs.d.ts.map +1 -0
  89. package/dist/components/TyTabs.js +48 -0
  90. package/dist/components/TyTabs.js.map +1 -0
  91. package/dist/components/TyTag.d.ts +22 -0
  92. package/dist/components/TyTag.d.ts.map +1 -0
  93. package/dist/components/TyTag.js +45 -0
  94. package/dist/components/TyTag.js.map +1 -0
  95. package/dist/components/TyTextarea.d.ts +37 -0
  96. package/dist/components/TyTextarea.d.ts.map +1 -0
  97. package/dist/components/TyTextarea.js +113 -0
  98. package/dist/components/TyTextarea.js.map +1 -0
  99. package/dist/components/TyTooltip.d.ts +17 -0
  100. package/dist/components/TyTooltip.d.ts.map +1 -0
  101. package/dist/components/TyTooltip.js +40 -0
  102. package/dist/components/TyTooltip.js.map +1 -0
  103. package/dist/components/TyWizard.d.ts +26 -0
  104. package/dist/components/TyWizard.d.ts.map +1 -0
  105. package/dist/components/TyWizard.js +50 -0
  106. package/dist/components/TyWizard.js.map +1 -0
  107. package/dist/components/index.d.ts +105 -0
  108. package/dist/components/index.d.ts.map +1 -0
  109. package/dist/components/index.js +112 -0
  110. package/dist/components/index.js.map +1 -0
  111. package/dist/utils/react-version.d.ts +2 -0
  112. package/dist/utils/react-version.d.ts.map +1 -0
  113. package/dist/utils/react-version.js +8 -0
  114. package/dist/utils/react-version.js.map +1 -0
  115. package/package.json +46 -0
  116. package/src/components/EventConventionTest.tsx +155 -0
  117. package/src/components/TyButton.tsx +145 -0
  118. package/src/components/TyCalendar.tsx +248 -0
  119. package/src/components/TyCalendarMonth.tsx +108 -0
  120. package/src/components/TyCalendarNavigation.tsx +91 -0
  121. package/src/components/TyCheckbox.tsx +152 -0
  122. package/src/components/TyCopy.tsx +78 -0
  123. package/src/components/TyDatePicker.tsx +220 -0
  124. package/src/components/TyDropdown.tsx +225 -0
  125. package/src/components/TyIcon.tsx +72 -0
  126. package/src/components/TyInput.tsx +232 -0
  127. package/src/components/TyModal.tsx +142 -0
  128. package/src/components/TyMultiselect.tsx +203 -0
  129. package/src/components/TyOption.tsx +42 -0
  130. package/src/components/TyPopup.tsx +111 -0
  131. package/src/components/TyRadio.tsx +70 -0
  132. package/src/components/TyRadioGroup.tsx +121 -0
  133. package/src/components/TyResizeObserver.tsx +54 -0
  134. package/src/components/TyScrollContainer.tsx +87 -0
  135. package/src/components/TyStep.tsx +71 -0
  136. package/src/components/TySwitch.tsx +122 -0
  137. package/src/components/TyTab.tsx +63 -0
  138. package/src/components/TyTabs.tsx +93 -0
  139. package/src/components/TyTag.tsx +79 -0
  140. package/src/components/TyTextarea.tsx +177 -0
  141. package/src/components/TyTooltip.tsx +83 -0
  142. package/src/components/TyWizard.tsx +99 -0
  143. package/src/components/index.ts +251 -0
  144. package/src/utils/react-version.ts +8 -0
@@ -0,0 +1,74 @@
1
+ import React, { useEffect, useRef, useImperativeHandle } from 'react';
2
+ // React wrapper for ty-modal web component
3
+ export const TyModal = React.forwardRef(({ open, backdrop, closeOnOutsideClick, closeOnEscape, protected: isProtected, onOpen, onClose, children, ...props }, ref) => {
4
+ const elementRef = useRef(null);
5
+ // Expose imperative methods through ref
6
+ useImperativeHandle(ref, () => ({
7
+ show: () => {
8
+ if (elementRef.current && typeof elementRef.current.show === 'function') {
9
+ elementRef.current.show();
10
+ }
11
+ },
12
+ hide: () => {
13
+ if (elementRef.current && typeof elementRef.current.hide === 'function') {
14
+ elementRef.current.hide();
15
+ }
16
+ },
17
+ element: elementRef.current,
18
+ }), []);
19
+ // Handle modal events
20
+ useEffect(() => {
21
+ const element = elementRef.current;
22
+ if (!element)
23
+ return;
24
+ const handleOpen = (event) => {
25
+ if (onOpen) {
26
+ onOpen(event);
27
+ }
28
+ };
29
+ const handleClose = (event) => {
30
+ if (onClose) {
31
+ onClose(event);
32
+ }
33
+ };
34
+ // Listen for custom modal events
35
+ if (onOpen) {
36
+ element.addEventListener('open', handleOpen);
37
+ }
38
+ if (onClose) {
39
+ element.addEventListener('close', handleClose);
40
+ }
41
+ return () => {
42
+ if (onOpen) {
43
+ element.removeEventListener('open', handleOpen);
44
+ }
45
+ if (onClose) {
46
+ element.removeEventListener('close', handleClose);
47
+ }
48
+ };
49
+ }, [onOpen, onClose]);
50
+ // Convert React props to web component attributes
51
+ const webComponentProps = {
52
+ ...props,
53
+ ref: elementRef,
54
+ };
55
+ // Add boolean attributes using correct HTML attribute names
56
+ if (open) {
57
+ webComponentProps.open = ''; // Boolean attributes as empty string
58
+ }
59
+ if (backdrop === false) { // Only set if explicitly false (default is true)
60
+ webComponentProps.backdrop = 'false';
61
+ }
62
+ if (closeOnOutsideClick === false) { // Only set if explicitly false (default is true)
63
+ webComponentProps['close-on-outside-click'] = 'false';
64
+ }
65
+ if (closeOnEscape === false) { // Only set if explicitly false (default is true)
66
+ webComponentProps['close-on-escape'] = 'false';
67
+ }
68
+ if (isProtected) {
69
+ webComponentProps.protected = ''; // Boolean attributes as empty string
70
+ }
71
+ return React.createElement('ty-modal', webComponentProps, children);
72
+ });
73
+ TyModal.displayName = 'TyModal';
74
+ //# sourceMappingURL=TyModal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyModal.js","sourceRoot":"","sources":["../../src/components/TyModal.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,51 @@
1
+ import React from 'react';
2
+ export interface TyMultiselectEventDetail {
3
+ /** Array of currently selected values */
4
+ values: string[];
5
+ /** Action that triggered the change: "add" | "remove" */
6
+ action: 'add' | 'remove';
7
+ /** The specific item that was added or removed */
8
+ item: string;
9
+ }
10
+ export interface TyMultiselectProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange' | 'style'> {
11
+ style?: import('./TyInput').TyInputCSSProperties;
12
+ /** Current selected values as comma-separated string or array */
13
+ value?: string | string[];
14
+ /** Placeholder text when no items are selected */
15
+ placeholder?: string;
16
+ /** Disable the multiselect component */
17
+ disabled?: boolean;
18
+ /** Make the multiselect read-only */
19
+ readonly?: boolean;
20
+ /** Semantic styling variant */
21
+ flavor?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'neutral';
22
+ /** Label text for the multiselect */
23
+ label?: string;
24
+ /** Mark the field as required */
25
+ required?: boolean;
26
+ /**
27
+ * Switch to external (remote) search mode. Default is `false` — the
28
+ * multiselect filters its own children client-side. Set to `true` when you
29
+ * want to handle filtering yourself (e.g. server-side): the component will
30
+ * dispatch `search` events on each keystroke, and you must update the children
31
+ * in response. The `onSearch` prop receives those events.
32
+ */
33
+ externalSearch?: boolean;
34
+ /** Debounce in milliseconds (0-5000) */
35
+ debounce?: number;
36
+ /** Mobile section label for selected items */
37
+ selectedLabel?: string;
38
+ /** Form field name for form submission */
39
+ name?: string;
40
+ /** Callback when selection changes */
41
+ onChange?: (event: CustomEvent<TyMultiselectEventDetail>) => void;
42
+ /** Callback fired on each search input change (debounced by `debounce`). Use for external/server-side filtering. */
43
+ onSearch?: (event: CustomEvent<{
44
+ query: string;
45
+ element: HTMLElement;
46
+ }>) => void;
47
+ /** Children should be TyTag components, not TyOption */
48
+ children?: React.ReactNode;
49
+ }
50
+ export declare const TyMultiselect: React.ForwardRefExoticComponent<TyMultiselectProps & React.RefAttributes<HTMLElement>>;
51
+ //# sourceMappingURL=TyMultiselect.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyMultiselect.d.ts","sourceRoot":"","sources":["../../src/components/TyMultiselect.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAI9D,MAAM,WAAW,wBAAwB;IACvC,yCAAyC;IACzC,MAAM,EAAE,MAAM,EAAE,CAAC;IACjB,yDAAyD;IACzD,MAAM,EAAE,KAAK,GAAG,QAAQ,CAAC;IACzB,kDAAkD;IAClD,IAAI,EAAE,MAAM,CAAC;CACd;AAED,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,OAAO,CAAC;IACvG,KAAK,CAAC,EAAE,OAAO,WAAW,EAAE,oBAAoB,CAAC;IACjD,iEAAiE;IACjE,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAE1B,kDAAkD;IAClD,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,qCAAqC;IACrC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,+BAA+B;IAC/B,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;IAEhF,qCAAqC;IACrC,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,iCAAiC;IACjC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IAEzB,wCAAwC;IACxC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,8CAA8C;IAC9C,aAAa,CAAC,EAAE,MAAM,CAAC;IAEvB,0CAA0C;IAC1C,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,sCAAsC;IACtC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,wBAAwB,CAAC,KAAK,IAAI,CAAC;IAElE,oHAAoH;IACpH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,OAAO,EAAE,WAAW,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAEjF,wDAAwD;IACxD,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,eAAO,MAAM,aAAa,wFAuIzB,CAAC"}
@@ -0,0 +1,107 @@
1
+ import React, { useEffect, useRef, useCallback } from 'react';
2
+ import { needsPropertyBridge } from '../utils/react-version';
3
+ // React wrapper for ty-multiselect web component
4
+ export const TyMultiselect = React.forwardRef(({ value, placeholder, disabled, readonly, flavor, label, required, externalSearch, debounce, selectedLabel, name, onChange, onSearch, children, ...props }, ref) => {
5
+ const elementRef = useRef(null);
6
+ // Handle ref forwarding
7
+ useEffect(() => {
8
+ if (ref && elementRef.current) {
9
+ if (typeof ref === 'function') {
10
+ ref(elementRef.current);
11
+ }
12
+ else {
13
+ ref.current = elementRef.current;
14
+ }
15
+ }
16
+ }, [ref]);
17
+ // Imperatively sync `value` to the underlying property so resets
18
+ // (`value=""` or null) reliably clear the visible selection.
19
+ // React 18 workaround; React 19+ handles this natively.
20
+ useEffect(() => {
21
+ if (!needsPropertyBridge)
22
+ return;
23
+ const element = elementRef.current;
24
+ if (!element)
25
+ return;
26
+ const next = props.value ?? '';
27
+ if (element.value !== next) {
28
+ element.value = next;
29
+ }
30
+ }, [props.value]);
31
+ // Handle change events
32
+ const handleChange = useCallback((event) => {
33
+ const customEvent = event;
34
+ if (onChange) {
35
+ onChange(customEvent);
36
+ }
37
+ }, [onChange]);
38
+ const handleSearch = useCallback((event) => {
39
+ const customEvent = event;
40
+ if (onSearch) {
41
+ onSearch(customEvent);
42
+ }
43
+ }, [onSearch]);
44
+ // Set up event listeners
45
+ useEffect(() => {
46
+ const element = elementRef.current;
47
+ if (!element)
48
+ return;
49
+ if (onChange)
50
+ element.addEventListener('change', handleChange);
51
+ if (onSearch)
52
+ element.addEventListener('search', handleSearch);
53
+ return () => {
54
+ if (onChange)
55
+ element.removeEventListener('change', handleChange);
56
+ if (onSearch)
57
+ element.removeEventListener('search', handleSearch);
58
+ };
59
+ }, [handleChange, handleSearch, onChange, onSearch]);
60
+ // Convert React props to web component attributes
61
+ const webComponentProps = {
62
+ ...props,
63
+ ref: elementRef,
64
+ };
65
+ // Handle value conversion (array to comma-separated string)
66
+ if (value !== undefined) {
67
+ const valueString = Array.isArray(value) ? value.join(',') : value;
68
+ webComponentProps.value = valueString;
69
+ }
70
+ // Add optional attributes only if they have values
71
+ if (placeholder) {
72
+ webComponentProps.placeholder = placeholder;
73
+ }
74
+ if (disabled) {
75
+ webComponentProps.disabled = ''; // Boolean attributes as empty string
76
+ }
77
+ if (readonly) {
78
+ webComponentProps.readonly = ''; // Boolean attributes as empty string
79
+ }
80
+ if (flavor) {
81
+ webComponentProps.flavor = flavor;
82
+ }
83
+ if (label) {
84
+ webComponentProps.label = label;
85
+ }
86
+ if (required) {
87
+ webComponentProps.required = ''; // Boolean attributes as empty string
88
+ }
89
+ if (name) {
90
+ webComponentProps.name = name;
91
+ }
92
+ // External (remote) search mode: parent owns filtering, multiselect dispatches search events
93
+ if (externalSearch) {
94
+ webComponentProps['external-search'] = '';
95
+ }
96
+ // Add debounce attribute
97
+ if (debounce !== undefined) {
98
+ webComponentProps.debounce = debounce;
99
+ }
100
+ // Add selectedLabel attribute
101
+ if (selectedLabel) {
102
+ webComponentProps['selected-label'] = selectedLabel;
103
+ }
104
+ return React.createElement('ty-multiselect', webComponentProps, children);
105
+ });
106
+ TyMultiselect.displayName = 'TyMultiselect';
107
+ //# sourceMappingURL=TyMultiselect.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyMultiselect.js","sourceRoot":"","sources":["../../src/components/TyMultiselect.tsx"],"names":[],"mappings":"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"}
@@ -0,0 +1,10 @@
1
+ import React from 'react';
2
+ export interface TyOptionProps extends React.HTMLAttributes<HTMLElement> {
3
+ value?: string;
4
+ disabled?: boolean;
5
+ selected?: boolean;
6
+ hidden?: boolean;
7
+ children?: React.ReactNode;
8
+ }
9
+ export declare const TyOption: React.ForwardRefExoticComponent<TyOptionProps & React.RefAttributes<HTMLElement>>;
10
+ //# sourceMappingURL=TyOption.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyOption.d.ts","sourceRoot":"","sources":["../../src/components/TyOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,aAAc,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,eAAO,MAAM,QAAQ,mFA2BpB,CAAC"}
@@ -0,0 +1,25 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ // React wrapper for ty-option web component
3
+ export const TyOption = React.forwardRef(({ children, disabled, selected, hidden, ...props }, ref) => {
4
+ const elementRef = useRef(null);
5
+ // Handle ref forwarding
6
+ useEffect(() => {
7
+ if (ref && elementRef.current) {
8
+ if (typeof ref === 'function') {
9
+ ref(elementRef.current);
10
+ }
11
+ else {
12
+ ref.current = elementRef.current;
13
+ }
14
+ }
15
+ }, [ref]);
16
+ return React.createElement('ty-option', {
17
+ ...props,
18
+ ...(disabled && { disabled: "" }),
19
+ ...(selected && { selected: "" }),
20
+ ...(hidden && { hidden: "" }),
21
+ ref: elementRef,
22
+ }, children);
23
+ });
24
+ TyOption.displayName = 'TyOption';
25
+ //# sourceMappingURL=TyOption.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyOption.js","sourceRoot":"","sources":["../../src/components/TyOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAWjD,4CAA4C;AAC5C,MAAM,CAAC,MAAM,QAAQ,GAAG,KAAK,CAAC,UAAU,CACtC,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IAC1D,MAAM,UAAU,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE7C,wBAAwB;IACxB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC9B,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;iBAAM,CAAC;gBACN,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,OAAO,KAAK,CAAC,aAAa,CACxB,WAAW,EACX;QACE,GAAG,KAAK;QACR,GAAG,CAAC,QAAQ,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QACjC,GAAG,CAAC,QAAQ,IAAI,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC;QACjC,GAAG,CAAC,MAAM,IAAI,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC;QAC7B,GAAG,EAAE,UAAU;KAChB,EACD,QAAQ,CACT,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,QAAQ,CAAC,WAAW,GAAG,UAAU,CAAC"}
@@ -0,0 +1,24 @@
1
+ import React from 'react';
2
+ export interface TyPopupProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onClose'> {
3
+ /** Preferred placement of the popup relative to anchor parent: "top" | "bottom" | "left" | "right" */
4
+ placement?: 'top' | 'bottom' | 'left' | 'right';
5
+ /** Distance offset from the anchor in pixels (default: 8) */
6
+ offset?: number;
7
+ /** Disable automatic click trigger - requires manual open/close via ref methods */
8
+ manual?: boolean;
9
+ /** Disable automatic close on outside click and ESC key */
10
+ disableClose?: boolean;
11
+ /** Fired when the popup opens (after the open animation starts) */
12
+ onOpen?: (event: CustomEvent) => void;
13
+ /** Fired when the popup closes */
14
+ onClose?: (event: CustomEvent) => void;
15
+ /** Popup content - popup should be a child of the anchor element */
16
+ children?: React.ReactNode;
17
+ }
18
+ export interface TyPopupElement extends HTMLElement {
19
+ openPopup(): void;
20
+ closePopup(): void;
21
+ togglePopup(): void;
22
+ }
23
+ export declare const TyPopup: React.ForwardRefExoticComponent<TyPopupProps & React.RefAttributes<TyPopupElement>>;
24
+ //# sourceMappingURL=TyPopup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyPopup.d.ts","sourceRoot":"","sources":["../../src/components/TyPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,SAAS,CAAC;IACtF,sGAAsG;IACtG,SAAS,CAAC,EAAE,KAAK,GAAG,QAAQ,GAAG,MAAM,GAAG,OAAO,CAAC;IAEhD,6DAA6D;IAC7D,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB,mFAAmF;IACnF,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,2DAA2D;IAC3D,YAAY,CAAC,EAAE,OAAO,CAAC;IAEvB,mEAAmE;IACnE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IAEtC,kCAAkC;IAClC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,KAAK,IAAI,CAAC;IAEvC,oEAAoE;IACpE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,MAAM,WAAW,cAAe,SAAQ,WAAW;IACjD,SAAS,IAAI,IAAI,CAAC;IAClB,UAAU,IAAI,IAAI,CAAC;IACnB,WAAW,IAAI,IAAI,CAAC;CACrB;AAGD,eAAO,MAAM,OAAO,qFA0EnB,CAAC"}
@@ -0,0 +1,61 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ // React wrapper for ty-popup web component
3
+ export const TyPopup = React.forwardRef(({ placement, offset, manual, disableClose, onOpen, onClose, children, ...props }, ref) => {
4
+ const elementRef = useRef(null);
5
+ // Handle ref forwarding
6
+ useEffect(() => {
7
+ if (ref && elementRef.current) {
8
+ if (typeof ref === 'function') {
9
+ ref(elementRef.current);
10
+ }
11
+ else {
12
+ ref.current = elementRef.current;
13
+ }
14
+ }
15
+ }, [ref]);
16
+ // Listen for popup open/close events
17
+ useEffect(() => {
18
+ const element = elementRef.current;
19
+ if (!element)
20
+ return;
21
+ const handleOpen = (event) => {
22
+ if (onOpen)
23
+ onOpen(event);
24
+ };
25
+ const handleClose = (event) => {
26
+ if (onClose)
27
+ onClose(event);
28
+ };
29
+ if (onOpen)
30
+ element.addEventListener('open', handleOpen);
31
+ if (onClose)
32
+ element.addEventListener('close', handleClose);
33
+ return () => {
34
+ if (onOpen)
35
+ element.removeEventListener('open', handleOpen);
36
+ if (onClose)
37
+ element.removeEventListener('close', handleClose);
38
+ };
39
+ }, [onOpen, onClose]);
40
+ // Convert React props to web component attributes
41
+ const webComponentProps = {
42
+ ...props,
43
+ ref: elementRef,
44
+ };
45
+ // Add optional attributes only if they have values
46
+ if (placement) {
47
+ webComponentProps.placement = placement;
48
+ }
49
+ if (offset !== undefined) {
50
+ webComponentProps.offset = offset.toString();
51
+ }
52
+ if (manual) {
53
+ webComponentProps.manual = ''; // Boolean attributes as empty string
54
+ }
55
+ if (disableClose) {
56
+ webComponentProps['disable-close'] = ''; // Boolean attributes as empty string
57
+ }
58
+ return React.createElement('ty-popup', webComponentProps, children);
59
+ });
60
+ TyPopup.displayName = 'TyPopup';
61
+ //# sourceMappingURL=TyPopup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyPopup.js","sourceRoot":"","sources":["../../src/components/TyPopup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAiCjD,2CAA2C;AAC3C,MAAM,CAAC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CACrC,CAAC,EACC,SAAS,EACT,MAAM,EACN,MAAM,EACN,YAAY,EACZ,MAAM,EACN,OAAO,EACP,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,EAAE,EAAE;IACR,MAAM,UAAU,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAEhD,wBAAwB;IACxB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC9B,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;iBAAM,CAAC;gBACN,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,qCAAqC;IACrC,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,UAAU,GAAG,CAAC,KAAY,EAAE,EAAE;YAClC,IAAI,MAAM;gBAAE,MAAM,CAAC,KAAoB,CAAC,CAAC;QAC3C,CAAC,CAAC;QACF,MAAM,WAAW,GAAG,CAAC,KAAY,EAAE,EAAE;YACnC,IAAI,OAAO;gBAAE,OAAO,CAAC,KAAoB,CAAC,CAAC;QAC7C,CAAC,CAAC;QAEF,IAAI,MAAM;YAAE,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;QACzD,IAAI,OAAO;YAAE,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAE5D,OAAO,GAAG,EAAE;YACV,IAAI,MAAM;gBAAE,OAAO,CAAC,mBAAmB,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;YAC5D,IAAI,OAAO;gBAAE,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QACjE,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAEtB,kDAAkD;IAClD,MAAM,iBAAiB,GAAwB;QAC7C,GAAG,KAAK;QACR,GAAG,EAAE,UAAU;KAChB,CAAC;IAEF,mDAAmD;IACnD,IAAI,SAAS,EAAE,CAAC;QACd,iBAAiB,CAAC,SAAS,GAAG,SAAS,CAAC;IAC1C,CAAC;IAED,IAAI,MAAM,KAAK,SAAS,EAAE,CAAC;QACzB,iBAAiB,CAAC,MAAM,GAAG,MAAM,CAAC,QAAQ,EAAE,CAAC;IAC/C,CAAC;IAED,IAAI,MAAM,EAAE,CAAC;QACX,iBAAiB,CAAC,MAAM,GAAG,EAAE,CAAC,CAAE,qCAAqC;IACvE,CAAC;IAED,IAAI,YAAY,EAAE,CAAC;QACjB,iBAAiB,CAAC,eAAe,CAAC,GAAG,EAAE,CAAC,CAAE,qCAAqC;IACjF,CAAC;IAED,OAAO,KAAK,CAAC,aAAa,CACxB,UAAU,EACV,iBAAiB,EACjB,QAAQ,CACT,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}
@@ -0,0 +1,20 @@
1
+ import React from 'react';
2
+ export interface TyRadioProps extends React.HTMLAttributes<HTMLElement> {
3
+ /** Form field value (selected by parent ty-radio-group when matches its `value`) */
4
+ value?: string;
5
+ /**
6
+ * Selected state. Usually managed by the parent `<TyRadioGroup>` based on its
7
+ * own `value`; set explicitly only when using `ty-radio` outside a group.
8
+ */
9
+ checked?: boolean;
10
+ /** Disable this individual radio */
11
+ disabled?: boolean;
12
+ /** Radio size — typically inherited from the parent group */
13
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
14
+ /** Semantic styling variant — typically inherited from the parent group */
15
+ flavor?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'neutral';
16
+ /** Label content (wrap in a `<label>` for click delegation, see ty-radio docs) */
17
+ children?: React.ReactNode;
18
+ }
19
+ export declare const TyRadio: React.ForwardRefExoticComponent<TyRadioProps & React.RefAttributes<HTMLElement>>;
20
+ //# sourceMappingURL=TyRadio.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyRadio.d.ts","sourceRoot":"","sources":["../../src/components/TyRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IACrE,oFAAoF;IACpF,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAElB,oCAAoC;IACpC,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,6DAA6D;IAC7D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAExC,2EAA2E;IAC3E,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;IAEhF,kFAAkF;IAClF,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,OAAO,kFAyCnB,CAAC"}
@@ -0,0 +1,46 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ import { needsPropertyBridge } from '../utils/react-version';
3
+ export const TyRadio = React.forwardRef(({ children, value, checked, disabled, size, flavor, ...props }, ref) => {
4
+ const elementRef = useRef(null);
5
+ useEffect(() => {
6
+ if (ref && elementRef.current) {
7
+ if (typeof ref === 'function') {
8
+ ref(elementRef.current);
9
+ }
10
+ else {
11
+ ref.current = elementRef.current;
12
+ }
13
+ }
14
+ }, [ref]);
15
+ // Imperatively sync `checked` to the underlying property. React 18 sets
16
+ // boolean attributes as empty strings on first render but doesn't reliably
17
+ // remove them when the prop flips back to false on a custom element.
18
+ // React 19+ handles boolean prop-to-property bridging natively.
19
+ useEffect(() => {
20
+ if (!needsPropertyBridge)
21
+ return;
22
+ const element = elementRef.current;
23
+ if (!element)
24
+ return;
25
+ if (Boolean(element.checked) !== Boolean(checked)) {
26
+ element.checked = Boolean(checked);
27
+ }
28
+ }, [checked]);
29
+ const webComponentProps = {
30
+ ...props,
31
+ ref: elementRef,
32
+ };
33
+ if (checked)
34
+ webComponentProps.checked = '';
35
+ if (disabled)
36
+ webComponentProps.disabled = '';
37
+ if (value !== undefined)
38
+ webComponentProps.value = value;
39
+ if (size)
40
+ webComponentProps.size = size;
41
+ if (flavor)
42
+ webComponentProps.flavor = flavor;
43
+ return React.createElement('ty-radio', webComponentProps, children);
44
+ });
45
+ TyRadio.displayName = 'TyRadio';
46
+ //# sourceMappingURL=TyRadio.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyRadio.js","sourceRoot":"","sources":["../../src/components/TyRadio.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAyB7D,MAAM,CAAC,MAAM,OAAO,GAAG,KAAK,CAAC,UAAU,CACrC,CAAC,EAAE,QAAQ,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,EAAE,EAAE;IACtE,MAAM,UAAU,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC9B,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;iBAAM,CAAC;gBACN,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,wEAAwE;IACxE,2EAA2E;IAC3E,qEAAqE;IACrE,gEAAgE;IAChE,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,mBAAmB;YAAE,OAAO;QACjC,MAAM,OAAO,GAAG,UAAU,CAAC,OAAc,CAAC;QAC1C,IAAI,CAAC,OAAO;YAAE,OAAO;QACrB,IAAI,OAAO,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,OAAO,CAAC,OAAO,CAAC,EAAE,CAAC;YAClD,OAAO,CAAC,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;QACrC,CAAC;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,MAAM,iBAAiB,GAAwB;QAC7C,GAAG,KAAK;QACR,GAAG,EAAE,UAAU;KAChB,CAAC;IAEF,IAAI,OAAO;QAAE,iBAAiB,CAAC,OAAO,GAAG,EAAE,CAAC;IAC5C,IAAI,QAAQ;QAAE,iBAAiB,CAAC,QAAQ,GAAG,EAAE,CAAC;IAE9C,IAAI,KAAK,KAAK,SAAS;QAAE,iBAAiB,CAAC,KAAK,GAAG,KAAK,CAAC;IACzD,IAAI,IAAI;QAAE,iBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;IACxC,IAAI,MAAM;QAAE,iBAAiB,CAAC,MAAM,GAAG,MAAM,CAAC;IAE9C,OAAO,KAAK,CAAC,aAAa,CAAC,UAAU,EAAE,iBAAiB,EAAE,QAAQ,CAAC,CAAC;AACtE,CAAC,CACF,CAAC;AAEF,OAAO,CAAC,WAAW,GAAG,SAAS,CAAC"}
@@ -0,0 +1,40 @@
1
+ import React from 'react';
2
+ export interface TyRadioGroupProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange' | 'onInput'> {
3
+ /** Currently selected value (matches one child `<TyRadio value="...">`) */
4
+ value?: string;
5
+ /** Form field name */
6
+ name?: string;
7
+ /** Group label rendered above the radios */
8
+ label?: string;
9
+ /** Disable the entire group */
10
+ disabled?: boolean;
11
+ /** Required field — renders required-icon next to the label */
12
+ required?: boolean;
13
+ /** Error message rendered below the group */
14
+ error?: string;
15
+ /** Layout direction for radio children */
16
+ orientation?: 'vertical' | 'horizontal';
17
+ /** Group size — propagates to all `<TyRadio>` children */
18
+ size?: 'xs' | 'sm' | 'md' | 'lg' | 'xl';
19
+ /** Group flavor — propagates to all `<TyRadio>` children */
20
+ flavor?: 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'neutral';
21
+ /**
22
+ * Fires when selection changes (React convention)
23
+ * Maps to native 'input' event from ty-radio-group
24
+ */
25
+ onChange?: (event: CustomEvent<TyRadioGroupEventDetail>) => void;
26
+ /**
27
+ * Fires on blur if value changed (native DOM behavior)
28
+ * Maps to native 'change' event from ty-radio-group
29
+ */
30
+ onChangeCommit?: (event: CustomEvent<TyRadioGroupEventDetail>) => void;
31
+ /** `<TyRadio>` children */
32
+ children?: React.ReactNode;
33
+ }
34
+ export interface TyRadioGroupEventDetail {
35
+ value: string;
36
+ formValue: string;
37
+ originalEvent: Event;
38
+ }
39
+ export declare const TyRadioGroup: React.ForwardRefExoticComponent<TyRadioGroupProps & React.RefAttributes<HTMLElement>>;
40
+ //# sourceMappingURL=TyRadioGroup.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyRadioGroup.d.ts","sourceRoot":"","sources":["../../src/components/TyRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAEjD,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC,EAAE,UAAU,GAAG,SAAS,CAAC;IACxG,2EAA2E;IAC3E,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,sBAAsB;IACtB,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd,4CAA4C;IAC5C,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,+DAA+D;IAC/D,QAAQ,CAAC,EAAE,OAAO,CAAC;IAEnB,6CAA6C;IAC7C,KAAK,CAAC,EAAE,MAAM,CAAC;IAEf,0CAA0C;IAC1C,WAAW,CAAC,EAAE,UAAU,GAAG,YAAY,CAAC;IAExC,0DAA0D;IAC1D,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAExC,4DAA4D;IAC5D,MAAM,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,SAAS,CAAC;IAEhF;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,uBAAuB,CAAC,KAAK,IAAI,CAAC;IAEjE;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,WAAW,CAAC,uBAAuB,CAAC,KAAK,IAAI,CAAC;IAEvE,2BAA2B;IAC3B,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,MAAM,WAAW,uBAAuB;IACtC,KAAK,EAAE,MAAM,CAAC;IACd,SAAS,EAAE,MAAM,CAAC;IAClB,aAAa,EAAE,KAAK,CAAC;CACtB;AAED,eAAO,MAAM,YAAY,uFAkExB,CAAC"}
@@ -0,0 +1,58 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ export const TyRadioGroup = React.forwardRef(({ children, value, name, label, disabled, required, error, orientation, size, flavor, onChange, onChangeCommit, ...props }, ref) => {
3
+ const elementRef = useRef(null);
4
+ useEffect(() => {
5
+ const element = elementRef.current;
6
+ if (!element)
7
+ return;
8
+ const handleInput = (event) => {
9
+ if (onChange)
10
+ onChange(event);
11
+ };
12
+ const handleChangeCommit = (event) => {
13
+ if (onChangeCommit)
14
+ onChangeCommit(event);
15
+ };
16
+ element.addEventListener('input', handleInput);
17
+ element.addEventListener('change', handleChangeCommit);
18
+ return () => {
19
+ element.removeEventListener('input', handleInput);
20
+ element.removeEventListener('change', handleChangeCommit);
21
+ };
22
+ }, [onChange, onChangeCommit]);
23
+ useEffect(() => {
24
+ if (ref && elementRef.current) {
25
+ if (typeof ref === 'function') {
26
+ ref(elementRef.current);
27
+ }
28
+ else {
29
+ ref.current = elementRef.current;
30
+ }
31
+ }
32
+ }, [ref]);
33
+ const webComponentProps = {
34
+ ...props,
35
+ ref: elementRef,
36
+ };
37
+ if (disabled)
38
+ webComponentProps.disabled = '';
39
+ if (required)
40
+ webComponentProps.required = '';
41
+ if (value !== undefined)
42
+ webComponentProps.value = value;
43
+ if (name)
44
+ webComponentProps.name = name;
45
+ if (label)
46
+ webComponentProps.label = label;
47
+ if (error)
48
+ webComponentProps.error = error;
49
+ if (orientation)
50
+ webComponentProps.orientation = orientation;
51
+ if (size)
52
+ webComponentProps.size = size;
53
+ if (flavor)
54
+ webComponentProps.flavor = flavor;
55
+ return React.createElement('ty-radio-group', webComponentProps, children);
56
+ });
57
+ TyRadioGroup.displayName = 'TyRadioGroup';
58
+ //# sourceMappingURL=TyRadioGroup.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyRadioGroup.js","sourceRoot":"","sources":["../../src/components/TyRadioGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAoDjD,MAAM,CAAC,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,CAC1C,CAAC,EACC,QAAQ,EACR,KAAK,EACL,IAAI,EACJ,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,cAAc,EACd,GAAG,KAAK,EACT,EAAE,GAAG,EAAE,EAAE;IACR,MAAM,UAAU,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE7C,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;QACnC,IAAI,CAAC,OAAO;YAAE,OAAO;QAErB,MAAM,WAAW,GAAG,CAAC,KAAY,EAAE,EAAE;YACnC,IAAI,QAAQ;gBAAE,QAAQ,CAAC,KAA6C,CAAC,CAAC;QACxE,CAAC,CAAC;QACF,MAAM,kBAAkB,GAAG,CAAC,KAAY,EAAE,EAAE;YAC1C,IAAI,cAAc;gBAAE,cAAc,CAAC,KAA6C,CAAC,CAAC;QACpF,CAAC,CAAC;QAEF,OAAO,CAAC,gBAAgB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;QAC/C,OAAO,CAAC,gBAAgB,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC;QAEvD,OAAO,GAAG,EAAE;YACV,OAAO,CAAC,mBAAmB,CAAC,OAAO,EAAE,WAAW,CAAC,CAAC;YAClD,OAAO,CAAC,mBAAmB,CAAC,QAAQ,EAAE,kBAAkB,CAAC,CAAC;QAC5D,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC,CAAC;IAE/B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC9B,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;iBAAM,CAAC;gBACN,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,MAAM,iBAAiB,GAAwB;QAC7C,GAAG,KAAK;QACR,GAAG,EAAE,UAAU;KAChB,CAAC;IAEF,IAAI,QAAQ;QAAE,iBAAiB,CAAC,QAAQ,GAAG,EAAE,CAAC;IAC9C,IAAI,QAAQ;QAAE,iBAAiB,CAAC,QAAQ,GAAG,EAAE,CAAC;IAE9C,IAAI,KAAK,KAAK,SAAS;QAAE,iBAAiB,CAAC,KAAK,GAAG,KAAK,CAAC;IACzD,IAAI,IAAI;QAAE,iBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;IACxC,IAAI,KAAK;QAAE,iBAAiB,CAAC,KAAK,GAAG,KAAK,CAAC;IAC3C,IAAI,KAAK;QAAE,iBAAiB,CAAC,KAAK,GAAG,KAAK,CAAC;IAC3C,IAAI,WAAW;QAAE,iBAAiB,CAAC,WAAW,GAAG,WAAW,CAAC;IAC7D,IAAI,IAAI;QAAE,iBAAiB,CAAC,IAAI,GAAG,IAAI,CAAC;IACxC,IAAI,MAAM;QAAE,iBAAiB,CAAC,MAAM,GAAG,MAAM,CAAC;IAE9C,OAAO,KAAK,CAAC,aAAa,CAAC,gBAAgB,EAAE,iBAAiB,EAAE,QAAQ,CAAC,CAAC;AAC5E,CAAC,CACF,CAAC;AAEF,YAAY,CAAC,WAAW,GAAG,cAAc,CAAC"}
@@ -0,0 +1,11 @@
1
+ import React from 'react';
2
+ export interface TyResizeObserverProps extends React.HTMLAttributes<HTMLElement> {
3
+ /** Required unique identifier for size registry */
4
+ id: string;
5
+ /** Debounce in milliseconds (default: 0 = no debounce) */
6
+ debounce?: number;
7
+ /** Content to observe */
8
+ children?: React.ReactNode;
9
+ }
10
+ export declare const TyResizeObserver: React.ForwardRefExoticComponent<TyResizeObserverProps & React.RefAttributes<HTMLElement>>;
11
+ //# sourceMappingURL=TyResizeObserver.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyResizeObserver.d.ts","sourceRoot":"","sources":["../../src/components/TyResizeObserver.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4B,MAAM,OAAO,CAAC;AAGjD,MAAM,WAAW,qBAAsB,SAAQ,KAAK,CAAC,cAAc,CAAC,WAAW,CAAC;IAC9E,mDAAmD;IACnD,EAAE,EAAE,MAAM,CAAC;IAEX,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,yBAAyB;IACzB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAGD,eAAO,MAAM,gBAAgB,2FAoC5B,CAAC"}
@@ -0,0 +1,28 @@
1
+ import React, { useEffect, useRef } from 'react';
2
+ // React wrapper for ty-resize-observer web component
3
+ export const TyResizeObserver = React.forwardRef(({ children, id, debounce, ...props }, ref) => {
4
+ const elementRef = useRef(null);
5
+ // Combine refs if needed
6
+ useEffect(() => {
7
+ if (ref && elementRef.current) {
8
+ if (typeof ref === 'function') {
9
+ ref(elementRef.current);
10
+ }
11
+ else {
12
+ ref.current = elementRef.current;
13
+ }
14
+ }
15
+ }, [ref]);
16
+ // Convert React props to web component attributes
17
+ const webComponentProps = {
18
+ ...props,
19
+ ref: elementRef,
20
+ id,
21
+ };
22
+ // Add number attributes
23
+ if (debounce !== undefined)
24
+ webComponentProps.debounce = debounce;
25
+ return React.createElement('ty-resize-observer', webComponentProps, children);
26
+ });
27
+ TyResizeObserver.displayName = 'TyResizeObserver';
28
+ //# sourceMappingURL=TyResizeObserver.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TyResizeObserver.js","sourceRoot":"","sources":["../../src/components/TyResizeObserver.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAcjD,qDAAqD;AACrD,MAAM,CAAC,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,CAC9C,CAAC,EACC,QAAQ,EACR,EAAE,EACF,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,GAAG,EAAE,EAAE;IACR,MAAM,UAAU,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAE7C,yBAAyB;IACzB,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,GAAG,IAAI,UAAU,CAAC,OAAO,EAAE,CAAC;YAC9B,IAAI,OAAO,GAAG,KAAK,UAAU,EAAE,CAAC;gBAC9B,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,CAAC;YAC1B,CAAC;iBAAM,CAAC;gBACN,GAAG,CAAC,OAAO,GAAG,UAAU,CAAC,OAAO,CAAC;YACnC,CAAC;QACH,CAAC;IACH,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;IAEV,kDAAkD;IAClD,MAAM,iBAAiB,GAAwB;QAC7C,GAAG,KAAK;QACR,GAAG,EAAE,UAAU;QACf,EAAE;KACH,CAAC;IAEF,wBAAwB;IACxB,IAAI,QAAQ,KAAK,SAAS;QAAE,iBAAiB,CAAC,QAAQ,GAAG,QAAQ,CAAC;IAElE,OAAO,KAAK,CAAC,aAAa,CACxB,oBAAoB,EACpB,iBAAiB,EACjB,QAAQ,CACT,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,gBAAgB,CAAC,WAAW,GAAG,kBAAkB,CAAC"}