tyrell-react 1.0.0-TC44 → 1.0.0-TC46
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/TyCalendar.d.ts.map +1 -1
- package/dist/components/TyCalendar.js +0 -8
- package/dist/components/TyCalendar.js.map +1 -1
- package/dist/components/TyCalendarMonth.d.ts.map +1 -1
- package/dist/components/TyCalendarMonth.js +0 -5
- package/dist/components/TyCalendarMonth.js.map +1 -1
- package/dist/components/TyCalendarNavigation.d.ts.map +1 -1
- package/dist/components/TyCalendarNavigation.js +0 -5
- package/dist/components/TyCalendarNavigation.js.map +1 -1
- package/dist/components/TyCheckbox.d.ts.map +1 -1
- package/dist/components/TyCheckbox.js +0 -8
- package/dist/components/TyCheckbox.js.map +1 -1
- package/dist/components/TyCopy.d.ts.map +1 -1
- package/dist/components/TyCopy.js +0 -6
- package/dist/components/TyCopy.js.map +1 -1
- package/dist/components/TyDatePicker.d.ts +5 -1
- package/dist/components/TyDatePicker.d.ts.map +1 -1
- package/dist/components/TyDatePicker.js +0 -7
- package/dist/components/TyDatePicker.js.map +1 -1
- package/dist/components/TyFileUpload.d.ts.map +1 -1
- package/dist/components/TyFileUpload.js +0 -1
- package/dist/components/TyFileUpload.js.map +1 -1
- package/dist/components/TyIcon.d.ts.map +1 -1
- package/dist/components/TyIcon.js +0 -4
- package/dist/components/TyIcon.js.map +1 -1
- package/dist/components/TyInput.d.ts.map +1 -1
- package/dist/components/TyInput.js +0 -10
- package/dist/components/TyInput.js.map +1 -1
- package/dist/components/TyModal.d.ts.map +1 -1
- package/dist/components/TyModal.js +0 -6
- package/dist/components/TyModal.js.map +1 -1
- package/dist/components/TyOption.d.ts.map +1 -1
- package/dist/components/TyOption.js +0 -2
- package/dist/components/TyOption.js.map +1 -1
- package/dist/components/TyPopup.d.ts.map +1 -1
- package/dist/components/TyPopup.js +0 -4
- package/dist/components/TyPopup.js.map +1 -1
- package/dist/components/TyResizeObserver.d.ts.map +1 -1
- package/dist/components/TyResizeObserver.js +0 -4
- package/dist/components/TyResizeObserver.js.map +1 -1
- package/dist/components/TyScrollContainer.d.ts.map +1 -1
- package/dist/components/TyScrollContainer.js +0 -6
- package/dist/components/TyScrollContainer.js.map +1 -1
- package/dist/components/TySelect.d.ts +10 -2
- package/dist/components/TySelect.d.ts.map +1 -1
- package/dist/components/TySelect.js +6 -7
- package/dist/components/TySelect.js.map +1 -1
- package/dist/components/TyStep.d.ts.map +1 -1
- package/dist/components/TyStep.js +0 -5
- package/dist/components/TyStep.js.map +1 -1
- package/dist/components/TyTab.d.ts.map +1 -1
- package/dist/components/TyTab.js +0 -6
- package/dist/components/TyTab.js.map +1 -1
- package/dist/components/TyTabs.d.ts.map +1 -1
- package/dist/components/TyTabs.js +0 -5
- package/dist/components/TyTabs.js.map +1 -1
- package/dist/components/TyTag.d.ts.map +1 -1
- package/dist/components/TyTag.js +0 -2
- package/dist/components/TyTag.js.map +1 -1
- package/dist/components/TyTextarea.d.ts.map +1 -1
- package/dist/components/TyTextarea.js +0 -6
- package/dist/components/TyTextarea.js.map +1 -1
- package/dist/components/TyTooltip.d.ts.map +1 -1
- package/dist/components/TyTooltip.js +0 -4
- package/dist/components/TyTooltip.js.map +1 -1
- package/dist/components/TyWizard.d.ts.map +1 -1
- package/dist/components/TyWizard.js +0 -5
- package/dist/components/TyWizard.js.map +1 -1
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +2 -62
- package/dist/components/index.js.map +1 -1
- package/dist/version.d.ts +1 -1
- package/dist/version.js +1 -1
- package/package.json +1 -1
- package/src/components/TyCalendar.tsx +0 -9
- package/src/components/TyCalendarMonth.tsx +0 -6
- package/src/components/TyCalendarNavigation.tsx +0 -6
- package/src/components/TyCheckbox.tsx +0 -9
- package/src/components/TyCopy.tsx +0 -7
- package/src/components/TyDatePicker.tsx +7 -10
- package/src/components/TyFileUpload.tsx +0 -2
- package/src/components/TyIcon.tsx +0 -5
- package/src/components/TyInput.tsx +0 -12
- package/src/components/TyModal.tsx +0 -9
- package/src/components/TyOption.tsx +0 -3
- package/src/components/TyPopup.tsx +0 -6
- package/src/components/TyResizeObserver.tsx +0 -5
- package/src/components/TyScrollContainer.tsx +0 -8
- package/src/components/TySelect.tsx +19 -12
- package/src/components/TyStep.tsx +0 -6
- package/src/components/TyTab.tsx +0 -7
- package/src/components/TyTabs.tsx +0 -6
- package/src/components/TyTag.tsx +0 -3
- package/src/components/TyTextarea.tsx +0 -8
- package/src/components/TyTooltip.tsx +0 -5
- package/src/components/TyWizard.tsx +0 -6
- package/src/components/index.ts +2 -97
- package/src/version.ts +1 -1
|
@@ -5,7 +5,6 @@ import { useBooleanProperty } from '../utils/use-boolean-prop';
|
|
|
5
5
|
type BuiltinFlavor = 'primary' | 'secondary' | 'success' | 'danger' | 'warning' | 'neutral';
|
|
6
6
|
type ShadedFlavor = BuiltinFlavor | `${BuiltinFlavor}+` | `${BuiltinFlavor}-`;
|
|
7
7
|
|
|
8
|
-
// Type definitions for Ty Tooltip component
|
|
9
8
|
export interface TyTooltipProps extends React.HTMLAttributes<HTMLElement> {
|
|
10
9
|
/** Tooltip positioning relative to the parent element */
|
|
11
10
|
placement?: 'top' | 'bottom' | 'left' | 'right';
|
|
@@ -26,7 +25,6 @@ export interface TyTooltipProps extends React.HTMLAttributes<HTMLElement> {
|
|
|
26
25
|
children?: React.ReactNode;
|
|
27
26
|
}
|
|
28
27
|
|
|
29
|
-
// React wrapper for ty-tooltip web component
|
|
30
28
|
export const TyTooltip = React.forwardRef<HTMLElement, TyTooltipProps>(
|
|
31
29
|
({
|
|
32
30
|
placement,
|
|
@@ -39,7 +37,6 @@ export const TyTooltip = React.forwardRef<HTMLElement, TyTooltipProps>(
|
|
|
39
37
|
}, ref) => {
|
|
40
38
|
const elementRef = useRef<HTMLElement>(null);
|
|
41
39
|
|
|
42
|
-
// Handle ref forwarding
|
|
43
40
|
useEffect(() => {
|
|
44
41
|
if (ref && elementRef.current) {
|
|
45
42
|
if (typeof ref === 'function') {
|
|
@@ -50,13 +47,11 @@ export const TyTooltip = React.forwardRef<HTMLElement, TyTooltipProps>(
|
|
|
50
47
|
}
|
|
51
48
|
}, [ref]);
|
|
52
49
|
|
|
53
|
-
// Convert React props to web component attributes
|
|
54
50
|
const webComponentProps: Record<string, any> = {
|
|
55
51
|
...hostProps(props),
|
|
56
52
|
ref: elementRef,
|
|
57
53
|
};
|
|
58
54
|
|
|
59
|
-
// Add optional attributes only if they have values
|
|
60
55
|
if (placement) {
|
|
61
56
|
webComponentProps.placement = placement;
|
|
62
57
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import React, { useEffect, useRef } from 'react';
|
|
2
2
|
import { hostProps } from '../utils/host-props';
|
|
3
3
|
|
|
4
|
-
// Type definitions for Ty Wizard component
|
|
5
4
|
export interface TyWizardProps extends Omit<React.HTMLAttributes<HTMLElement>, 'onChange'> {
|
|
6
5
|
/** Content area width (accepts px or %) */
|
|
7
6
|
width?: string;
|
|
@@ -33,7 +32,6 @@ export interface WizardStepChangeDetail {
|
|
|
33
32
|
direction: 'forward' | 'backward' | 'none';
|
|
34
33
|
}
|
|
35
34
|
|
|
36
|
-
// React wrapper for ty-wizard web component
|
|
37
35
|
export const TyWizard = React.forwardRef<HTMLElement, TyWizardProps>(
|
|
38
36
|
({
|
|
39
37
|
children,
|
|
@@ -47,7 +45,6 @@ export const TyWizard = React.forwardRef<HTMLElement, TyWizardProps>(
|
|
|
47
45
|
}, ref) => {
|
|
48
46
|
const elementRef = useRef<HTMLElement>(null);
|
|
49
47
|
|
|
50
|
-
// Handle step change events
|
|
51
48
|
useEffect(() => {
|
|
52
49
|
const element = elementRef.current;
|
|
53
50
|
if (!element) return;
|
|
@@ -65,7 +62,6 @@ export const TyWizard = React.forwardRef<HTMLElement, TyWizardProps>(
|
|
|
65
62
|
};
|
|
66
63
|
}, [onStepChange]);
|
|
67
64
|
|
|
68
|
-
// Combine refs if needed
|
|
69
65
|
useEffect(() => {
|
|
70
66
|
if (ref && elementRef.current) {
|
|
71
67
|
if (typeof ref === 'function') {
|
|
@@ -76,13 +72,11 @@ export const TyWizard = React.forwardRef<HTMLElement, TyWizardProps>(
|
|
|
76
72
|
}
|
|
77
73
|
}, [ref]);
|
|
78
74
|
|
|
79
|
-
// Convert React props to web component attributes
|
|
80
75
|
const webComponentProps: Record<string, any> = {
|
|
81
76
|
...hostProps(props),
|
|
82
77
|
ref: elementRef,
|
|
83
78
|
};
|
|
84
79
|
|
|
85
|
-
// Add string attributes
|
|
86
80
|
if (width) webComponentProps.width = width;
|
|
87
81
|
if (height) webComponentProps.height = height;
|
|
88
82
|
if (active) webComponentProps.active = active;
|
package/src/components/index.ts
CHANGED
|
@@ -1,7 +1,3 @@
|
|
|
1
|
-
// ===================================================================
|
|
2
|
-
// VERSION
|
|
3
|
-
// ===================================================================
|
|
4
|
-
|
|
5
1
|
import { VERSION } from '../version';
|
|
6
2
|
|
|
7
3
|
/** Current version of tyrell-react (auto-synced with package.json on build). */
|
|
@@ -19,18 +15,8 @@ if (typeof window !== 'undefined') {
|
|
|
19
15
|
);
|
|
20
16
|
}
|
|
21
17
|
|
|
22
|
-
//
|
|
23
|
-
//
|
|
24
|
-
// ===================================================================
|
|
25
|
-
// This file provides two export styles for maximum developer flexibility:
|
|
26
|
-
// 1. Ty-prefixed exports (TyButton, TyInput) - explicit and backward compatible
|
|
27
|
-
// 2. Short name exports (Button, Input) - clean and familiar to React developers
|
|
28
|
-
//
|
|
29
|
-
// Choose the style that fits your team's preferences!
|
|
30
|
-
|
|
31
|
-
// ===================================================================
|
|
32
|
-
// TY-PREFIXED EXPORTS (Explicit Style - Backward Compatible)
|
|
33
|
-
// ===================================================================
|
|
18
|
+
// Every component is exported twice: Ty-prefixed (TyButton) and short
|
|
19
|
+
// (Button). Both names point at the same wrapper — pick one per project.
|
|
34
20
|
|
|
35
21
|
export { TyButton } from './TyButton';
|
|
36
22
|
export type { TyButtonProps, TyButtonCSSProperties } from './TyButton';
|
|
@@ -116,11 +102,6 @@ export type { TyResizeObserverProps } from './TyResizeObserver';
|
|
|
116
102
|
export { TyScrollContainer } from './TyScrollContainer';
|
|
117
103
|
export type { TyScrollContainerProps, TyScrollContainerRef } from './TyScrollContainer';
|
|
118
104
|
|
|
119
|
-
|
|
120
|
-
// ===================================================================
|
|
121
|
-
// SHORT NAME EXPORTS (Clean Style - Developer Choice)
|
|
122
|
-
// ===================================================================
|
|
123
|
-
|
|
124
105
|
export { TyButton as Button } from './TyButton';
|
|
125
106
|
export { TyTag as Tag } from './TyTag';
|
|
126
107
|
export { TyInput as Input } from './TyInput';
|
|
@@ -147,128 +128,52 @@ export { TyStep as Step } from './TyStep';
|
|
|
147
128
|
export { TyResizeObserver as ResizeObserver } from './TyResizeObserver';
|
|
148
129
|
export { TyScrollContainer as ScrollContainer } from './TyScrollContainer';
|
|
149
130
|
|
|
150
|
-
// ===================================================================
|
|
151
|
-
// TYPE ALIASES (Both Styles Supported)
|
|
152
|
-
// ===================================================================
|
|
153
|
-
|
|
154
|
-
// Button types
|
|
155
131
|
export type { TyButtonProps as ButtonProps } from './TyButton';
|
|
156
132
|
|
|
157
|
-
// Tag types
|
|
158
133
|
export type { TyTagProps as TagProps } from './TyTag';
|
|
159
134
|
|
|
160
|
-
// Input types
|
|
161
135
|
export type { TyInputProps as InputProps, TyInputEventDetail as InputEventDetail } from './TyInput';
|
|
162
136
|
|
|
163
|
-
// Textarea types
|
|
164
137
|
export type { TyTextareaProps as TextareaProps, TyTextareaEventDetail as TextareaEventDetail } from './TyTextarea';
|
|
165
138
|
|
|
166
|
-
// Option types
|
|
167
139
|
export type { TyOptionProps as OptionProps } from './TyOption';
|
|
168
140
|
|
|
169
|
-
// Icon types
|
|
170
141
|
export type { TyIconProps as IconProps } from './TyIcon';
|
|
171
142
|
|
|
172
|
-
// Modal types
|
|
173
143
|
export type { TyModalProps as ModalProps, TyModalEventDetail as ModalEventDetail, TyModalRef as ModalRef } from './TyModal';
|
|
174
144
|
|
|
175
|
-
// Tooltip types
|
|
176
145
|
export type { TyTooltipProps as TooltipProps } from './TyTooltip';
|
|
177
146
|
|
|
178
|
-
// Calendar types
|
|
179
147
|
export type { TyCalendarProps as CalendarProps, TyCalendarChangeEventDetail as CalendarChangeEventDetail, TyCalendarNavigateEventDetail as CalendarNavigateEventDetail } from './TyCalendar';
|
|
180
148
|
|
|
181
|
-
// DatePicker types
|
|
182
149
|
export type { TyDatePickerProps as DatePickerProps, TyDatePickerEventDetail as DatePickerEventDetail } from './TyDatePicker';
|
|
183
150
|
|
|
184
|
-
// Popup types
|
|
185
151
|
export type { TyPopupProps as PopupProps, TyPopupElement as PopupElement } from './TyPopup';
|
|
186
152
|
|
|
187
|
-
// Checkbox types
|
|
188
153
|
export type { TyCheckboxProps as CheckboxProps, TyCheckboxEventDetail as CheckboxEventDetail } from './TyCheckbox';
|
|
189
154
|
|
|
190
|
-
// Switch types
|
|
191
155
|
export type { TySwitchProps as SwitchProps, TySwitchEventDetail as SwitchEventDetail } from './TySwitch';
|
|
192
156
|
|
|
193
|
-
// Radio types
|
|
194
157
|
export type { TyRadioProps as RadioProps } from './TyRadio';
|
|
195
158
|
|
|
196
|
-
// RadioGroup types
|
|
197
159
|
export type { TyRadioGroupProps as RadioGroupProps, TyRadioGroupEventDetail as RadioGroupEventDetail } from './TyRadioGroup';
|
|
198
160
|
|
|
199
|
-
// Copy types
|
|
200
161
|
export type { TyCopyProps as CopyProps } from './TyCopy';
|
|
201
162
|
|
|
202
|
-
// FileUpload types
|
|
203
163
|
export type { TyFileUploadProps as FileUploadProps, TyFileUploadEventDetail as FileUploadEventDetail } from './TyFileUpload';
|
|
204
164
|
|
|
205
|
-
// Tabs types
|
|
206
165
|
export type { TyTabsProps as TabsProps } from './TyTabs';
|
|
207
166
|
|
|
208
|
-
// Tab types
|
|
209
167
|
export type { TyTabProps as TabProps } from './TyTab';
|
|
210
168
|
|
|
211
|
-
// CalendarMonth types
|
|
212
169
|
export type { TyCalendarMonthProps as CalendarMonthProps } from './TyCalendarMonth';
|
|
213
170
|
|
|
214
|
-
// CalendarNavigation types
|
|
215
171
|
export type { TyCalendarNavigationProps as CalendarNavigationProps } from './TyCalendarNavigation';
|
|
216
172
|
|
|
217
|
-
// Wizard types
|
|
218
173
|
export type { TyWizardProps as WizardProps, WizardStepChangeDetail as StepChangeDetail } from './TyWizard';
|
|
219
174
|
|
|
220
|
-
// Step types
|
|
221
175
|
export type { TyStepProps as StepProps } from './TyStep';
|
|
222
176
|
|
|
223
|
-
// ResizeObserver types
|
|
224
177
|
export type { TyResizeObserverProps as ResizeObserverProps } from './TyResizeObserver';
|
|
225
178
|
|
|
226
|
-
// ScrollContainer types
|
|
227
179
|
export type { TyScrollContainerProps as ScrollContainerProps, TyScrollContainerRef as ScrollContainerRef } from './TyScrollContainer';
|
|
228
|
-
|
|
229
|
-
// ===================================================================
|
|
230
|
-
// USAGE EXAMPLES
|
|
231
|
-
// ===================================================================
|
|
232
|
-
|
|
233
|
-
/*
|
|
234
|
-
|
|
235
|
-
// STYLE 1: Ty-prefixed (Explicit and backward compatible)
|
|
236
|
-
import { TyButton, TyInput, TyModal } from 'tyrell-react';
|
|
237
|
-
import type { TyButtonProps, TyInputProps } from 'tyrell-react';
|
|
238
|
-
|
|
239
|
-
function MyComponent() {
|
|
240
|
-
return (
|
|
241
|
-
<TyModal>
|
|
242
|
-
<TyInput placeholder="Enter text..." />
|
|
243
|
-
<TyButton>Submit</TyButton>
|
|
244
|
-
</TyModal>
|
|
245
|
-
);
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
// STYLE 2: Short names (Clean and familiar)
|
|
249
|
-
import { Button, Input, Modal } from 'tyrell-react';
|
|
250
|
-
import type { ButtonProps, InputProps } from 'tyrell-react';
|
|
251
|
-
|
|
252
|
-
function MyComponent() {
|
|
253
|
-
return (
|
|
254
|
-
<Modal>
|
|
255
|
-
<Input placeholder="Enter text..." />
|
|
256
|
-
<Button>Submit</Button>
|
|
257
|
-
</Modal>
|
|
258
|
-
);
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
// STYLE 3: Mixed (Team preferences)
|
|
262
|
-
import { TyModal, Input, Button } from 'tyrell-react';
|
|
263
|
-
import type { TyModalProps, InputProps } from 'tyrell-react';
|
|
264
|
-
|
|
265
|
-
function MyComponent() {
|
|
266
|
-
return (
|
|
267
|
-
<TyModal>
|
|
268
|
-
<Input placeholder="Enter text..." />
|
|
269
|
-
<Button>Submit</Button>
|
|
270
|
-
</TyModal>
|
|
271
|
-
);
|
|
272
|
-
}
|
|
273
|
-
|
|
274
|
-
*/
|
package/src/version.ts
CHANGED