@vaneui/ui 0.3.1-alpha.20251213103636.79707b4 → 0.3.1-alpha.20251214132905.c959e96
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/ui/badge.d.ts.map +1 -1
- package/dist/components/ui/grid.d.ts.map +1 -1
- package/dist/components/ui/typography.d.ts.map +1 -1
- package/dist/index.esm.js +28 -1
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +28 -1
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -5448,6 +5448,7 @@ const Button = react.forwardRef(function Button(props, ref) {
|
|
|
5448
5448
|
const theme = useTheme();
|
|
5449
5449
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.button, ...props });
|
|
5450
5450
|
});
|
|
5451
|
+
Button.displayName = 'Button';
|
|
5451
5452
|
|
|
5452
5453
|
/**
|
|
5453
5454
|
* A compact badge component for displaying status, labels, or counts.
|
|
@@ -5486,6 +5487,7 @@ const Badge = react.forwardRef(function Badge(props, ref) {
|
|
|
5486
5487
|
const theme = useTheme();
|
|
5487
5488
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.badge, ref: ref, ...props });
|
|
5488
5489
|
});
|
|
5490
|
+
Badge.displayName = 'Badge';
|
|
5489
5491
|
|
|
5490
5492
|
/**
|
|
5491
5493
|
* A visual separator component for dividing content sections.
|
|
@@ -5520,6 +5522,7 @@ const Divider = react.forwardRef(function Divider(props, ref) {
|
|
|
5520
5522
|
const theme = useTheme();
|
|
5521
5523
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.divider, ref: ref, ...props });
|
|
5522
5524
|
});
|
|
5525
|
+
Divider.displayName = 'Divider';
|
|
5523
5526
|
|
|
5524
5527
|
/**
|
|
5525
5528
|
* A chip component for displaying tags, filters, or selections.
|
|
@@ -5558,6 +5561,7 @@ const Chip = react.forwardRef(function Chip(props, ref) {
|
|
|
5558
5561
|
const theme = useTheme();
|
|
5559
5562
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.chip, ref: ref, ...props });
|
|
5560
5563
|
});
|
|
5564
|
+
Chip.displayName = 'Chip';
|
|
5561
5565
|
|
|
5562
5566
|
/**
|
|
5563
5567
|
* An inline code component for displaying code snippets or technical terms.
|
|
@@ -5596,6 +5600,7 @@ const Code = react.forwardRef(function Code(props, ref) {
|
|
|
5596
5600
|
const theme = useTheme();
|
|
5597
5601
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.code, ref: ref, ...props });
|
|
5598
5602
|
});
|
|
5603
|
+
Code.displayName = 'Code';
|
|
5599
5604
|
|
|
5600
5605
|
/**
|
|
5601
5606
|
* A styled checkbox component for forms and selections.
|
|
@@ -5639,7 +5644,7 @@ const Checkbox = react.forwardRef(function Checkbox(props, ref) {
|
|
|
5639
5644
|
const {
|
|
5640
5645
|
// Size props
|
|
5641
5646
|
xs, sm, md, lg, xl,
|
|
5642
|
-
// Appearance props
|
|
5647
|
+
// Appearance props
|
|
5643
5648
|
default: defaultProp, accent, primary, secondary, tertiary, success, danger, warning, info, transparent,
|
|
5644
5649
|
// Variant props
|
|
5645
5650
|
filled, outline,
|
|
@@ -5665,6 +5670,7 @@ const Checkbox = react.forwardRef(function Checkbox(props, ref) {
|
|
|
5665
5670
|
};
|
|
5666
5671
|
return (jsxRuntime.jsxs(ThemedComponent, { theme: theme.checkbox.wrapper, ref: ref, ...themeProps, children: [jsxRuntime.jsx(ThemedComponent, { theme: theme.checkbox.input, ...inputProps }), jsxRuntime.jsx(ThemedComponent, { theme: theme.checkbox.check, ...themeProps, children: theme.checkbox.check.themes.checkElement() })] }));
|
|
5667
5672
|
});
|
|
5673
|
+
Checkbox.displayName = 'Checkbox';
|
|
5668
5674
|
|
|
5669
5675
|
/**
|
|
5670
5676
|
* A label component for form fields and inputs.
|
|
@@ -5709,6 +5715,7 @@ const Label = react.forwardRef(function Label(props, ref) {
|
|
|
5709
5715
|
const theme = useTheme();
|
|
5710
5716
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.label, ref: ref, ...props });
|
|
5711
5717
|
});
|
|
5718
|
+
Label.displayName = 'Label';
|
|
5712
5719
|
|
|
5713
5720
|
/**
|
|
5714
5721
|
* An image component with styling and layout support.
|
|
@@ -5747,6 +5754,7 @@ const Img = react.forwardRef(function Img(props, ref) {
|
|
|
5747
5754
|
const theme = useTheme();
|
|
5748
5755
|
return (jsxRuntime.jsx(ThemedComponent, { theme: theme.img, ref: ref, ...props }));
|
|
5749
5756
|
});
|
|
5757
|
+
Img.displayName = 'Img';
|
|
5750
5758
|
|
|
5751
5759
|
/**
|
|
5752
5760
|
* A text input field component for forms and user data entry.
|
|
@@ -5785,6 +5793,7 @@ const Input = react.forwardRef(function Input(props, ref) {
|
|
|
5785
5793
|
const theme = useTheme();
|
|
5786
5794
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.input, ...props });
|
|
5787
5795
|
});
|
|
5796
|
+
Input.displayName = 'Input';
|
|
5788
5797
|
|
|
5789
5798
|
/**
|
|
5790
5799
|
* A semantic section container for grouping related content.
|
|
@@ -5826,6 +5835,7 @@ const Section = react.forwardRef(function Section(props, ref) {
|
|
|
5826
5835
|
const theme = useTheme();
|
|
5827
5836
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.section, ref: ref, ...props });
|
|
5828
5837
|
});
|
|
5838
|
+
Section.displayName = 'Section';
|
|
5829
5839
|
|
|
5830
5840
|
/**
|
|
5831
5841
|
* A page-level content wrapper with maximum width constraints.
|
|
@@ -5866,6 +5876,7 @@ const Container = react.forwardRef(function Container(props, ref) {
|
|
|
5866
5876
|
const theme = useTheme();
|
|
5867
5877
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.container, ref: ref, ...props });
|
|
5868
5878
|
});
|
|
5879
|
+
Container.displayName = 'Container';
|
|
5869
5880
|
|
|
5870
5881
|
/**
|
|
5871
5882
|
* A column flex container for vertical content organization.
|
|
@@ -5909,6 +5920,7 @@ const Col = react.forwardRef(function Col(props, ref) {
|
|
|
5909
5920
|
const theme = useTheme();
|
|
5910
5921
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.col, ref: ref, ...props });
|
|
5911
5922
|
});
|
|
5923
|
+
Col.displayName = 'Col';
|
|
5912
5924
|
|
|
5913
5925
|
/**
|
|
5914
5926
|
* A horizontal flex container for arranging elements side-by-side.
|
|
@@ -5951,6 +5963,7 @@ const Row = react.forwardRef(function Row(props, ref) {
|
|
|
5951
5963
|
const theme = useTheme();
|
|
5952
5964
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.row, ref: ref, ...props });
|
|
5953
5965
|
});
|
|
5966
|
+
Row.displayName = 'Row';
|
|
5954
5967
|
|
|
5955
5968
|
/**
|
|
5956
5969
|
* A 2-column CSS grid container.
|
|
@@ -5984,6 +5997,7 @@ const Grid2 = react.forwardRef(function Grid2(props, ref) {
|
|
|
5984
5997
|
const theme = useTheme();
|
|
5985
5998
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.grid2, ref: ref, ...props });
|
|
5986
5999
|
});
|
|
6000
|
+
Grid2.displayName = 'Grid2';
|
|
5987
6001
|
/**
|
|
5988
6002
|
* A 3-column CSS grid container.
|
|
5989
6003
|
*
|
|
@@ -6006,6 +6020,7 @@ const Grid3 = react.forwardRef(function Grid3(props, ref) {
|
|
|
6006
6020
|
const theme = useTheme();
|
|
6007
6021
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.grid3, ref: ref, ...props });
|
|
6008
6022
|
});
|
|
6023
|
+
Grid3.displayName = 'Grid3';
|
|
6009
6024
|
/**
|
|
6010
6025
|
* A 4-column CSS grid container.
|
|
6011
6026
|
*
|
|
@@ -6029,6 +6044,7 @@ const Grid4 = react.forwardRef(function Grid4(props, ref) {
|
|
|
6029
6044
|
const theme = useTheme();
|
|
6030
6045
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.grid4, ref: ref, ...props });
|
|
6031
6046
|
});
|
|
6047
|
+
Grid4.displayName = 'Grid4';
|
|
6032
6048
|
/**
|
|
6033
6049
|
* A 5-column CSS grid container.
|
|
6034
6050
|
*
|
|
@@ -6053,6 +6069,7 @@ const Grid5 = react.forwardRef(function Grid5(props, ref) {
|
|
|
6053
6069
|
const theme = useTheme();
|
|
6054
6070
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.grid5, ref: ref, ...props });
|
|
6055
6071
|
});
|
|
6072
|
+
Grid5.displayName = 'Grid5';
|
|
6056
6073
|
/**
|
|
6057
6074
|
* A 6-column CSS grid container.
|
|
6058
6075
|
*
|
|
@@ -6078,6 +6095,7 @@ const Grid6 = react.forwardRef(function Grid6(props, ref) {
|
|
|
6078
6095
|
const theme = useTheme();
|
|
6079
6096
|
return jsxRuntime.jsx(ThemedComponent, { theme: theme.grid6, ref: ref, ...props });
|
|
6080
6097
|
});
|
|
6098
|
+
Grid6.displayName = 'Grid6';
|
|
6081
6099
|
|
|
6082
6100
|
/**
|
|
6083
6101
|
* A container component for grouping related content with padding and borders.
|
|
@@ -6123,6 +6141,7 @@ const Card = react.forwardRef(function Card(props, ref) {
|
|
|
6123
6141
|
const theme = useTheme();
|
|
6124
6142
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.card, ...props });
|
|
6125
6143
|
});
|
|
6144
|
+
Card.displayName = 'Card';
|
|
6126
6145
|
|
|
6127
6146
|
/**
|
|
6128
6147
|
* A vertical flex container for stacking elements.
|
|
@@ -6166,6 +6185,7 @@ const Stack = react.forwardRef(function Stack(props, ref) {
|
|
|
6166
6185
|
const stackTheme = theme.stack;
|
|
6167
6186
|
return jsxRuntime.jsx(ThemedComponent, { theme: stackTheme, ref: ref, ...props });
|
|
6168
6187
|
});
|
|
6188
|
+
Stack.displayName = 'Stack';
|
|
6169
6189
|
|
|
6170
6190
|
/**
|
|
6171
6191
|
* A top-level page heading component (h1).
|
|
@@ -6198,6 +6218,7 @@ const PageTitle = react.forwardRef(function PageTitle(props, ref) {
|
|
|
6198
6218
|
const theme = useTheme();
|
|
6199
6219
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.pageTitle, ...props });
|
|
6200
6220
|
});
|
|
6221
|
+
PageTitle.displayName = 'PageTitle';
|
|
6201
6222
|
/**
|
|
6202
6223
|
* A section heading component (h2).
|
|
6203
6224
|
*
|
|
@@ -6229,6 +6250,7 @@ const SectionTitle = react.forwardRef(function SectionTitle(props, ref) {
|
|
|
6229
6250
|
const theme = useTheme();
|
|
6230
6251
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.sectionTitle, ...props });
|
|
6231
6252
|
});
|
|
6253
|
+
SectionTitle.displayName = 'SectionTitle';
|
|
6232
6254
|
/**
|
|
6233
6255
|
* A subsection heading component (h3).
|
|
6234
6256
|
*
|
|
@@ -6259,6 +6281,7 @@ const Title = react.forwardRef(function Title(props, ref) {
|
|
|
6259
6281
|
const theme = useTheme();
|
|
6260
6282
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.title, ...props });
|
|
6261
6283
|
});
|
|
6284
|
+
Title.displayName = 'Title';
|
|
6262
6285
|
/**
|
|
6263
6286
|
* A body text component (p).
|
|
6264
6287
|
*
|
|
@@ -6296,6 +6319,7 @@ const Text = react.forwardRef(function Text(props, ref) {
|
|
|
6296
6319
|
const theme = useTheme();
|
|
6297
6320
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.text, ...props });
|
|
6298
6321
|
});
|
|
6322
|
+
Text.displayName = 'Text';
|
|
6299
6323
|
/**
|
|
6300
6324
|
* An anchor link component (a).
|
|
6301
6325
|
*
|
|
@@ -6329,6 +6353,7 @@ const Link = react.forwardRef(function Link(props, ref) {
|
|
|
6329
6353
|
const theme = useTheme();
|
|
6330
6354
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.link, ...props });
|
|
6331
6355
|
});
|
|
6356
|
+
Link.displayName = 'Link';
|
|
6332
6357
|
/**
|
|
6333
6358
|
* A list item component (li).
|
|
6334
6359
|
*
|
|
@@ -6363,6 +6388,7 @@ const ListItem = react.forwardRef(function ListItem(props, ref) {
|
|
|
6363
6388
|
const theme = useTheme();
|
|
6364
6389
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.listItem, ...props });
|
|
6365
6390
|
});
|
|
6391
|
+
ListItem.displayName = 'ListItem';
|
|
6366
6392
|
/**
|
|
6367
6393
|
* A list container component (ul or ol).
|
|
6368
6394
|
*
|
|
@@ -6403,6 +6429,7 @@ const List = react.forwardRef(function List(props, ref) {
|
|
|
6403
6429
|
const theme = useTheme();
|
|
6404
6430
|
return jsxRuntime.jsx(ThemedComponent, { ref: ref, theme: theme.list, ...props });
|
|
6405
6431
|
});
|
|
6432
|
+
List.displayName = 'List';
|
|
6406
6433
|
|
|
6407
6434
|
exports.ACTIVE = ACTIVE;
|
|
6408
6435
|
exports.APPEARANCE_CATEGORY = APPEARANCE_CATEGORY;
|