reactive-bulma 4.1.0 → 4.1.2

package/dist/interfaces/organismProps.d.ts

@@ -0,0 +1,112 @@
+import { ClickeableProps, ElementProps } from './commonProps';
+import { InputControlProps, LevelItemProps, NavBarBrandProps, NavBarDropdownProps, PanelBlockProps, PanelTabsProps, TableRowProps } from './moleculeProps';
+import { ImageProps, NavBarItemProps, TableHeadCellProps, TileProps } from './atomProps';
+import { BasicColorType, SizeWithHeightType } from '../types/styleTypes';
+import { ChildrenType, NavBarFixedPositionType } from '../types/domTypes';
+export interface FormFieldHelperProps {
+    text?: string;
+    color?: BasicColorType;
+}
+export interface FormFieldProps extends ElementProps {
+    /** `Attribute` `Required` Single or multiple `InputControlProps` config objects which will be wrapped around the `FormField` */
+    inputControlConfig: InputControlProps | InputControlProps[];
+    /** `Attribute` Sets a custom text before the wrapped input to indicate its usage */
+    labelText?: string;
+    /** `Attribute` Adds a helper text below the wrapped paragraph to provide context information */
+    helperConfig?: FormFieldHelperProps;
+    /** `Styling` Will adjust field's sections (label, input/s and helper) in horizontal position */
+    isHorizontal?: boolean;
+    /** `Styling` Will group the list of inputs in a same wrapper (useful for several inputs with same usage, as a complex address) */
+    isGrouped?: boolean;
+}
+export interface PanelProps extends ElementProps {
+    /** `Attribute` `Required` Will display Panel's header text */
+    headerText: string;
+    /** `Attribute` A configuration object that will render a set of tabs based on `PanelTab` component */
+    panelTabs?: PanelTabsProps;
+    /** `Attribute` `Required` A list of configuration objects that will render a list of block with different components, based on `PanelBlockList` component */
+    blockList: PanelBlockProps[];
+    /** `Styling` Color based on bulma's text color tokens */
+    color?: BasicColorType;
+}
+export interface LevelProps extends ElementProps {
+    /** `Attribute` A list of `LevelItem` configurations that will br displayed in Level's left side */
+    leftSide?: LevelItemProps[];
+    /** `Attribute` A list of `LevelItem` configurations that will br displayed in Level's center */
+    centerSide?: LevelItemProps[];
+    /** `Attribute` A list of `LevelItem` configurations that will br displayed in Level's right side */
+    rightSide?: LevelItemProps[];
+    /** `Styling` Will adjust the navigator on horizontal on mobile as well */
+    isMobile?: boolean;
+}
+export interface HeroProps extends ElementProps {
+    /** `Attribute` Designated section for hero's header, it will be visible only if container's `size` is setted to `is-fullheight` */
+    header?: ChildrenType;
+    /** `Attribute` `Required` Designated section for hero's body */
+    body: ChildrenType;
+    /** `Attribute` Designated section for hero's footer, it will be visible only if container's `size` is setted to `is-fullheight` */
+    footer?: ChildrenType;
+    /** `Styling` Set hero's size */
+    size?: SizeWithHeightType;
+    /** `Styling` Color based on bulma's text color tokens */
+    color?: BasicColorType;
+}
+export interface TileGroupProps extends ElementProps, Pick<TileProps, 'context' | 'isVertical' | 'size'> {
+    /** `Attribute` `Required` A list of `Title` configurations that will be displayed in a grid mode on the screen */
+    groupConfig: TileProps[];
+}
+export interface NavBarMenuProps {
+    itemList: Array<NavBarItemProps | NavBarDropdownProps>;
+    showInMobile?: boolean;
+}
+export interface NavBarProps extends ElementProps {
+    /** `Attribute` Configuration object for navbar's left section, it needs of a `NavBarBrand` object to be displayed at NavBar's start */
+    brandConfig?: NavBarBrandProps;
+    /** `Attribute` Configuration object for navbar's left section, it needs of a list of `NavBarItem` or `NavBarDropdown` objects to be displayed */
+    itemsAtStart?: NavBarMenuProps;
+    /** `Attribute` Configuration object for navbar's right section, it needs of a list of `NavBarItem` or `NavBarDropdown` objects to be displayed */
+    itemsAtEnd?: NavBarMenuProps;
+    /** `Styling` Sets navbar's position at screen's top or bottom */
+    fixedPosition?: NavBarFixedPositionType;
+    /** `Styling` Color based on bulma's text color tokens */
+    color?: BasicColorType;
+    /** `Styling` Sets navbar's color as transparent */
+    isTransparent?: boolean;
+    /** `Styling` Adds a small padding around the navbar */
+    isSpaced?: boolean;
+    /** `Styling` Adds a small shadow on navbar's bottom */
+    hasShadow?: boolean;
+}
+export interface CardFooterProps extends ClickeableProps {
+    text: string;
+}
+export interface CardProps extends ElementProps {
+    /** `Attribute` It will shot a text on card's top, just a paragraph */
+    headerText?: string;
+    /** `Attribute` A single configuration object that will render an `Image` component */
+    image?: ImageProps;
+    /** `Attribute` `Required` Deisgnated section where you can include a string, a single or list of components (each one separated in its own `content` section) */
+    content: ChildrenType;
+    /** `Attribute` A list of footer links that will be rendered on card's bottom, below its content */
+    footerLinks?: CardFooterProps[];
+}
+export interface TableProps extends ElementProps {
+    /** `Attribute` `Required` Configuration object that will display table's head */
+    head: TableHeadCellProps[];
+    /** `Attribute` `Required` Configuration object that will display table's body */
+    body: TableRowProps[];
+    /** `Attribute` Configuration object that will display table's foot */
+    foot?: TableHeadCellProps[];
+    /** `Styling` It will add a Bordered styling to the table. It can be combined with other mentioned styling properties. */
+    isBordered?: boolean;
+    /** `Styling` It will add a Striped styling to the table. It can be combined with other mentioned styling properties. */
+    isStriped?: boolean;
+    /** `Styling` It will add a Narrow styling to the table. It can be combined with other mentioned styling properties. */
+    isNarrow?: boolean;
+    /** `Styling` It will add a Hoverable styling to the table. It can be combined with other mentioned styling properties. */
+    isHoverable?: boolean;
+    /** `Styling` It will add a Fullwidth styling to the table. It can be combined with other mentioned styling properties. */
+    isFullwidth?: boolean;
+    /** `Styling` Will create a container around the table in order to make it scrollable */
+    isContained?: boolean;
+}

package/dist/interfaces/organismProps.js

@@ -0,0 +1 @@
+

package/dist/types/domTypes.d.ts

@@ -0,0 +1,16 @@
+import { default as React } from 'react';
+export type ButtonType = 'submit' | 'reset' | 'button';
+export type InputType = 'text' | 'password' | 'email' | 'tel';
+export type DropdownItemType = 'item' | 'link' | 'divider';
+export type PanelBlockItemType = 'icon' | 'control' | 'button';
+export type ChildrenType = string | React.ReactElement | React.ReactElement[];
+export type SingleChildType = Exclude<ChildrenType, React.ReactElement[]>;
+export declare enum IconSizeEnum {
+    'is-small' = 24,
+    'is-medium' = 36,
+    'is-large' = 48
+}
+export type TileContextType = 'is-child' | 'is-parent' | 'is-ancestor';
+export type HeroContentType = 'head' | 'body' | 'foot';
+export type MediaSectionType = 'left' | 'content' | 'right';
+export type NavBarFixedPositionType = 'top' | 'bottom';

package/dist/types/domTypes.js

@@ -0,0 +1,4 @@
+var l = /* @__PURE__ */ ((s) => (s[s["is-small"] = 24] = "is-small", s[s["is-medium"] = 36] = "is-medium", s[s["is-large"] = 48] = "is-large", s))(l || {});
+export {
+  l as IconSizeEnum
+};

package/dist/types/styleTypes.d.ts

@@ -0,0 +1,19 @@
+export type CommonSizeType = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8' | 'is-9' | 'is-10' | 'is-11' | 'is-12';
+export type AbstractSizeType = 'is-three-quarters' | 'is-two-thirds' | 'is-half' | 'is-one-third' | 'is-one-quarter' | 'is-full' | 'is-four-fifths' | 'is-three-fifths' | 'is-two-fifths' | 'is-one-fifth';
+export type ColumnSizeType = CommonSizeType | AbstractSizeType;
+export type ColumnOffsetType = 'is-offset-1' | 'is-offset-2' | 'is-offset-3' | 'is-offset-4' | 'is-offset-5' | 'is-offset-6' | 'is-offset-7' | 'is-offset-8' | 'is-offset-9' | 'is-offset-10' | 'is-offset-11' | 'is-offset-12';
+export type TitleSizeType = 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6';
+export type BasicColorType = 'is-white' | 'is-light' | 'is-dark' | 'is-black' | 'is-text' | 'is-ghost' | 'is-primary' | 'is-link' | 'is-info' | 'is-success' | 'is-warning' | 'is-danger';
+export type TextColorType = 'has-text-white' | 'has-text-black' | 'has-text-light' | 'has-text-dark' | 'has-text-primary' | 'has-text-link' | 'has-text-info' | 'has-text-success' | 'has-text-warning' | 'has-text-danger';
+export type FixedImageSizeType = 'is-16x16' | 'is-24x24' | 'is-32x32' | 'is-48x48' | 'is-64x64' | 'is-96x96' | 'is-128x128' | 'is-square' | 'is-1by1' | 'is-5by4' | 'is-4by3' | 'is-3by2' | 'is-5by3' | 'is-16by9' | 'is-2by1' | 'is-3by1' | 'is-4by5' | 'is-3by4' | 'is-2by3' | 'is-3by5' | 'is-9by16' | 'is-1by2' | 'is-1by3';
+export type ElementSizeType = 'is-small' | 'is-normal' | 'is-medium' | 'is-large';
+export type SizeWithoutNormalType = Exclude<ElementSizeType, 'is-normal'>;
+export type SizeWithHeightType = SizeWithoutNormalType | 'is-halfheight' | 'is-fullheight';
+export type MediumAndLargeSizeType = Exclude<SizeWithoutNormalType, 'is-small'>;
+export type IconColorModeType = 'light' | 'dark';
+export type ColumnGapType = 'is-0' | 'is-1' | 'is-2' | 'is-3' | 'is-4' | 'is-5' | 'is-6' | 'is-7' | 'is-8';
+export type ElementAlignType = 'is-centered' | 'is-right' | 'is-left';
+export type RightCenteredAlignType = Exclude<ElementAlignType, 'is-left'>;
+export type RightLeftAlignType = Exclude<ElementAlignType, 'is-centered'>;
+export type BreadcrumbSeparatorType = 'has-arrow-separator' | 'has-bullet-separator' | 'has-dot-separator' | 'has-succeeds-separator';
+export type TabsFormatType = 'is-boxed' | 'is-toggle';

package/dist/types/styleTypes.js

@@ -0,0 +1 @@
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "reactive-bulma",
-  "version": "4.1.0",
+  "version": "4.1.2",
   "type": "module",
   "description": "A component library based on React, Bulma, Typescript and Rollup",
   "keywords": [
@@ -20,7 +20,7 @@
   "homepage": "https://reactivebulma.netlify.app",
   "repository": {
     "type": "git",
-    "url": "https://github.com/NicolasOmar/reactive-bulma.git"
+    "url": "git+https://github.com/NicolasOmar/reactive-bulma.git"
   },
   "bugs": {
     "url": "https://github.com/NicolasOmar/reactive-bulma/issues"
@@ -44,6 +44,7 @@
     "compile": "tsc -b",
     "build": "npm run compile && vite build",
     "build:storybook": "storybook build",
+    "prepare": "npm run build",
     "semantic-release": "semantic-release",
     "create": "hygen component new",
     "update": "npm run update:deps && npm run update:doctor && npm run update:storybook",
@@ -86,8 +87,8 @@
     "@types/node": "^22.9.0",
     "@types/react": "^18.3.12",
     "@types/react-dom": "^18.3.1",
-    "@typescript-eslint/eslint-plugin": "^8.14.0",
-    "@typescript-eslint/parser": "^8.14.0",
+    "@typescript-eslint/eslint-plugin": "^8.15.0",
+    "@typescript-eslint/parser": "^8.15.0",
     "@vitejs/plugin-react": "^4.3.3",
     "ajv": "^8.17.1",
     "babel-jest": "^29.7.0",
@@ -101,6 +102,7 @@
     "eslint-plugin-storybook": "^0.11.0",
     "glob": "^11.0.0",
     "globals": "^15.12.0",
+    "husky": "^9.1.7",
     "hygen": "^6.2.11",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
@@ -113,7 +115,7 @@
     "storybook": "^8.4.4",
     "tslib": "^2.8.1",
     "typescript": "~5.6.3",
-    "typescript-eslint": "^8.14.0",
+    "typescript-eslint": "^8.15.0",
     "vite": "^5.4.11",
     "vite-plugin-dts": "^4.3.0"
   },