@sellmate/design-system-react 0.0.0

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 (9) hide show
  1. package/README.md +11 -0
  2. package/dist/components/components.js +162 -0
  3. package/dist/index.js +3 -0
  4. package/dist/types/components/components.d.ts +89 -0
  5. package/dist/types/index.d.ts +3 -0
  6. package/lib/components/components.ts +241 -0
  7. package/lib/index.ts +11 -0
  8. package/lib/types/index.d.ts +2 -0
  9. package/package.json +58 -0
package/README.md ADDED
@@ -0,0 +1,11 @@
1
+ # `react`
2
+
3
+ > TODO: description
4
+
5
+ ## Usage
6
+
7
+ ```
8
+ const react = require('react');
9
+
10
+ // TODO: DEMONSTRATE API
11
+ ```
package/dist/components/components.js ADDED
@@ -0,0 +1,162 @@
1
+ 'use client';
2
+ import { SdButton as SdButtonElement, defineCustomElement as defineSdButton } from "@sellmate/design-system/dist/components/sd-button.js";
3
+ import { SdCheckbox as SdCheckboxElement, defineCustomElement as defineSdCheckbox } from "@sellmate/design-system/dist/components/sd-checkbox.js";
4
+ import { SdDateBox as SdDateBoxElement, defineCustomElement as defineSdDateBox } from "@sellmate/design-system/dist/components/sd-date-box.js";
5
+ import { SdDatePicker as SdDatePickerElement, defineCustomElement as defineSdDatePicker } from "@sellmate/design-system/dist/components/sd-date-picker.js";
6
+ import { SdDateRangePicker as SdDateRangePickerElement, defineCustomElement as defineSdDateRangePicker } from "@sellmate/design-system/dist/components/sd-date-range-picker.js";
7
+ import { SdIcon as SdIconElement, defineCustomElement as defineSdIcon } from "@sellmate/design-system/dist/components/sd-icon.js";
8
+ import { SdInput as SdInputElement, defineCustomElement as defineSdInput } from "@sellmate/design-system/dist/components/sd-input.js";
9
+ import { SdPagination as SdPaginationElement, defineCustomElement as defineSdPagination } from "@sellmate/design-system/dist/components/sd-pagination.js";
10
+ import { SdPopover as SdPopoverElement, defineCustomElement as defineSdPopover } from "@sellmate/design-system/dist/components/sd-popover.js";
11
+ import { SdPortal as SdPortalElement, defineCustomElement as defineSdPortal } from "@sellmate/design-system/dist/components/sd-portal.js";
12
+ import { SdSelectOption as SdSelectOptionElement, defineCustomElement as defineSdSelectOption } from "@sellmate/design-system/dist/components/sd-select-option.js";
13
+ import { SdSelect as SdSelectElement, defineCustomElement as defineSdSelect } from "@sellmate/design-system/dist/components/sd-select.js";
14
+ import { SdTable as SdTableElement, defineCustomElement as defineSdTable } from "@sellmate/design-system/dist/components/sd-table.js";
15
+ import { SdTag as SdTagElement, defineCustomElement as defineSdTag } from "@sellmate/design-system/dist/components/sd-tag.js";
16
+ import { SdTooltipPortal as SdTooltipPortalElement, defineCustomElement as defineSdTooltipPortal } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
17
+ import { SdTooltip as SdTooltipElement, defineCustomElement as defineSdTooltip } from "@sellmate/design-system/dist/components/sd-tooltip.js";
18
+ import { createComponent } from '@stencil/react-output-target/runtime';
19
+ import React from 'react';
20
+ export const SdButton = /*@__PURE__*/ createComponent({
21
+ tagName: 'sd-button',
22
+ elementClass: SdButtonElement,
23
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
24
+ react: React,
25
+ events: { onSdClick: 'sdClick' },
26
+ defineCustomElement: defineSdButton
27
+ });
28
+ export const SdCheckbox = /*@__PURE__*/ createComponent({
29
+ tagName: 'sd-checkbox',
30
+ elementClass: SdCheckboxElement,
31
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
32
+ react: React,
33
+ events: { onSdChange: 'sdChange' },
34
+ defineCustomElement: defineSdCheckbox
35
+ });
36
+ export const SdDateBox = /*@__PURE__*/ createComponent({
37
+ tagName: 'sd-date-box',
38
+ elementClass: SdDateBoxElement,
39
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
40
+ react: React,
41
+ events: {
42
+ onSdClick: 'sdClick',
43
+ onSdMouseOver: 'sdMouseOver'
44
+ },
45
+ defineCustomElement: defineSdDateBox
46
+ });
47
+ export const SdDatePicker = /*@__PURE__*/ createComponent({
48
+ tagName: 'sd-date-picker',
49
+ elementClass: SdDatePickerElement,
50
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
51
+ react: React,
52
+ events: { onSdChange: 'sdChange' },
53
+ defineCustomElement: defineSdDatePicker
54
+ });
55
+ export const SdDateRangePicker = /*@__PURE__*/ createComponent({
56
+ tagName: 'sd-date-range-picker',
57
+ elementClass: SdDateRangePickerElement,
58
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
59
+ react: React,
60
+ events: { onSdChange: 'sdChange' },
61
+ defineCustomElement: defineSdDateRangePicker
62
+ });
63
+ export const SdIcon = /*@__PURE__*/ createComponent({
64
+ tagName: 'sd-icon',
65
+ elementClass: SdIconElement,
66
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
67
+ react: React,
68
+ events: {},
69
+ defineCustomElement: defineSdIcon
70
+ });
71
+ export const SdInput = /*@__PURE__*/ createComponent({
72
+ tagName: 'sd-input',
73
+ elementClass: SdInputElement,
74
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
75
+ react: React,
76
+ events: {
77
+ onSdClick: 'sdClick',
78
+ onSdInput: 'sdInput',
79
+ onSdChange: 'sdChange',
80
+ onSdFocus: 'sdFocus',
81
+ onSdBlur: 'sdBlur'
82
+ },
83
+ defineCustomElement: defineSdInput
84
+ });
85
+ export const SdPagination = /*@__PURE__*/ createComponent({
86
+ tagName: 'sd-pagination',
87
+ elementClass: SdPaginationElement,
88
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
89
+ react: React,
90
+ events: { onPageChange: 'pageChange' },
91
+ defineCustomElement: defineSdPagination
92
+ });
93
+ export const SdPopover = /*@__PURE__*/ createComponent({
94
+ tagName: 'sd-popover',
95
+ elementClass: SdPopoverElement,
96
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
97
+ react: React,
98
+ events: {},
99
+ defineCustomElement: defineSdPopover
100
+ });
101
+ export const SdPortal = /*@__PURE__*/ createComponent({
102
+ tagName: 'sd-portal',
103
+ elementClass: SdPortalElement,
104
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
105
+ react: React,
106
+ events: { onSdClose: 'sdClose' },
107
+ defineCustomElement: defineSdPortal
108
+ });
109
+ export const SdSelect = /*@__PURE__*/ createComponent({
110
+ tagName: 'sd-select',
111
+ elementClass: SdSelectElement,
112
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
113
+ react: React,
114
+ events: {
115
+ onSdChange: 'sdChange',
116
+ onDropDownShow: 'dropDownShow'
117
+ },
118
+ defineCustomElement: defineSdSelect
119
+ });
120
+ export const SdSelectOption = /*@__PURE__*/ createComponent({
121
+ tagName: 'sd-select-option',
122
+ elementClass: SdSelectOptionElement,
123
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
124
+ react: React,
125
+ events: { onOptionClick: 'optionClick' },
126
+ defineCustomElement: defineSdSelectOption
127
+ });
128
+ export const SdTable = /*@__PURE__*/ createComponent({
129
+ tagName: 'sd-table',
130
+ elementClass: SdTableElement,
131
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
132
+ react: React,
133
+ events: {
134
+ onSdSelectChange: 'sdSelectChange',
135
+ onSdPageChange: 'sdPageChange'
136
+ },
137
+ defineCustomElement: defineSdTable
138
+ });
139
+ export const SdTag = /*@__PURE__*/ createComponent({
140
+ tagName: 'sd-tag',
141
+ elementClass: SdTagElement,
142
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
143
+ react: React,
144
+ events: {},
145
+ defineCustomElement: defineSdTag
146
+ });
147
+ export const SdTooltip = /*@__PURE__*/ createComponent({
148
+ tagName: 'sd-tooltip',
149
+ elementClass: SdTooltipElement,
150
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
151
+ react: React,
152
+ events: {},
153
+ defineCustomElement: defineSdTooltip
154
+ });
155
+ export const SdTooltipPortal = /*@__PURE__*/ createComponent({
156
+ tagName: 'sd-tooltip-portal',
157
+ elementClass: SdTooltipPortalElement,
158
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
159
+ react: React,
160
+ events: { onSdClose: 'sdClose' },
161
+ defineCustomElement: defineSdTooltipPortal
162
+ });
package/dist/index.js ADDED
@@ -0,0 +1,3 @@
1
+ 'use strict';
2
+ export * from './components/components';
3
+ export { defineCustomElements } from '@sellmate/design-system/loader';
package/dist/types/components/components.d.ts ADDED
@@ -0,0 +1,89 @@
1
+ /**
2
+ * This file was automatically generated by the Stencil React Output Target.
3
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
4
+ */
5
+ import { type Event, type Row, type SdButtonCustomEvent, type SdInputCustomEvent, type SdSelectCustomEvent, type SdSelectOptionCustomEvent, type SdTableCustomEvent, type SelectEvents, type SelectOption } from "@sellmate/design-system";
6
+ import { SdButton as SdButtonElement } from "@sellmate/design-system/dist/components/sd-button.js";
7
+ import { SdCheckbox as SdCheckboxElement } from "@sellmate/design-system/dist/components/sd-checkbox.js";
8
+ import { SdDateBox as SdDateBoxElement } from "@sellmate/design-system/dist/components/sd-date-box.js";
9
+ import { SdDatePicker as SdDatePickerElement } from "@sellmate/design-system/dist/components/sd-date-picker.js";
10
+ import { SdDateRangePicker as SdDateRangePickerElement } from "@sellmate/design-system/dist/components/sd-date-range-picker.js";
11
+ import { SdIcon as SdIconElement } from "@sellmate/design-system/dist/components/sd-icon.js";
12
+ import { SdInput as SdInputElement } from "@sellmate/design-system/dist/components/sd-input.js";
13
+ import { SdPagination as SdPaginationElement } from "@sellmate/design-system/dist/components/sd-pagination.js";
14
+ import { SdPopover as SdPopoverElement } from "@sellmate/design-system/dist/components/sd-popover.js";
15
+ import { SdPortal as SdPortalElement } from "@sellmate/design-system/dist/components/sd-portal.js";
16
+ import { SdSelectOption as SdSelectOptionElement } from "@sellmate/design-system/dist/components/sd-select-option.js";
17
+ import { SdSelect as SdSelectElement } from "@sellmate/design-system/dist/components/sd-select.js";
18
+ import { SdTable as SdTableElement } from "@sellmate/design-system/dist/components/sd-table.js";
19
+ import { SdTag as SdTagElement } from "@sellmate/design-system/dist/components/sd-tag.js";
20
+ import { SdTooltipPortal as SdTooltipPortalElement } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
21
+ import { SdTooltip as SdTooltipElement } from "@sellmate/design-system/dist/components/sd-tooltip.js";
22
+ import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
23
+ export type SdButtonEvents = {
24
+ onSdClick: EventName<SdButtonCustomEvent<MouseEvent>>;
25
+ };
26
+ export declare const SdButton: StencilReactComponent<SdButtonElement, SdButtonEvents>;
27
+ export type SdCheckboxEvents = {
28
+ onSdChange: EventName<CustomEvent<any | any[]>>;
29
+ };
30
+ export declare const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEvents>;
31
+ export type SdDateBoxEvents = {
32
+ onSdClick: EventName<CustomEvent<number | string | null>>;
33
+ onSdMouseOver: EventName<CustomEvent<number | string | null>>;
34
+ };
35
+ export declare const SdDateBox: StencilReactComponent<SdDateBoxElement, SdDateBoxEvents>;
36
+ export type SdDatePickerEvents = {
37
+ onSdChange: EventName<CustomEvent<string | null>>;
38
+ };
39
+ export declare const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePickerEvents>;
40
+ export type SdDateRangePickerEvents = {
41
+ onSdChange: EventName<CustomEvent<[string, string]>>;
42
+ };
43
+ export declare const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement, SdDateRangePickerEvents>;
44
+ export type SdIconEvents = NonNullable<unknown>;
45
+ export declare const SdIcon: StencilReactComponent<SdIconElement, SdIconEvents>;
46
+ export type SdInputEvents = {
47
+ onSdClick: EventName<CustomEvent<string | number | null>>;
48
+ onSdInput: EventName<CustomEvent<string | number | null>>;
49
+ onSdChange: EventName<CustomEvent<string | number | null>>;
50
+ onSdFocus: EventName<SdInputCustomEvent<Event>>;
51
+ onSdBlur: EventName<SdInputCustomEvent<Event>>;
52
+ };
53
+ export declare const SdInput: StencilReactComponent<SdInputElement, SdInputEvents>;
54
+ export type SdPaginationEvents = {
55
+ onPageChange: EventName<CustomEvent<number>>;
56
+ };
57
+ export declare const SdPagination: StencilReactComponent<SdPaginationElement, SdPaginationEvents>;
58
+ export type SdPopoverEvents = NonNullable<unknown>;
59
+ export declare const SdPopover: StencilReactComponent<SdPopoverElement, SdPopoverEvents>;
60
+ export type SdPortalEvents = {
61
+ onSdClose: EventName<CustomEvent<void>>;
62
+ };
63
+ export declare const SdPortal: StencilReactComponent<SdPortalElement, SdPortalEvents>;
64
+ export type SdSelectEvents = {
65
+ onSdChange: EventName<SdSelectCustomEvent<SelectEvents['sdChange']>>;
66
+ onDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>;
67
+ };
68
+ export declare const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents>;
69
+ export type SdSelectOptionEvents = {
70
+ onOptionClick: EventName<SdSelectOptionCustomEvent<{
71
+ option: SelectOption;
72
+ index: number;
73
+ event: MouseEvent;
74
+ }>>;
75
+ };
76
+ export declare const SdSelectOption: StencilReactComponent<SdSelectOptionElement, SdSelectOptionEvents>;
77
+ export type SdTableEvents = {
78
+ onSdSelectChange: EventName<SdTableCustomEvent<Row[]>>;
79
+ onSdPageChange: EventName<CustomEvent<number>>;
80
+ };
81
+ export declare const SdTable: StencilReactComponent<SdTableElement, SdTableEvents>;
82
+ export type SdTagEvents = NonNullable<unknown>;
83
+ export declare const SdTag: StencilReactComponent<SdTagElement, SdTagEvents>;
84
+ export type SdTooltipEvents = NonNullable<unknown>;
85
+ export declare const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents>;
86
+ export type SdTooltipPortalEvents = {
87
+ onSdClose: EventName<CustomEvent<void>>;
88
+ };
89
+ export declare const SdTooltipPortal: StencilReactComponent<SdTooltipPortalElement, SdTooltipPortalEvents>;
package/dist/types/index.d.ts ADDED
@@ -0,0 +1,3 @@
1
+ export * from './components/components';
2
+ export { defineCustomElements } from '@sellmate/design-system/loader';
3
+ export type { SdTableSortDir, SdTableColumn, Row as SdTableRow, } from '@sellmate/design-system';
package/lib/components/components.ts ADDED
@@ -0,0 +1,241 @@
1
+ 'use client';
2
+
3
+ /**
4
+ * This file was automatically generated by the Stencil React Output Target.
5
+ * Changes to this file may cause incorrect behavior and will be lost if the code is regenerated.
6
+ */
7
+
8
+ /* eslint-disable */
9
+
10
+ import { type Event, type Row, type SdButtonCustomEvent, type SdInputCustomEvent, type SdSelectCustomEvent, type SdSelectOptionCustomEvent, type SdTableCustomEvent, type SelectEvents, type SelectOption } from "@sellmate/design-system";
11
+ import { SdButton as SdButtonElement, defineCustomElement as defineSdButton } from "@sellmate/design-system/dist/components/sd-button.js";
12
+ import { SdCheckbox as SdCheckboxElement, defineCustomElement as defineSdCheckbox } from "@sellmate/design-system/dist/components/sd-checkbox.js";
13
+ import { SdDateBox as SdDateBoxElement, defineCustomElement as defineSdDateBox } from "@sellmate/design-system/dist/components/sd-date-box.js";
14
+ import { SdDatePicker as SdDatePickerElement, defineCustomElement as defineSdDatePicker } from "@sellmate/design-system/dist/components/sd-date-picker.js";
15
+ import { SdDateRangePicker as SdDateRangePickerElement, defineCustomElement as defineSdDateRangePicker } from "@sellmate/design-system/dist/components/sd-date-range-picker.js";
16
+ import { SdIcon as SdIconElement, defineCustomElement as defineSdIcon } from "@sellmate/design-system/dist/components/sd-icon.js";
17
+ import { SdInput as SdInputElement, defineCustomElement as defineSdInput } from "@sellmate/design-system/dist/components/sd-input.js";
18
+ import { SdPagination as SdPaginationElement, defineCustomElement as defineSdPagination } from "@sellmate/design-system/dist/components/sd-pagination.js";
19
+ import { SdPopover as SdPopoverElement, defineCustomElement as defineSdPopover } from "@sellmate/design-system/dist/components/sd-popover.js";
20
+ import { SdPortal as SdPortalElement, defineCustomElement as defineSdPortal } from "@sellmate/design-system/dist/components/sd-portal.js";
21
+ import { SdSelectOption as SdSelectOptionElement, defineCustomElement as defineSdSelectOption } from "@sellmate/design-system/dist/components/sd-select-option.js";
22
+ import { SdSelect as SdSelectElement, defineCustomElement as defineSdSelect } from "@sellmate/design-system/dist/components/sd-select.js";
23
+ import { SdTable as SdTableElement, defineCustomElement as defineSdTable } from "@sellmate/design-system/dist/components/sd-table.js";
24
+ import { SdTag as SdTagElement, defineCustomElement as defineSdTag } from "@sellmate/design-system/dist/components/sd-tag.js";
25
+ import { SdTooltipPortal as SdTooltipPortalElement, defineCustomElement as defineSdTooltipPortal } from "@sellmate/design-system/dist/components/sd-tooltip-portal.js";
26
+ import { SdTooltip as SdTooltipElement, defineCustomElement as defineSdTooltip } from "@sellmate/design-system/dist/components/sd-tooltip.js";
27
+ import type { EventName, StencilReactComponent } from '@stencil/react-output-target/runtime';
28
+ import { createComponent } from '@stencil/react-output-target/runtime';
29
+ import React from 'react';
30
+
31
+ export type SdButtonEvents = { onSdClick: EventName<SdButtonCustomEvent<MouseEvent>> };
32
+
33
+ export const SdButton: StencilReactComponent<SdButtonElement, SdButtonEvents> = /*@__PURE__*/ createComponent<SdButtonElement, SdButtonEvents>({
34
+ tagName: 'sd-button',
35
+ elementClass: SdButtonElement,
36
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
37
+ react: React,
38
+ events: { onSdClick: 'sdClick' } as SdButtonEvents,
39
+ defineCustomElement: defineSdButton
40
+ });
41
+
42
+ export type SdCheckboxEvents = { onSdChange: EventName<CustomEvent<any | any[]>> };
43
+
44
+ export const SdCheckbox: StencilReactComponent<SdCheckboxElement, SdCheckboxEvents> = /*@__PURE__*/ createComponent<SdCheckboxElement, SdCheckboxEvents>({
45
+ tagName: 'sd-checkbox',
46
+ elementClass: SdCheckboxElement,
47
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
48
+ react: React,
49
+ events: { onSdChange: 'sdChange' } as SdCheckboxEvents,
50
+ defineCustomElement: defineSdCheckbox
51
+ });
52
+
53
+ export type SdDateBoxEvents = {
54
+ onSdClick: EventName<CustomEvent<number | string | null>>,
55
+ onSdMouseOver: EventName<CustomEvent<number | string | null>>
56
+ };
57
+
58
+ export const SdDateBox: StencilReactComponent<SdDateBoxElement, SdDateBoxEvents> = /*@__PURE__*/ createComponent<SdDateBoxElement, SdDateBoxEvents>({
59
+ tagName: 'sd-date-box',
60
+ elementClass: SdDateBoxElement,
61
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
62
+ react: React,
63
+ events: {
64
+ onSdClick: 'sdClick',
65
+ onSdMouseOver: 'sdMouseOver'
66
+ } as SdDateBoxEvents,
67
+ defineCustomElement: defineSdDateBox
68
+ });
69
+
70
+ export type SdDatePickerEvents = { onSdChange: EventName<CustomEvent<string | null>> };
71
+
72
+ export const SdDatePicker: StencilReactComponent<SdDatePickerElement, SdDatePickerEvents> = /*@__PURE__*/ createComponent<SdDatePickerElement, SdDatePickerEvents>({
73
+ tagName: 'sd-date-picker',
74
+ elementClass: SdDatePickerElement,
75
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
76
+ react: React,
77
+ events: { onSdChange: 'sdChange' } as SdDatePickerEvents,
78
+ defineCustomElement: defineSdDatePicker
79
+ });
80
+
81
+ export type SdDateRangePickerEvents = { onSdChange: EventName<CustomEvent<[string, string]>> };
82
+
83
+ export const SdDateRangePicker: StencilReactComponent<SdDateRangePickerElement, SdDateRangePickerEvents> = /*@__PURE__*/ createComponent<SdDateRangePickerElement, SdDateRangePickerEvents>({
84
+ tagName: 'sd-date-range-picker',
85
+ elementClass: SdDateRangePickerElement,
86
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
87
+ react: React,
88
+ events: { onSdChange: 'sdChange' } as SdDateRangePickerEvents,
89
+ defineCustomElement: defineSdDateRangePicker
90
+ });
91
+
92
+ export type SdIconEvents = NonNullable<unknown>;
93
+
94
+ export const SdIcon: StencilReactComponent<SdIconElement, SdIconEvents> = /*@__PURE__*/ createComponent<SdIconElement, SdIconEvents>({
95
+ tagName: 'sd-icon',
96
+ elementClass: SdIconElement,
97
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
98
+ react: React,
99
+ events: {} as SdIconEvents,
100
+ defineCustomElement: defineSdIcon
101
+ });
102
+
103
+ export type SdInputEvents = {
104
+ onSdClick: EventName<CustomEvent<string | number | null>>,
105
+ onSdInput: EventName<CustomEvent<string | number | null>>,
106
+ onSdChange: EventName<CustomEvent<string | number | null>>,
107
+ onSdFocus: EventName<SdInputCustomEvent<Event>>,
108
+ onSdBlur: EventName<SdInputCustomEvent<Event>>
109
+ };
110
+
111
+ export const SdInput: StencilReactComponent<SdInputElement, SdInputEvents> = /*@__PURE__*/ createComponent<SdInputElement, SdInputEvents>({
112
+ tagName: 'sd-input',
113
+ elementClass: SdInputElement,
114
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
115
+ react: React,
116
+ events: {
117
+ onSdClick: 'sdClick',
118
+ onSdInput: 'sdInput',
119
+ onSdChange: 'sdChange',
120
+ onSdFocus: 'sdFocus',
121
+ onSdBlur: 'sdBlur'
122
+ } as SdInputEvents,
123
+ defineCustomElement: defineSdInput
124
+ });
125
+
126
+ export type SdPaginationEvents = { onPageChange: EventName<CustomEvent<number>> };
127
+
128
+ export const SdPagination: StencilReactComponent<SdPaginationElement, SdPaginationEvents> = /*@__PURE__*/ createComponent<SdPaginationElement, SdPaginationEvents>({
129
+ tagName: 'sd-pagination',
130
+ elementClass: SdPaginationElement,
131
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
132
+ react: React,
133
+ events: { onPageChange: 'pageChange' } as SdPaginationEvents,
134
+ defineCustomElement: defineSdPagination
135
+ });
136
+
137
+ export type SdPopoverEvents = NonNullable<unknown>;
138
+
139
+ export const SdPopover: StencilReactComponent<SdPopoverElement, SdPopoverEvents> = /*@__PURE__*/ createComponent<SdPopoverElement, SdPopoverEvents>({
140
+ tagName: 'sd-popover',
141
+ elementClass: SdPopoverElement,
142
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
143
+ react: React,
144
+ events: {} as SdPopoverEvents,
145
+ defineCustomElement: defineSdPopover
146
+ });
147
+
148
+ export type SdPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
149
+
150
+ export const SdPortal: StencilReactComponent<SdPortalElement, SdPortalEvents> = /*@__PURE__*/ createComponent<SdPortalElement, SdPortalEvents>({
151
+ tagName: 'sd-portal',
152
+ elementClass: SdPortalElement,
153
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
154
+ react: React,
155
+ events: { onSdClose: 'sdClose' } as SdPortalEvents,
156
+ defineCustomElement: defineSdPortal
157
+ });
158
+
159
+ export type SdSelectEvents = {
160
+ onSdChange: EventName<SdSelectCustomEvent<SelectEvents['sdChange']>>,
161
+ onDropDownShow: EventName<SdSelectCustomEvent<SelectEvents['dropDownShow']>>
162
+ };
163
+
164
+ export const SdSelect: StencilReactComponent<SdSelectElement, SdSelectEvents> = /*@__PURE__*/ createComponent<SdSelectElement, SdSelectEvents>({
165
+ tagName: 'sd-select',
166
+ elementClass: SdSelectElement,
167
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
168
+ react: React,
169
+ events: {
170
+ onSdChange: 'sdChange',
171
+ onDropDownShow: 'dropDownShow'
172
+ } as SdSelectEvents,
173
+ defineCustomElement: defineSdSelect
174
+ });
175
+
176
+ export type SdSelectOptionEvents = {
177
+ onOptionClick: EventName<SdSelectOptionCustomEvent<{
178
+ option: SelectOption;
179
+ index: number;
180
+ event: MouseEvent;
181
+ }>>
182
+ };
183
+
184
+ export const SdSelectOption: StencilReactComponent<SdSelectOptionElement, SdSelectOptionEvents> = /*@__PURE__*/ createComponent<SdSelectOptionElement, SdSelectOptionEvents>({
185
+ tagName: 'sd-select-option',
186
+ elementClass: SdSelectOptionElement,
187
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
188
+ react: React,
189
+ events: { onOptionClick: 'optionClick' } as SdSelectOptionEvents,
190
+ defineCustomElement: defineSdSelectOption
191
+ });
192
+
193
+ export type SdTableEvents = {
194
+ onSdSelectChange: EventName<SdTableCustomEvent<Row[]>>,
195
+ onSdPageChange: EventName<CustomEvent<number>>
196
+ };
197
+
198
+ export const SdTable: StencilReactComponent<SdTableElement, SdTableEvents> = /*@__PURE__*/ createComponent<SdTableElement, SdTableEvents>({
199
+ tagName: 'sd-table',
200
+ elementClass: SdTableElement,
201
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
202
+ react: React,
203
+ events: {
204
+ onSdSelectChange: 'sdSelectChange',
205
+ onSdPageChange: 'sdPageChange'
206
+ } as SdTableEvents,
207
+ defineCustomElement: defineSdTable
208
+ });
209
+
210
+ export type SdTagEvents = NonNullable<unknown>;
211
+
212
+ export const SdTag: StencilReactComponent<SdTagElement, SdTagEvents> = /*@__PURE__*/ createComponent<SdTagElement, SdTagEvents>({
213
+ tagName: 'sd-tag',
214
+ elementClass: SdTagElement,
215
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
216
+ react: React,
217
+ events: {} as SdTagEvents,
218
+ defineCustomElement: defineSdTag
219
+ });
220
+
221
+ export type SdTooltipEvents = NonNullable<unknown>;
222
+
223
+ export const SdTooltip: StencilReactComponent<SdTooltipElement, SdTooltipEvents> = /*@__PURE__*/ createComponent<SdTooltipElement, SdTooltipEvents>({
224
+ tagName: 'sd-tooltip',
225
+ elementClass: SdTooltipElement,
226
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
227
+ react: React,
228
+ events: {} as SdTooltipEvents,
229
+ defineCustomElement: defineSdTooltip
230
+ });
231
+
232
+ export type SdTooltipPortalEvents = { onSdClose: EventName<CustomEvent<void>> };
233
+
234
+ export const SdTooltipPortal: StencilReactComponent<SdTooltipPortalElement, SdTooltipPortalEvents> = /*@__PURE__*/ createComponent<SdTooltipPortalElement, SdTooltipPortalEvents>({
235
+ tagName: 'sd-tooltip-portal',
236
+ elementClass: SdTooltipPortalElement,
237
+ // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
238
+ react: React,
239
+ events: { onSdClose: 'sdClose' } as SdTooltipPortalEvents,
240
+ defineCustomElement: defineSdTooltipPortal
241
+ });
package/lib/index.ts ADDED
@@ -0,0 +1,11 @@
1
+ 'use strict';
2
+
3
+ export * from './components/components';
4
+ export { defineCustomElements } from '@sellmate/design-system/loader';
5
+
6
+ // Export sd-table types for React usage
7
+ export type {
8
+ SdTableSortDir,
9
+ SdTableColumn,
10
+ Row as SdTableRow,
11
+ } from '@sellmate/design-system';
package/lib/types/index.d.ts ADDED
@@ -0,0 +1,2 @@
1
+ export * from './components/components';
2
+ export { defineCustomElements } from '@sellmate/design-system/loader';
package/package.json ADDED
@@ -0,0 +1,58 @@
1
+ {
2
+ "name": "@sellmate/design-system-react",
3
+ "version": "0.0.0",
4
+ "description": "Design System - React Component Wrappers",
5
+ "keywords": [
6
+ "react",
7
+ "web-components",
8
+ "design-system",
9
+ "ui-library"
10
+ ],
11
+ "homepage": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/blob/main/README.md?ref_type=heads",
12
+ "repository": {
13
+ "type": "git",
14
+ "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system.git"
15
+ },
16
+ "bugs": {
17
+ "url": "https://gitlab.corp.sellmate.co.kr/sellmate/frontend/design-system/-/issues"
18
+ },
19
+ "license": "MIT",
20
+ "author": {
21
+ "name": "MeeKyeong Kim",
22
+ "email": "kmeijjing@gmail.com"
23
+ },
24
+ "main": "dist/index.js",
25
+ "module": "dist/index.js",
26
+ "types": "dist/types/index.d.ts",
27
+ "directories": {
28
+ "lib": "lib",
29
+ "test": "__tests__"
30
+ },
31
+ "files": [
32
+ "dist",
33
+ "lib"
34
+ ],
35
+ "publishConfig": {
36
+ "access": "public"
37
+ },
38
+ "scripts": {
39
+ "build": "tsc",
40
+ "clean": "rm -rf lib",
41
+ "dev": "tsc --watch"
42
+ },
43
+ "dependencies": {
44
+ "@sellmate/design-system": "^0.0.0",
45
+ "@stencil/react-output-target": "^1.2.0"
46
+ },
47
+ "peerDependencies": {
48
+ "react": ">=16.8.0",
49
+ "react-dom": ">=16.8.0"
50
+ },
51
+ "devDependencies": {
52
+ "@types/react": "^19.2.2",
53
+ "react": "^19.2.0",
54
+ "react-dom": "^19.2.0",
55
+ "typescript": "^5.9.3"
56
+ },
57
+ "gitHead": "cb83a0141f6b846b81fd382ad77a1f0a12009bf2"
58
+ }