reactive-bulma 2.13.0 → 2.15.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.
- package/dist/cjs/index.js +91 -1
- package/dist/cjs/index.js.map +1 -1
- package/dist/cjs/types/components/atoms/Tile/index.d.ts +4 -0
- package/dist/cjs/types/components/atoms/index.d.ts +1 -0
- package/dist/cjs/types/components/molecules/TileBox/index.d.ts +4 -0
- package/dist/cjs/types/components/molecules/index.d.ts +1 -0
- package/dist/cjs/types/components/organisms/Hero/index.d.ts +4 -0
- package/dist/cjs/types/components/organisms/TileGroup/index.d.ts +4 -0
- package/dist/cjs/types/components/organisms/index.d.ts +2 -0
- package/dist/cjs/types/interfaces/atomProps.d.ts +40 -28
- package/dist/cjs/types/interfaces/moleculeProps.d.ts +21 -20
- package/dist/cjs/types/interfaces/organismProps.d.ts +24 -6
- package/dist/cjs/types/types/domTypes.d.ts +9 -0
- package/dist/cjs/types/types/styleTypes.d.ts +17 -15
- package/dist/esm/index.js +88 -2
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/types/components/atoms/Tile/index.d.ts +4 -0
- package/dist/esm/types/components/atoms/index.d.ts +1 -0
- package/dist/esm/types/components/molecules/TileBox/index.d.ts +4 -0
- package/dist/esm/types/components/molecules/index.d.ts +1 -0
- package/dist/esm/types/components/organisms/Hero/index.d.ts +4 -0
- package/dist/esm/types/components/organisms/TileGroup/index.d.ts +4 -0
- package/dist/esm/types/components/organisms/index.d.ts +2 -0
- package/dist/esm/types/interfaces/atomProps.d.ts +40 -28
- package/dist/esm/types/interfaces/moleculeProps.d.ts +21 -20
- package/dist/esm/types/interfaces/organismProps.d.ts +24 -6
- package/dist/esm/types/types/domTypes.d.ts +9 -0
- package/dist/esm/types/types/styleTypes.d.ts +17 -15
- package/dist/index.d.ts +106 -63
- package/package.json +1 -1
- package/dist/cjs/types/types/componentEnums.d.ts +0 -5
- package/dist/esm/types/types/componentEnums.d.ts +0 -5
package/dist/cjs/index.js
CHANGED
@@ -3245,7 +3245,7 @@ const MenuItem = ({ testId = null, cssClasses = null, style = null, text, isActi
|
|
3245
3245
|
return (React.createElement("a", { "data-testid": menuItemTestId, className: menuItemClasses, style: style !== null && style !== void 0 ? style : undefined, "aria-hidden": 'true', onClick: onClick !== null && onClick !== void 0 ? onClick : undefined }, text));
|
3246
3246
|
};
|
3247
3247
|
|
3248
|
-
const Image = ({ testId = null, containerTestId = null, cssClasses = null, containerCssClasses = null, style = null, containerStyle = null, src, alt = null, fixedSize =
|
3248
|
+
const Image = ({ testId = null, containerTestId = null, cssClasses = null, containerCssClasses = null, style = null, containerStyle = null, src, alt = null, fixedSize = null, isRounded = false }) => {
|
3249
3249
|
const imageContainerClasses = parseClasses([
|
3250
3250
|
'image',
|
3251
3251
|
fixedSize,
|
@@ -3293,6 +3293,32 @@ const LevelHeader = ({ testId = null, cssClasses = null, style = null, header, v
|
|
3293
3293
|
React.createElement("p", { className: 'title' }, value)));
|
3294
3294
|
};
|
3295
3295
|
|
3296
|
+
const Tile = ({ testId = null, cssClasses = null, style = null, children, context = null, size = null, color = null, isVertical = false }) => {
|
3297
|
+
const tileClasses = parseClasses([
|
3298
|
+
'tile',
|
3299
|
+
context,
|
3300
|
+
size,
|
3301
|
+
color ? `notification ${color}` : null,
|
3302
|
+
isVertical ? 'is-vertical' : null,
|
3303
|
+
cssClasses
|
3304
|
+
]);
|
3305
|
+
const tileTestId = testId !== null && testId !== void 0 ? testId : parseTestId({
|
3306
|
+
tag: 'tile',
|
3307
|
+
parsedClasses: tileClasses,
|
3308
|
+
rules: [
|
3309
|
+
{
|
3310
|
+
regExp: /notification |tile/gm,
|
3311
|
+
replacer: ''
|
3312
|
+
},
|
3313
|
+
{
|
3314
|
+
regExp: /is-/gm,
|
3315
|
+
replacer: '-'
|
3316
|
+
}
|
3317
|
+
]
|
3318
|
+
});
|
3319
|
+
return (React.createElement("section", { "data-testid": tileTestId, className: tileClasses, style: style !== null && style !== void 0 ? style : undefined }, children));
|
3320
|
+
};
|
3321
|
+
|
3296
3322
|
const generateKey = (max = 5000, min = 1) => {
|
3297
3323
|
max = Math.floor(max);
|
3298
3324
|
min = Math.ceil(min);
|
@@ -3641,6 +3667,32 @@ const LevelItem = ({ testId = null, cssClasses = null, style = null, content, is
|
|
3641
3667
|
return (React.createElement("section", { "data-testid": levelItemTestId, className: levelItemClasses, style: style !== null && style !== void 0 ? style : undefined }, content));
|
3642
3668
|
};
|
3643
3669
|
|
3670
|
+
const TileBox = ({ testId = null, cssClasses = 'box', style = null, children = null, context = 'is-child', size, color, isVertical }) => {
|
3671
|
+
const tileBoxClasses = parseClasses([
|
3672
|
+
'tileBox',
|
3673
|
+
context,
|
3674
|
+
size,
|
3675
|
+
color ? `notification ${color}` : null,
|
3676
|
+
isVertical ? 'is-vertical' : null,
|
3677
|
+
cssClasses
|
3678
|
+
]);
|
3679
|
+
const tileBoxTestId = testId !== null && testId !== void 0 ? testId : parseTestId({
|
3680
|
+
tag: 'tileBox',
|
3681
|
+
parsedClasses: tileBoxClasses,
|
3682
|
+
rules: [
|
3683
|
+
{
|
3684
|
+
regExp: /notification |tileBox/gm,
|
3685
|
+
replacer: ''
|
3686
|
+
},
|
3687
|
+
{
|
3688
|
+
regExp: /is-/gm,
|
3689
|
+
replacer: '-'
|
3690
|
+
}
|
3691
|
+
]
|
3692
|
+
});
|
3693
|
+
return (React.createElement(Tile, { testId: tileBoxTestId, cssClasses: cssClasses, style: style !== null && style !== void 0 ? style : undefined, isVertical: isVertical, context: context, size: size, color: color }, children !== null && children !== void 0 ? children : undefined));
|
3694
|
+
};
|
3695
|
+
|
3644
3696
|
const renderFieldLabel = (labelText) => labelText ? (React.createElement("label", { "data-testid": 'test-form-field-label', className: 'label' }, labelText)) : null;
|
3645
3697
|
const renderFieldBody = (inputControlConfig, isGrouped) => {
|
3646
3698
|
if (isGrouped) {
|
@@ -3708,6 +3760,40 @@ const Level = ({ testId = null, cssClasses = null, style = null, leftSide = null
|
|
3708
3760
|
rightSide ? (React.createElement("section", { className: 'level-right' }, renderLevelSection(rightSide))) : null));
|
3709
3761
|
};
|
3710
3762
|
|
3763
|
+
const Hero = ({ testId = null, cssClasses = null, style = null, header = null, body, footer = null, color = null, size = null }) => {
|
3764
|
+
const heroClasses = parseClasses(['hero', color, size, cssClasses]);
|
3765
|
+
const heroTestId = testId !== null && testId !== void 0 ? testId : parseTestId({ tag: 'hero', parsedClasses: heroClasses });
|
3766
|
+
return (React.createElement("section", { "data-testid": heroTestId, className: heroClasses, style: style !== null && style !== void 0 ? style : undefined },
|
3767
|
+
size === 'is-fullheight' ? (React.createElement("section", { "data-testid": `${heroTestId}-head`, className: 'hero-head' }, header)) : null,
|
3768
|
+
React.createElement("section", { "data-testid": `${heroTestId}-body`, className: 'hero-body' }, body),
|
3769
|
+
size === 'is-fullheight' ? (React.createElement("section", { "data-testid": `${heroTestId}-foot`, className: 'hero-foot' }, footer)) : null));
|
3770
|
+
};
|
3771
|
+
|
3772
|
+
const TileGroup = ({ testId = null, cssClasses = null, style = null, context = 'is-ancestor', size = null, isVertical = false, groupConfig }) => {
|
3773
|
+
const tileGroupClasses = parseClasses([
|
3774
|
+
'tileGroup',
|
3775
|
+
context,
|
3776
|
+
size,
|
3777
|
+
isVertical ? 'is-vertical' : null,
|
3778
|
+
cssClasses
|
3779
|
+
]);
|
3780
|
+
const tileBoxTestId = testId !== null && testId !== void 0 ? testId : parseTestId({
|
3781
|
+
tag: 'tileGroup',
|
3782
|
+
parsedClasses: tileGroupClasses,
|
3783
|
+
rules: [
|
3784
|
+
{
|
3785
|
+
regExp: /tileGroup/gm,
|
3786
|
+
replacer: ''
|
3787
|
+
},
|
3788
|
+
{
|
3789
|
+
regExp: /is-/gm,
|
3790
|
+
replacer: '-'
|
3791
|
+
}
|
3792
|
+
]
|
3793
|
+
});
|
3794
|
+
return (React.createElement(Tile, { testId: tileBoxTestId, cssClasses: cssClasses !== null && cssClasses !== void 0 ? cssClasses : undefined, style: style !== null && style !== void 0 ? style : undefined, context: context, size: size !== null && size !== void 0 ? size : undefined, isVertical: isVertical }, groupConfig.map(tileConfig => (React.createElement(Tile, Object.assign({ key: `tile-item-${generateKey()}` }, tileConfig))))));
|
3795
|
+
};
|
3796
|
+
|
3711
3797
|
exports.Block = Block;
|
3712
3798
|
exports.Box = Box;
|
3713
3799
|
exports.BreadcrumbItem = BreadcrumbItem;
|
@@ -3723,6 +3809,7 @@ exports.DropdownItem = DropdownItem;
|
|
3723
3809
|
exports.DropdownTrigger = DropdownTrigger;
|
3724
3810
|
exports.File = File;
|
3725
3811
|
exports.FormField = FormField;
|
3812
|
+
exports.Hero = Hero;
|
3726
3813
|
exports.Icon = Icon;
|
3727
3814
|
exports.Image = Image;
|
3728
3815
|
exports.Input = Input;
|
@@ -3748,5 +3835,8 @@ exports.TabItem = TabItem;
|
|
3748
3835
|
exports.Tabs = Tabs;
|
3749
3836
|
exports.Tag = Tag;
|
3750
3837
|
exports.TextArea = TextArea;
|
3838
|
+
exports.Tile = Tile;
|
3839
|
+
exports.TileBox = TileBox;
|
3840
|
+
exports.TileGroup = TileGroup;
|
3751
3841
|
exports.Title = Title;
|
3752
3842
|
//# sourceMappingURL=index.js.map
|