le-kit 0.1.2 → 0.1.4
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/docs.json +1 -1
- package/package.json +3 -54
- package/readme.md +2 -35
- package/dist/admin/index.d.ts +0 -25
- package/dist/admin/index.js +0 -80
- package/dist/admin/loader.js +0 -9
- package/dist/collection/index-admin.js +0 -27
- package/dist/collection/index-admin.js.map +0 -1
- package/dist/collection/index-core.js +0 -25
- package/dist/collection/index-core.js.map +0 -1
- package/dist/core/components/index.d.ts +0 -64
- package/dist/core/components/index.js +0 -127
- package/dist/core/components/index.js.map +0 -1
- package/dist/core/components/le-box.d.ts +0 -11
- package/dist/core/components/le-box.js +0 -246
- package/dist/core/components/le-box.js.map +0 -1
- package/dist/core/components/le-button.d.ts +0 -11
- package/dist/core/components/le-button.js +0 -9
- package/dist/core/components/le-button.js.map +0 -1
- package/dist/core/components/le-button2.js +0 -1358
- package/dist/core/components/le-button2.js.map +0 -1
- package/dist/core/components/le-card.d.ts +0 -11
- package/dist/core/components/le-card.js +0 -73
- package/dist/core/components/le-card.js.map +0 -1
- package/dist/core/components/le-checkbox.d.ts +0 -11
- package/dist/core/components/le-checkbox.js +0 -9
- package/dist/core/components/le-checkbox.js.map +0 -1
- package/dist/core/components/le-component.js.map +0 -1
- package/dist/core/components/le-number-input.d.ts +0 -11
- package/dist/core/components/le-number-input.js +0 -261
- package/dist/core/components/le-number-input.js.map +0 -1
- package/dist/core/components/le-popover.d.ts +0 -11
- package/dist/core/components/le-popover.js +0 -9
- package/dist/core/components/le-popover.js.map +0 -1
- package/dist/core/components/le-popover2.js +0 -382
- package/dist/core/components/le-popover2.js.map +0 -1
- package/dist/core/components/le-popup.d.ts +0 -11
- package/dist/core/components/le-popup.js +0 -269
- package/dist/core/components/le-popup.js.map +0 -1
- package/dist/core/components/le-round-progress.d.ts +0 -11
- package/dist/core/components/le-round-progress.js +0 -135
- package/dist/core/components/le-round-progress.js.map +0 -1
- package/dist/core/components/le-slot.js.map +0 -1
- package/dist/core/components/le-stack.d.ts +0 -11
- package/dist/core/components/le-stack.js +0 -188
- package/dist/core/components/le-stack.js.map +0 -1
- package/dist/core/components/le-string-input.d.ts +0 -11
- package/dist/core/components/le-string-input.js +0 -9
- package/dist/core/components/le-string-input.js.map +0 -1
- package/dist/core/components/le-text.d.ts +0 -11
- package/dist/core/components/le-text.js +0 -388
- package/dist/core/components/le-text.js.map +0 -1
- package/dist/core/components/le-turntable.d.ts +0 -11
- package/dist/core/components/le-turntable.js +0 -164
- package/dist/core/components/le-turntable.js.map +0 -1
- package/dist/core/index.d.ts +0 -23
- package/dist/core/index.js +0 -74
- package/dist/core/loader.js +0 -9
- package/dist/core/stencil-runtime.js +0 -1
- package/dist/types/index-admin.d.ts +0 -29
- package/dist/types/index-core.d.ts +0 -27
|
@@ -1,246 +0,0 @@
|
|
|
1
|
-
import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
|
|
2
|
-
import { e as classnames, f as defineCustomElement$2, h as defineCustomElement$3, j as defineCustomElement$5, k as defineCustomElement$6, l as defineCustomElement$7 } from './le-button2.js';
|
|
3
|
-
import { d as defineCustomElement$4 } from './le-popover2.js';
|
|
4
|
-
|
|
5
|
-
const leBoxDefaultCss = ":host{display:block;box-sizing:border-box}:host([hidden]){display:none}.box{width:100%;height:100%;box-sizing:border-box}.content{width:100%;height:100%;box-sizing:border-box;background:var(--le-box-bg, transparent);border-radius:var(--le-box-border-radius, 0);padding:var(--le-box-padding, 0)}:host(.display-flex) .content{min-height:100%}";
|
|
6
|
-
|
|
7
|
-
const LeBox$1 = /*@__PURE__*/ proxyCustomElement(class LeBox extends HTMLElement {
|
|
8
|
-
constructor(registerHost) {
|
|
9
|
-
super();
|
|
10
|
-
if (registerHost !== false) {
|
|
11
|
-
this.__registerHost();
|
|
12
|
-
}
|
|
13
|
-
this.__attachShadow();
|
|
14
|
-
}
|
|
15
|
-
get el() { return this; }
|
|
16
|
-
/**
|
|
17
|
-
* Flex grow factor - how much the item should grow relative to siblings
|
|
18
|
-
* @min 0
|
|
19
|
-
*/
|
|
20
|
-
grow = 0;
|
|
21
|
-
/**
|
|
22
|
-
* Flex shrink factor - how much the item should shrink relative to siblings
|
|
23
|
-
* @min 0
|
|
24
|
-
*/
|
|
25
|
-
shrink = 1;
|
|
26
|
-
/**
|
|
27
|
-
* Flex basis - initial size before growing/shrinking (e.g., '200px', '25%', 'auto')
|
|
28
|
-
*/
|
|
29
|
-
basis = 'auto';
|
|
30
|
-
/**
|
|
31
|
-
* Width of the box (CSS value like '100px', '50%', 'auto')
|
|
32
|
-
*/
|
|
33
|
-
width;
|
|
34
|
-
/**
|
|
35
|
-
* Height of the box (CSS value)
|
|
36
|
-
*/
|
|
37
|
-
height;
|
|
38
|
-
/**
|
|
39
|
-
* Minimum width constraint
|
|
40
|
-
*/
|
|
41
|
-
minWidth;
|
|
42
|
-
/**
|
|
43
|
-
* Maximum width constraint
|
|
44
|
-
*/
|
|
45
|
-
maxWidth;
|
|
46
|
-
/**
|
|
47
|
-
* Minimum height constraint
|
|
48
|
-
*/
|
|
49
|
-
minHeight;
|
|
50
|
-
/**
|
|
51
|
-
* Maximum height constraint
|
|
52
|
-
*/
|
|
53
|
-
maxHeight;
|
|
54
|
-
/**
|
|
55
|
-
* Background color or CSS value (e.g., '#f0f0f0', 'var(--le-color-primary-light)')
|
|
56
|
-
*/
|
|
57
|
-
background;
|
|
58
|
-
/**
|
|
59
|
-
* Border radius (e.g., '8px', 'var(--le-radius-md)')
|
|
60
|
-
*/
|
|
61
|
-
borderRadius;
|
|
62
|
-
/**
|
|
63
|
-
* Border style (e.g., '1px solid #ccc', '2px dashed var(--le-color-border)')
|
|
64
|
-
*/
|
|
65
|
-
border;
|
|
66
|
-
/**
|
|
67
|
-
* Self-alignment override for this item on the cross axis
|
|
68
|
-
* @allowedValues auto | start | center | end | stretch | baseline
|
|
69
|
-
*/
|
|
70
|
-
alignSelf = 'auto';
|
|
71
|
-
/**
|
|
72
|
-
* Internal horizontal alignment of content
|
|
73
|
-
* @allowedValues start | center | end | stretch
|
|
74
|
-
*/
|
|
75
|
-
alignContent = 'stretch';
|
|
76
|
-
/**
|
|
77
|
-
* Internal vertical alignment of content
|
|
78
|
-
* @allowedValues start | center | end | stretch
|
|
79
|
-
*/
|
|
80
|
-
justifyContent = 'start';
|
|
81
|
-
/**
|
|
82
|
-
* Padding inside the box (CSS value like '8px', '1rem')
|
|
83
|
-
*/
|
|
84
|
-
padding;
|
|
85
|
-
/**
|
|
86
|
-
* Order in the flex container (lower values come first)
|
|
87
|
-
*/
|
|
88
|
-
order;
|
|
89
|
-
/**
|
|
90
|
-
* Whether to display box content as flex (for internal alignment)
|
|
91
|
-
*/
|
|
92
|
-
displayFlex = false;
|
|
93
|
-
/**
|
|
94
|
-
* Direction of internal flex layout when displayFlex is true
|
|
95
|
-
* @allowedValues horizontal | vertical
|
|
96
|
-
*/
|
|
97
|
-
innerDirection = 'vertical';
|
|
98
|
-
/**
|
|
99
|
-
* Gap between internal flex items when displayFlex is true
|
|
100
|
-
*/
|
|
101
|
-
innerGap;
|
|
102
|
-
getAlignSelf() {
|
|
103
|
-
const alignMap = {
|
|
104
|
-
auto: 'auto',
|
|
105
|
-
start: 'flex-start',
|
|
106
|
-
center: 'center',
|
|
107
|
-
end: 'flex-end',
|
|
108
|
-
stretch: 'stretch',
|
|
109
|
-
baseline: 'baseline',
|
|
110
|
-
};
|
|
111
|
-
return alignMap[this.alignSelf] || 'auto';
|
|
112
|
-
}
|
|
113
|
-
getContentAlign() {
|
|
114
|
-
const alignMap = {
|
|
115
|
-
start: 'flex-start',
|
|
116
|
-
center: 'center',
|
|
117
|
-
end: 'flex-end',
|
|
118
|
-
stretch: 'stretch',
|
|
119
|
-
};
|
|
120
|
-
return alignMap[this.alignContent] || 'stretch';
|
|
121
|
-
}
|
|
122
|
-
getContentJustify() {
|
|
123
|
-
const justifyMap = {
|
|
124
|
-
start: 'flex-start',
|
|
125
|
-
center: 'center',
|
|
126
|
-
end: 'flex-end',
|
|
127
|
-
stretch: 'stretch',
|
|
128
|
-
};
|
|
129
|
-
return justifyMap[this.justifyContent] || 'flex-start';
|
|
130
|
-
}
|
|
131
|
-
render() {
|
|
132
|
-
// Host styles for flex item behavior
|
|
133
|
-
const hostStyle = {
|
|
134
|
-
flexGrow: String(this.grow),
|
|
135
|
-
flexShrink: String(this.shrink),
|
|
136
|
-
flexBasis: this.basis,
|
|
137
|
-
alignSelf: this.getAlignSelf(),
|
|
138
|
-
};
|
|
139
|
-
if (this.width)
|
|
140
|
-
hostStyle.width = this.width;
|
|
141
|
-
if (this.height)
|
|
142
|
-
hostStyle.height = this.height;
|
|
143
|
-
if (this.minWidth)
|
|
144
|
-
hostStyle.minWidth = this.minWidth;
|
|
145
|
-
if (this.maxWidth)
|
|
146
|
-
hostStyle.maxWidth = this.maxWidth;
|
|
147
|
-
if (this.minHeight)
|
|
148
|
-
hostStyle.minHeight = this.minHeight;
|
|
149
|
-
if (this.maxHeight)
|
|
150
|
-
hostStyle.maxHeight = this.maxHeight;
|
|
151
|
-
if (this.order !== undefined)
|
|
152
|
-
hostStyle.order = String(this.order);
|
|
153
|
-
// Inner content styles
|
|
154
|
-
const contentStyle = {};
|
|
155
|
-
if (this.padding) {
|
|
156
|
-
contentStyle.padding = this.padding;
|
|
157
|
-
}
|
|
158
|
-
if (this.background) {
|
|
159
|
-
contentStyle.background = this.background;
|
|
160
|
-
}
|
|
161
|
-
if (this.borderRadius) {
|
|
162
|
-
contentStyle.borderRadius = this.borderRadius;
|
|
163
|
-
}
|
|
164
|
-
if (this.border) {
|
|
165
|
-
contentStyle.border = this.border;
|
|
166
|
-
}
|
|
167
|
-
if (this.displayFlex) {
|
|
168
|
-
contentStyle.display = 'flex';
|
|
169
|
-
contentStyle.flexDirection = this.innerDirection === 'vertical' ? 'column' : 'row';
|
|
170
|
-
contentStyle.alignItems = this.getContentAlign();
|
|
171
|
-
contentStyle.justifyContent = this.getContentJustify();
|
|
172
|
-
if (this.innerGap) {
|
|
173
|
-
contentStyle.gap = this.innerGap;
|
|
174
|
-
}
|
|
175
|
-
}
|
|
176
|
-
const hostClass = classnames({
|
|
177
|
-
'has-grow': this.grow > 0,
|
|
178
|
-
'display-flex': this.displayFlex,
|
|
179
|
-
[`inner-${this.innerDirection}`]: this.displayFlex,
|
|
180
|
-
});
|
|
181
|
-
return (h(Host, { key: '8d71daaa3a1f34cf1b5fa3afe4f788d974d14dde', style: hostStyle, class: hostClass }, h(Host, { class: "" }, h("div", { key: '425be85bce62b600a383e164a847a2f0622496bd', class: "box", part: "box" }, h("div", { key: '104275e435d64a76428b5934aa0ece7ae3284cd8', class: "content", part: "content", style: contentStyle }, h("slot", { key: '47efcfcc9b9efe5283fa8f558026b3b13ea5b959' }))))));
|
|
182
|
-
}
|
|
183
|
-
static get style() { return leBoxDefaultCss; }
|
|
184
|
-
}, [769, "le-box", {
|
|
185
|
-
"grow": [2],
|
|
186
|
-
"shrink": [2],
|
|
187
|
-
"basis": [1],
|
|
188
|
-
"width": [1],
|
|
189
|
-
"height": [1],
|
|
190
|
-
"minWidth": [1, "min-width"],
|
|
191
|
-
"maxWidth": [1, "max-width"],
|
|
192
|
-
"minHeight": [1, "min-height"],
|
|
193
|
-
"maxHeight": [1, "max-height"],
|
|
194
|
-
"background": [1],
|
|
195
|
-
"borderRadius": [1, "border-radius"],
|
|
196
|
-
"border": [1],
|
|
197
|
-
"alignSelf": [1, "align-self"],
|
|
198
|
-
"alignContent": [1, "align-content"],
|
|
199
|
-
"justifyContent": [1, "justify-content"],
|
|
200
|
-
"padding": [1],
|
|
201
|
-
"order": [2],
|
|
202
|
-
"displayFlex": [4, "display-flex"],
|
|
203
|
-
"innerDirection": [1, "inner-direction"],
|
|
204
|
-
"innerGap": [1, "inner-gap"]
|
|
205
|
-
}]);
|
|
206
|
-
function defineCustomElement$1() {
|
|
207
|
-
if (typeof customElements === "undefined") {
|
|
208
|
-
return;
|
|
209
|
-
}
|
|
210
|
-
const components = ["le-box", "le-button", "le-checkbox", "le-popover", "le-string-input"];
|
|
211
|
-
components.forEach(tagName => { switch (tagName) {
|
|
212
|
-
case "le-box":
|
|
213
|
-
if (!customElements.get(tagName)) {
|
|
214
|
-
customElements.define(tagName, LeBox$1);
|
|
215
|
-
}
|
|
216
|
-
break;
|
|
217
|
-
case "le-button":
|
|
218
|
-
if (!customElements.get(tagName)) {
|
|
219
|
-
defineCustomElement$7();
|
|
220
|
-
}
|
|
221
|
-
break;
|
|
222
|
-
case "le-checkbox":
|
|
223
|
-
if (!customElements.get(tagName)) {
|
|
224
|
-
defineCustomElement$6();
|
|
225
|
-
}
|
|
226
|
-
break;
|
|
227
|
-
case "le-popover":
|
|
228
|
-
if (!customElements.get(tagName)) {
|
|
229
|
-
defineCustomElement$4();
|
|
230
|
-
}
|
|
231
|
-
break;
|
|
232
|
-
case "le-string-input":
|
|
233
|
-
if (!customElements.get(tagName)) {
|
|
234
|
-
defineCustomElement$2();
|
|
235
|
-
}
|
|
236
|
-
break;
|
|
237
|
-
} });
|
|
238
|
-
}
|
|
239
|
-
|
|
240
|
-
const LeBox = LeBox$1;
|
|
241
|
-
const defineCustomElement = defineCustomElement$1;
|
|
242
|
-
|
|
243
|
-
export { LeBox, defineCustomElement };
|
|
244
|
-
//# sourceMappingURL=le-box.js.map
|
|
245
|
-
|
|
246
|
-
//# sourceMappingURL=le-box.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"le-box.js","mappings":"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","names":["LeBox","__stencil_proxyCustomElement"],"sources":["src/components/le-box/le-box.default.css?tag=le-box&encapsulation=shadow","src/components/le-box/le-box.tsx"],"sourcesContent":["/**\n * le-box default styles\n *\n * Flex item properties are applied inline via hostStyle.\n * This CSS handles visual styling and theming.\n */\n\n:host {\n display: block;\n box-sizing: border-box;\n}\n\n:host([hidden]) {\n display: none;\n}\n\n/* Box container - full size by default */\n.box {\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n}\n\n/* Content wrapper */\n.content {\n width: 100%;\n height: 100%;\n box-sizing: border-box;\n background: var(--le-box-bg, transparent);\n border-radius: var(--le-box-border-radius, 0);\n padding: var(--le-box-padding, 0);\n}\n\n/* When displayFlex is enabled, ensure content stretches */\n:host(.display-flex) .content {\n min-height: 100%;\n}\n","import { Component, Prop, h, Element, Host } from '@stencil/core';\nimport { classnames } from '../../utils/utils';\n\n/**\n * A flexible box component for use as a flex item within le-stack.\n *\n * `le-box` wraps content and provides flex item properties like grow, shrink,\n * basis, and self-alignment. It can also control its internal content alignment.\n *\n * @slot - Default slot for box content\n *\n * @cssprop --le-box-bg - Background color\n * @cssprop --le-box-padding - Padding inside the box\n * @cssprop --le-box-border-radius - Border radius\n *\n * @csspart box - The main box container\n * @csspart content - The inner content wrapper\n *\n * @cmsEditable true\n * @cmsCategory Layout\n */\n@Component({\n tag: 'le-box',\n styleUrl: 'le-box.default.css',\n shadow: true,\n})\nexport class LeBox {\n @Element() el: HTMLElement;\n\n /**\n * Flex grow factor - how much the item should grow relative to siblings\n * @min 0\n */\n @Prop() grow: number = 0;\n\n /**\n * Flex shrink factor - how much the item should shrink relative to siblings\n * @min 0\n */\n @Prop() shrink: number = 1;\n\n /**\n * Flex basis - initial size before growing/shrinking (e.g., '200px', '25%', 'auto')\n */\n @Prop() basis: string = 'auto';\n\n /**\n * Width of the box (CSS value like '100px', '50%', 'auto')\n */\n @Prop() width?: string;\n\n /**\n * Height of the box (CSS value)\n */\n @Prop() height?: string;\n\n /**\n * Minimum width constraint\n */\n @Prop() minWidth?: string;\n\n /**\n * Maximum width constraint\n */\n @Prop() maxWidth?: string;\n\n /**\n * Minimum height constraint\n */\n @Prop() minHeight?: string;\n\n /**\n * Maximum height constraint\n */\n @Prop() maxHeight?: string;\n\n /**\n * Background color or CSS value (e.g., '#f0f0f0', 'var(--le-color-primary-light)')\n */\n @Prop() background?: string;\n\n /**\n * Border radius (e.g., '8px', 'var(--le-radius-md)')\n */\n @Prop() borderRadius?: string;\n\n /**\n * Border style (e.g., '1px solid #ccc', '2px dashed var(--le-color-border)')\n */\n @Prop() border?: string;\n\n /**\n * Self-alignment override for this item on the cross axis\n * @allowedValues auto | start | center | end | stretch | baseline\n */\n @Prop() alignSelf: 'auto' | 'start' | 'center' | 'end' | 'stretch' | 'baseline' = 'auto';\n\n /**\n * Internal horizontal alignment of content\n * @allowedValues start | center | end | stretch\n */\n @Prop() alignContent: 'start' | 'center' | 'end' | 'stretch' = 'stretch';\n\n /**\n * Internal vertical alignment of content\n * @allowedValues start | center | end | stretch\n */\n @Prop() justifyContent: 'start' | 'center' | 'end' | 'stretch' = 'start';\n\n /**\n * Padding inside the box (CSS value like '8px', '1rem')\n */\n @Prop() padding?: string;\n\n /**\n * Order in the flex container (lower values come first)\n */\n @Prop() order?: number;\n\n /**\n * Whether to display box content as flex (for internal alignment)\n */\n @Prop() displayFlex: boolean = false;\n\n /**\n * Direction of internal flex layout when displayFlex is true\n * @allowedValues horizontal | vertical\n */\n @Prop() innerDirection: 'horizontal' | 'vertical' = 'vertical';\n\n /**\n * Gap between internal flex items when displayFlex is true\n */\n @Prop() innerGap?: string;\n\n private getAlignSelf(): string {\n const alignMap: Record<string, string> = {\n auto: 'auto',\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n baseline: 'baseline',\n };\n return alignMap[this.alignSelf] || 'auto';\n }\n\n private getContentAlign(): string {\n const alignMap: Record<string, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n };\n return alignMap[this.alignContent] || 'stretch';\n }\n\n private getContentJustify(): string {\n const justifyMap: Record<string, string> = {\n start: 'flex-start',\n center: 'center',\n end: 'flex-end',\n stretch: 'stretch',\n };\n return justifyMap[this.justifyContent] || 'flex-start';\n }\n\n render() {\n // Host styles for flex item behavior\n const hostStyle: { [key: string]: string } = {\n flexGrow: String(this.grow),\n flexShrink: String(this.shrink),\n flexBasis: this.basis,\n alignSelf: this.getAlignSelf(),\n };\n\n if (this.width) hostStyle.width = this.width;\n if (this.height) hostStyle.height = this.height;\n if (this.minWidth) hostStyle.minWidth = this.minWidth;\n if (this.maxWidth) hostStyle.maxWidth = this.maxWidth;\n if (this.minHeight) hostStyle.minHeight = this.minHeight;\n if (this.maxHeight) hostStyle.maxHeight = this.maxHeight;\n if (this.order !== undefined) hostStyle.order = String(this.order);\n\n // Inner content styles\n const contentStyle: { [key: string]: string } = {};\n\n if (this.padding) {\n contentStyle.padding = this.padding;\n }\n if (this.background) {\n contentStyle.background = this.background;\n }\n if (this.borderRadius) {\n contentStyle.borderRadius = this.borderRadius;\n }\n if (this.border) {\n contentStyle.border = this.border;\n }\n\n if (this.displayFlex) {\n contentStyle.display = 'flex';\n contentStyle.flexDirection = this.innerDirection === 'vertical' ? 'column' : 'row';\n contentStyle.alignItems = this.getContentAlign();\n contentStyle.justifyContent = this.getContentJustify();\n if (this.innerGap) {\n contentStyle.gap = this.innerGap;\n }\n }\n\n const hostClass = classnames({\n 'has-grow': this.grow > 0,\n 'display-flex': this.displayFlex,\n [`inner-${this.innerDirection}`]: this.displayFlex,\n });\n\n return (\n <Host style={hostStyle} class={hostClass}>\n <le-component component=\"le-box\">\n <div class=\"box\" part=\"box\">\n <div class=\"content\" part=\"content\" style={contentStyle}>\n <le-slot\n name=\"\"\n description=\"Content inside this flex item\"\n type=\"slot\"\n allowed-components=\"le-text,le-card,le-button,le-stack,le-box\"\n >\n <slot></slot>\n </le-slot>\n </div>\n </div>\n </le-component>\n </Host>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import type { Components, JSX } from "../types/components";
|
|
2
|
-
|
|
3
|
-
interface LeButton extends Components.LeButton, HTMLElement {}
|
|
4
|
-
export const LeButton: {
|
|
5
|
-
prototype: LeButton;
|
|
6
|
-
new (): LeButton;
|
|
7
|
-
};
|
|
8
|
-
/**
|
|
9
|
-
* Used to define this component and all nested components recursively.
|
|
10
|
-
*/
|
|
11
|
-
export const defineCustomElement: () => void;
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import { L as LeButton$1, l as defineCustomElement$1 } from './le-button2.js';
|
|
2
|
-
|
|
3
|
-
const LeButton = LeButton$1;
|
|
4
|
-
const defineCustomElement = defineCustomElement$1;
|
|
5
|
-
|
|
6
|
-
export { LeButton, defineCustomElement };
|
|
7
|
-
//# sourceMappingURL=le-button.js.map
|
|
8
|
-
|
|
9
|
-
//# sourceMappingURL=le-button.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"le-button.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}
|