@beydesign/storybook 0.0.3 → 0.0.4

package/dist/stories/types/avatar.d.ts

@@ -0,0 +1,44 @@
+import type { SxProps, Theme } from '@mui/material';
+/**
+ * Avatar size variants
+ */
+export declare enum AvatarSize {
+    xxl = "xxl",
+    xl = "xl",
+    lg = "lg",
+    md = "md",
+    sm = "sm",
+    xs = "xs"
+}
+/**
+ * Avatar style variants
+ */
+export declare enum AvatarStyle {
+    Placeholder = "Placeholder",
+    Picture = "Picture",
+    Letters = "Letters"
+}
+export declare const AvatarImage = "https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTTAUPUG0r--EDZzf-f9Afj_Jp7N96yIGsWPgCYIkrAS1rCJHIcdm_RCq_me44bJc0dvvY&usqp=CAU";
+export declare const getInitials: (text: string) => string;
+/**
+ * Avatar component props
+ */
+export type AvatarProps = {
+    /** Style variant of the avatar */
+    avatarStyle: AvatarStyle;
+    /** Text content of the avatar if avatarStyle is Letters */
+    text?: string;
+    /** Image source of the avatar if avatarStyle is Picture  */
+    image?: string;
+    /** Custom style of the avatar */
+    style?: SxProps<Theme>;
+    /** Size variant of the avatar */
+    size?: AvatarSize;
+    /** Visual hierarchy of the avatar */
+    border?: boolean;
+};
+/**
+ * Props for the Components wrapper
+ */
+export interface ComponentsProps {
+}

package/dist/stories/types/avatar.js

@@ -0,0 +1,28 @@
+/**
+ * Avatar size variants
+ */
+export var AvatarSize;
+(function (AvatarSize) {
+    AvatarSize["xxl"] = "xxl";
+    AvatarSize["xl"] = "xl";
+    AvatarSize["lg"] = "lg";
+    AvatarSize["md"] = "md";
+    AvatarSize["sm"] = "sm";
+    AvatarSize["xs"] = "xs";
+})(AvatarSize || (AvatarSize = {}));
+/**
+ * Avatar style variants
+ */
+export var AvatarStyle;
+(function (AvatarStyle) {
+    AvatarStyle["Placeholder"] = "Placeholder";
+    AvatarStyle["Picture"] = "Picture";
+    AvatarStyle["Letters"] = "Letters";
+})(AvatarStyle || (AvatarStyle = {}));
+export const AvatarImage = `https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTTAUPUG0r--EDZzf-f9Afj_Jp7N96yIGsWPgCYIkrAS1rCJHIcdm_RCq_me44bJc0dvvY&usqp=CAU`;
+export const getInitials = (text) => {
+    return text
+        .split(' ')
+        .map((word) => word[0]?.toUpperCase())
+        .join('');
+};

package/dist/stories/types/badge.d.ts

@@ -0,0 +1,47 @@
+import type { SxProps, Theme } from '@mui/material';
+import * as PhosphorIcons from '@phosphor-icons/react';
+/**
+ * Badge size variants
+ */
+export declare enum BadgeSize {
+    lg = "lg",
+    md = "md",
+    xs = "xs"
+}
+/**
+ * Badge color variants
+ */
+export declare enum BadgeColor {
+    Default = "Default",
+    Violet = "Violet",
+    Lemon = "Lemon",
+    Green = "Green",
+    Red = "Red",
+    Yellow = "Yellow",
+    Blue = "Blue",
+    Cyan = "Cyan",
+    Pink = "Pink",
+    DarkTransparent = "DarkTransparent"
+}
+/**
+ * Badge component props
+ */
+export type BadgeProps = {
+    /** Size variant of the badge */
+    size?: BadgeSize;
+    /** Color variant of the badge */
+    color?: BadgeColor;
+    /** Text content of the badge */
+    text: string;
+    /** Custom style of the badge */
+    style?: SxProps<Theme>;
+    /** Icon to display in the badge */
+    icon?: keyof typeof PhosphorIcons;
+    /** Whether to fill the icon */
+    fill?: boolean;
+};
+/**
+ * Props for the Components wrapper
+ */
+export interface ComponentsProps {
+}

package/dist/stories/types/badge.js

@@ -0,0 +1,25 @@
+/**
+ * Badge size variants
+ */
+export var BadgeSize;
+(function (BadgeSize) {
+    BadgeSize["lg"] = "lg";
+    BadgeSize["md"] = "md";
+    BadgeSize["xs"] = "xs";
+})(BadgeSize || (BadgeSize = {}));
+/**
+ * Badge color variants
+ */
+export var BadgeColor;
+(function (BadgeColor) {
+    BadgeColor["Default"] = "Default";
+    BadgeColor["Violet"] = "Violet";
+    BadgeColor["Lemon"] = "Lemon";
+    BadgeColor["Green"] = "Green";
+    BadgeColor["Red"] = "Red";
+    BadgeColor["Yellow"] = "Yellow";
+    BadgeColor["Blue"] = "Blue";
+    BadgeColor["Cyan"] = "Cyan";
+    BadgeColor["Pink"] = "Pink";
+    BadgeColor["DarkTransparent"] = "DarkTransparent";
+})(BadgeColor || (BadgeColor = {}));

package/dist/stories/types/checkbox.d.ts

@@ -0,0 +1,26 @@
+export declare enum CheckboxType {
+    Radio = "Radio",
+    Checkbox = "Checkbox"
+}
+/**
+ * Checkbox component props
+ */
+export type CheckboxProps = {
+    /** Type variant of the checkbox */
+    type?: CheckboxType;
+    /** Label of the checkbox */
+    label: string;
+    /** Whether the checkbox is checked */
+    checked?: boolean;
+    /** Whether the checkbox is disabled */
+    disabled?: boolean;
+    /** Whether the checkbox is read-only */
+    required?: boolean;
+    /** Event handler for the checkbox */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+};
+/**
+ * Props for the Components wrapper
+ */
+export interface ComponentsProps {
+}

package/dist/stories/types/checkbox.js

@@ -0,0 +1,5 @@
+export var CheckboxType;
+(function (CheckboxType) {
+    CheckboxType["Radio"] = "Radio";
+    CheckboxType["Checkbox"] = "Checkbox";
+})(CheckboxType || (CheckboxType = {}));

package/dist/stories/types/typography.d.ts

@@ -0,0 +1,43 @@
+/**
+ * Typography size variants
+ */
+export declare enum TypographySize {
+    HeadingXL = "HeadingXL",
+    HeadingL = "HeadingL",
+    HeadingM = "HeadingM",
+    HeadingS = "HeadingS",
+    HeadingXS = "HeadingXS",
+    Heading2XS = "Heading2XS",
+    TextL = "TextL",
+    TextM = "TextM",
+    TextS = "TextS",
+    TextXS = "TextXS",
+    Text2XS = "Text2XS"
+}
+/**
+ * Typography weight variants
+ */
+export declare enum TypographyWeight {
+    Bold = "Bold",
+    SemiBold = "SemiBold",
+    Medium = "Medium",
+    Regular = "Regular"
+}
+/**
+ * Typography component props
+ */
+export interface TypographyProps {
+    /** Text content of the typography */
+    text: string;
+    /** Size variant of the typography */
+    size?: TypographySize;
+    /** Weight variant of the typography */
+    weight?: TypographyWeight;
+    /** Color variant of the typography */
+    color?: string;
+}
+/**
+ * Props for the Components wrapper
+ */
+export interface ComponentsProps {
+}

package/dist/stories/types/typography.js

@@ -0,0 +1,27 @@
+/**
+ * Typography size variants
+ */
+export var TypographySize;
+(function (TypographySize) {
+    TypographySize["HeadingXL"] = "HeadingXL";
+    TypographySize["HeadingL"] = "HeadingL";
+    TypographySize["HeadingM"] = "HeadingM";
+    TypographySize["HeadingS"] = "HeadingS";
+    TypographySize["HeadingXS"] = "HeadingXS";
+    TypographySize["Heading2XS"] = "Heading2XS";
+    TypographySize["TextL"] = "TextL";
+    TypographySize["TextM"] = "TextM";
+    TypographySize["TextS"] = "TextS";
+    TypographySize["TextXS"] = "TextXS";
+    TypographySize["Text2XS"] = "Text2XS";
+})(TypographySize || (TypographySize = {}));
+/**
+ * Typography weight variants
+ */
+export var TypographyWeight;
+(function (TypographyWeight) {
+    TypographyWeight["Bold"] = "Bold";
+    TypographyWeight["SemiBold"] = "SemiBold";
+    TypographyWeight["Medium"] = "Medium";
+    TypographyWeight["Regular"] = "Regular";
+})(TypographyWeight || (TypographyWeight = {}));

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@beydesign/storybook",
   "private": false,
-  "version": "0.0.3",
+  "version": "0.0.4",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -15,7 +15,7 @@
     "build:lib": "tsc",
     "lint": "eslint .",
     "preview": "vite preview",
-    "storybook": "storybook dev -p 6006",
+    "storybook": "npm update @beydesign/tokens && storybook dev -p 6006",
     "build-storybook": "storybook build",
     "version:patch": "npm version patch -m \"🔖 Release %s\"",
     "version:minor": "npm version minor -m \"🔖 Release %s\"",