@bcrumbs.net/bc-ui 0.0.4 → 0.0.7

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@bcrumbs.net/bc-ui",
   "description": "The UI components of Bread Crumbs portals",
-  "version": "0.0.4",
+  "version": "0.0.7",
   "keyword": [
     "bcrumbs",
     "bc-ui"

package/src/index.d.ts

@@ -34,6 +34,21 @@ export * from './lib/charts/barLineChart';
 export * from './lib/dateRangePicker';
 export * from './lib/InputWithSuggestions';
 export * from './lib/textArea';
+export * from './lib/tagDisplay/TagDisplay';
+export * from './lib/styledFormInput/StyledFormInput';
+export * from './lib/newComponents/BCNewTable/BCNewTable';
+export * from './lib/newComponents/BCNewDropdown/BCNewDropdown';
+export * from './lib/newComponents/BCNewTooltip/BCNewTooltip';
+export * from './lib/newComponents/BCNewAlertDialog/BCNewAlertDialog';
+export * from './lib/newComponents/BCNewDialog/BCNewDialog';
+export * from './lib/newComponents/BCRadioGroupItem/BCRadioItem';
+export * from './lib/newComponents/BCNewTabs/BCNewTabs';
+export * from './lib/baseComponents/button';
+export * from './lib/sortableHeader/SortableHeader';
+export * from './lib/newComponents/BCNewTable/types';
+export * from './lib/newComponents/BCNewDropdown/types';
+export * from './lib/newComponents/BCRadioGroupItem/types';
+export * from './lib/baseComponents/radio-group';
 export * from './lib/button/bcbutton';
 export * from './lib/button/types';
 export * from './lib/block/bcblock';

package/src/lib/InputWithSuggestions/index.d.ts

@@ -37,6 +37,7 @@ export type BCInputWithSuggestionsProps = {
         hidden: boolean;
     }) => void;
     onItemPicked?: (item: Suggestion) => void;
+    className?: string;
 };
 export declare const BCInputWithSuggestions: React.ForwardRefExoticComponent<BCInputWithSuggestionsProps & React.RefAttributes<HTMLInputElement>>;
 export {};

package/src/lib/baseComponents/alert-dialog.d.ts

@@ -0,0 +1,20 @@
+import * as React from 'react';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+declare const AlertDialog: React.FC<AlertDialogPrimitive.AlertDialogProps>;
+declare const AlertDialogTrigger: React.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal: React.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+declare const AlertDialogOverlay: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogContent: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertDialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const AlertDialogTitle: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const AlertDialogDescription: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDialogAction: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogActionProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogCancel: React.ForwardRefExoticComponent<Omit<AlertDialogPrimitive.AlertDialogCancelProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+export { AlertDialog, AlertDialogPortal, AlertDialogOverlay, AlertDialogTrigger, AlertDialogContent, AlertDialogHeader, AlertDialogFooter, AlertDialogTitle, AlertDialogDescription, AlertDialogAction, AlertDialogCancel, };

package/src/lib/baseComponents/button.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+interface ButtonStyleProps {
+    variant?: 'default' | 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link';
+    size?: 'default' | 'sm' | 'lg' | 'icon';
+}
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, ButtonStyleProps {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button };

package/src/lib/baseComponents/dialog.d.ts

@@ -0,0 +1,35 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import { SerializedStyles } from '@emotion/react';
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogHeader: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+declare const DialogFooter: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
+}, React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+interface DialogOverlayProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay> {
+    css?: SerializedStyles;
+}
+declare const DialogOverlay: React.ForwardRefExoticComponent<DialogOverlayProps & React.RefAttributes<HTMLDivElement>>;
+interface DialogContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
+    closeDialog?: () => void;
+    closeIcon?: boolean;
+    css?: SerializedStyles;
+    dir?: string;
+}
+declare const DialogContent: React.ForwardRefExoticComponent<DialogContentProps & React.RefAttributes<HTMLDivElement>>;
+interface DialogTitleProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title> {
+    css?: SerializedStyles;
+}
+declare const DialogTitle: React.ForwardRefExoticComponent<DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>;
+interface DialogDescriptionProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description> {
+    css?: SerializedStyles;
+}
+declare const DialogDescription: React.ForwardRefExoticComponent<DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>;
+export { Dialog, DialogPortal, DialogOverlay, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/src/lib/baseComponents/dropdown-menu.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { SerializedStyles } from '@emotion/react';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+declare const DropdownMenu: React.FC<DropdownMenuPrimitive.DropdownMenuProps>;
+declare const DropdownMenuTrigger: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuPortal: React.FC<DropdownMenuPrimitive.DropdownMenuPortalProps>;
+declare const DropdownMenuSub: React.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+declare const DropdownMenuRadioGroup: React.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubTrigger: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubTriggerProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+    rtl?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSubContent: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSubContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuContentProps extends React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content> {
+    css?: SerializedStyles;
+}
+declare const DropdownMenuContent: React.ForwardRefExoticComponent<DropdownMenuContentProps & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuCheckboxItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioItem: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuLabel: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
+    inset?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSeparator: React.ForwardRefExoticComponent<Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuShortcut: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLSpanElement>): import("@emotion/react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+export { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem, DropdownMenuCheckboxItem, DropdownMenuRadioItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuGroup, DropdownMenuPortal, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuRadioGroup, };

package/src/lib/baseComponents/radio-group.d.ts

@@ -0,0 +1,13 @@
+import * as React from "react";
+import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
+import { SerializedStyles } from '@emotion/react';
+interface RadioGroupProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Root> {
+    css?: SerializedStyles;
+}
+declare const RadioGroup: React.ForwardRefExoticComponent<RadioGroupProps & React.RefAttributes<HTMLDivElement>>;
+interface RadioGroupItemProps extends React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item> {
+    iconClassName?: string;
+    css?: SerializedStyles;
+}
+declare const RadioGroupItem: React.ForwardRefExoticComponent<RadioGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
+export { RadioGroup, RadioGroupItem };

package/src/lib/baseComponents/table.d.ts

@@ -0,0 +1,14 @@
+import * as React from 'react';
+declare const Table: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableElement> & {
+    height?: string | undefined;
+} & React.RefAttributes<HTMLTableElement>>;
+declare const TableHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableSectionElement> & React.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableRowElement> & {
+    selected?: boolean | undefined;
+} & React.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: React.ForwardRefExoticComponent<React.ThHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: React.ForwardRefExoticComponent<React.TdHTMLAttributes<HTMLTableCellElement> & React.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLTableCaptionElement> & React.RefAttributes<HTMLTableCaptionElement>>;
+export { Table, TableHeader, TableBody, TableFooter, TableHead, TableRow, TableCell, TableCaption };

package/src/lib/baseComponents/tabs.d.ts

@@ -0,0 +1,24 @@
+/// <reference types="react" />
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { SerializedStyles } from '@emotion/react';
+declare const Tabs: import("@emotion/styled").StyledComponent<TabsPrimitive.TabsProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    css?: SerializedStyles | undefined;
+}, {}, {}>;
+declare const TabsList: import("@emotion/styled").StyledComponent<TabsPrimitive.TabsListProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    css?: SerializedStyles | undefined;
+}, {}, {}>;
+declare const TabsTrigger: import("@emotion/styled").StyledComponent<TabsPrimitive.TabsTriggerProps & import("react").RefAttributes<HTMLButtonElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    css?: SerializedStyles | undefined;
+}, {}, {}>;
+declare const TabsContent: import("@emotion/styled").StyledComponent<TabsPrimitive.TabsContentProps & import("react").RefAttributes<HTMLDivElement> & {
+    theme?: import("@emotion/react").Theme | undefined;
+} & {
+    css?: SerializedStyles | undefined;
+}, {}, {}>;
+export { Tabs, TabsList, TabsTrigger, TabsContent };

package/src/lib/baseComponents/tooltip.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+declare const TooltipProvider: React.FC<TooltipPrimitive.TooltipProviderProps>;
+declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
+declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/src/lib/button/bcbutton.d.ts

@@ -4,6 +4,7 @@ export interface BCButtonProps {
     className?: string;
     onClick: (event: MouseEvent<HTMLButtonElement>) => void;
     onSubClick?: (key: string) => void;
+    rtl?: boolean;
     text: string | ReactElement;
     text2?: string;
     type?: 'button' | 'submit' | 'reset' | undefined;
@@ -20,5 +21,5 @@ export interface BCButtonProps {
 export interface BCButtonState {
     showDropdown: boolean;
 }
-export declare const BCButton: ({ className, onClick, text, disabled, loading, icon, refProp, hasDropList, onClick2, text2, type, buttonSize, buttonType, loadingIconPath, }: BCButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const BCButton: ({ className, onClick, rtl, text, disabled, loading, icon, refProp, hasDropList, onClick2, text2, type, buttonSize, buttonType, loadingIconPath, }: BCButtonProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default BCButton;

package/src/lib/checkbox/bccheckbox.d.ts

@@ -4,6 +4,7 @@ export interface BCCheckboxProps {
     checked: boolean;
     onChange?: () => any;
     label: string;
+    ref?: any;
 }
 export declare const BCCheckbox: (props: BCCheckboxProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default BCCheckbox;

package/src/lib/constants/Color.d.ts

@@ -70,4 +70,51 @@ export declare enum Color {
     SLIDER_DOT = "#dededf",
     ASSETS_PLAN_COLOR = "#35354C"
 }
+export declare enum NewColors {
+    PRIMARY = "var(--bc-primary)",
+    PRIMARY_400 = "var(--bc-primary-400)",
+    PRIMARY_FOREGROUND = "var(--bc-primary-foreground)",
+    PRIMARY_LIGHTER = "var(--bc-primary-lighter)",
+    PRIMARY_BORDER = "var(--Border-border-primary, #16616C)",
+    PRIMARY_DARKER = "var(--bc-primary-darker)",
+    PRIMARY_PARAGRAPH = "var(--bc-primary-paragraph)",
+    INBOX_BACKGROUND = "var(--bc-inbox-background)",
+    PLAYGROUND_BACKGROUND = "var(--bc-playground-background)",
+    INFO_COLOR = "var(--Text-text-info, #175CD3)",
+    SECONDARY = "var(--bc-secondary)",
+    SECONDARY_HOVER = "var(--bc-secondary-hover)",
+    SECONDARY_FOREGROUND = "var(--bc-secondary-foreground)",
+    SECONDARY_LIGHT = "var(--bc-secondary-light)",
+    SECONDARY_NEUTRAL = " var(--Border-border-neutral-secondary, #E5E7EB)",
+    SECONDARY_HEADING = "var(--Secondary-Color-Heading, #3F434A)",
+    DROPDOWN_ITEM = "var(--bc-dropDown-item)",
+    DROPDOWN_HOVER = "var(--bc-dropDown-hover)",
+    LIGHT_COLOR = "var(--bc-light-color)",
+    DANGER = "var(--bc-danger)",
+    DANGER_FOREGROUND = "var(--bc-danger-foreground)",
+    DANGER_DARKER = "var(--bc-danger-darker)",
+    DANGER_ALERT = "var(--bc-danger-alert)",
+    MUTED = "var(--bc-muted)",
+    MUTED_FOREGROUND = "var(--bc-muted-foreground)",
+    TABLE_HEADER = "var(--bc-table-header)",
+    TABLE_HEADER_FOREGROUND = "var(--bc-table-header-foreground)",
+    ALTERNATIVE_FOREGROUND = "var(--bc-alternative-foreground)",
+    BORDER_COLOR = "var(--bc-border-color)",
+    SECONDARY_BORDER = "var(--bc-secondary-border)",
+    SUCCESS = "var(--bc-success)",
+    CONTROLS = "var(--bc-controls)",
+    FOREGROUND = "var(--bc-foreground)",
+    BACKGROUND = "var(--bc-background)",
+    PLACEHOLDER = "var(--bc-placeholder)",
+    HOVER_BG = "var(--bc-hover-bg)",
+    CARD = "var(--bc-card)",
+    CARD_BORDER = "var(--bc-card-border)",
+    ACTIVE_CARD_BORDER = "var(--bc-active-card-border)",
+    CARD_HOVER = "var(--bc-card-hover)",
+    CARD_HOVER_LIGHT = "var(--bc-card-hover-light)",
+    TAG_BACKGROUND = "var(--bc-tag-background)",
+    TAG_COLOR = "var(--bc-tag-color)",
+    DARK = "var(--bc-dark)",
+    GRAY = "var(--bc-gray)"
+}
 export default Color;

package/src/lib/constants/Droplist.d.ts

@@ -4,4 +4,5 @@ export interface BCDropListOptionsType {
     styleClass?: string;
     value: string;
     note?: string;
+    separator?: boolean;
 }

package/src/lib/constants/FontFamily.d.ts

@@ -1,5 +1,13 @@
 export declare enum FontFamily {
     Main = "Montserrat",
-    Secondary = "sans-serif"
+    Secondary = "sans-serif",
+    Poppins = "Poppins"
+}
+export declare enum FontFamilyStack {
+    DEFAULT = "var(--bc-font-stack)",
+    POPPINS_PRIMARY = "var(--bc-font-stack-poppins)",
+    MONTSERRAT_PRIMARY = "var(--bc-font-stack-montserrat)",
+    POPPINS_ONLY = "var(--bc-font-stack-primary)",
+    MONTSERRAT_ONLY = "var(--bc-font-stack-secondary)"
 }
 export default FontFamily;

package/src/lib/constants/LineHeight.d.ts

@@ -1,10 +1,22 @@
 export declare const LineHeight: {
-    10: string;
+    8: string;
     12: string;
     14: string;
     18: string;
     22: string;
     26: string;
     32: string;
+    48: string;
 };
+export declare enum LineHeightRem {
+    XXS = "var(--bc-lineHeight-body-5)",
+    XS = "var(--bc-lineHeight-body-4)",
+    S = "var(--bc-lineHeight-body-3)",
+    M = "var(--bc-lineHeight-body-2)",
+    L = "var(--bc-lineHeight-body-1)",
+    XL = "var(--bc-lineHeight-header-4)",
+    XXL = "var(--bc-lineHeight-header-3)",
+    XXXL = "var(--bc-lineHeight-header-2)",
+    XXXXL = "var(--bc-lineHeight-header-1)"
+}
 export default LineHeight;

package/src/lib/constants/TextSize.d.ts

@@ -1,10 +1,23 @@
 export declare enum TextSize {
-    XXS = 10,
+    XXS = 8,
     XS = 12,
     S = 14,
     M = 18,
     L = 22,
     XL = 26,
-    XXL = 32
+    XXL = 32,
+    XXXL = 48
+}
+export declare enum TextSizeRem {
+    XXS = "var(--bc-fontSize-body-5)",
+    XS = "var(--bc-fontSize-body-4)",
+    S = "var(--bc-fontSize-body-3)",
+    M = "var(--bc-fontSize-body-2)",
+    L = "var(--bc-fontSize-body-1)",
+    XL = "var(--bc-fontSize-header-4)",
+    XXL = "var(--bc-fontSize-header-3)",
+    XXXL = "var(--bc-fontSize-header-2_5)",
+    XXXXL = "var(--bc-fontSize-header-2)",
+    XXXXXL = "var(--bc-fontSize-header-1)"
 }
 export default TextSize;

package/src/lib/constants/TextWeight.d.ts

@@ -1,7 +1,18 @@
 export declare enum TextWeight {
     LIGHT = 100,
     REGULAR = 300,
+    NORMAL = 400,
     MEDIUM = 500,
     BOLD = 700
 }
+export declare enum NewTextWeight {
+    LIGHT = "var(--bc-fontWeight-light)",
+    REGULAR = "var(--bc-fontWeight-regular)",
+    NORMAL = "var(--bc-fontWeight-normal)",
+    MEDIUM = "var(--bc-fontWeight-medium)",
+    SEMIBOLD = "var(--bc-fontWeight-semibold)",
+    BOLD = "var(--bc-fontWeight-bold)",
+    EXTRABOLD = "var(--bc-fontWeight-extraBold)",
+    BLACK = "var(--bc-fontWeight-black)"
+}
 export default TextWeight;

package/src/lib/dropList/bcdrop-list.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { ButtonSize, BCDropListOptionsType } from '../constants';
+import { SerializedStyles } from '@emotion/react';
 export interface BCDropListProps {
     className?: string;
     selected?: string;
@@ -11,6 +12,19 @@ export interface BCDropListProps {
     buttonSize?: ButtonSize;
     rtl?: boolean;
     icon?: React.ReactNode;
+    containerCss?: SerializedStyles;
+    buttonCss?: SerializedStyles;
+    dropDownContentCss?: SerializedStyles;
+    loading?: boolean;
+    disabled?: boolean;
+    allowCreate?: boolean;
+    onCreateNew?: (value: string) => void;
+    createPlaceholder?: string;
+    addText?: string;
+    createText?: string;
+    id?: string;
+    searchable?: boolean;
+    searchPlaceholder?: string;
 }
-export declare const BCDropList: ({ className, selected, options, onSelectOption, noEmpty, placeholder, emptyText, buttonSize, rtl, icon, }: BCDropListProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const BCDropList: ({ className, selected, options, onSelectOption, noEmpty, placeholder, emptyText, buttonSize, rtl, icon, containerCss, buttonCss, dropDownContentCss, loading, disabled, allowCreate, onCreateNew, createPlaceholder, addText, createText, id, searchable, searchPlaceholder, }: BCDropListProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export default BCDropList;

package/src/lib/dropList/example-usage.d.ts

@@ -0,0 +1,2 @@
+export declare const DropListExample: () => import("@emotion/react/jsx-runtime").JSX.Element;
+export default DropListExample;

package/src/lib/hooks/useForm/index.d.ts

@@ -1,6 +1,7 @@
 import React from 'react';
 import { BCValidationTypes } from './validationConstant';
 import { BCDropListOptionsType } from '../../constants';
+import { SerializedStyles } from '@emotion/react';
 export declare const FormGroup: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme | undefined;
     as?: React.ElementType<any, keyof React.JSX.IntrinsicElements> | undefined;
@@ -27,7 +28,7 @@ interface useBCFormReturnFunctions {
     validateForm: () => boolean;
     onChange: (targetVal: string, e: React.ChangeEvent<HTMLInputElement>) => void;
     resetValidationStates: () => void;
-    renderField: (name: string, label: string, type: FieldType, readonly?: boolean, placeholder?: string, tooltip?: string) => JSX.Element;
+    renderField: (name: string, label: string, type: FieldType, readonly?: boolean, placeholder?: string, tooltip?: string, dynamicStyle?: SerializedStyles) => JSX.Element;
     _renderFieldInput: (name: string, type: FieldType, readonly: boolean, placeholder: string) => JSX.Element;
     onDroplistSelectionChange: (name: string, selectedKey?: string) => void;
     renderDroplistField: (name: string, label: string, options: BCDropListOptionsType[], placeholder?: string, tooltip?: string) => JSX.Element;

package/src/lib/hooks/useForm/validationConstant.d.ts

@@ -16,6 +16,7 @@ export declare const BCDefaultValidationMessages: {
     emptyMessage: string;
     urlMessage: string;
     usernameMessage: string;
+    phoneNumberMessage: string;
 };
 export declare enum BCValidationTypes {
     NOT_EMPTY = "NOT_EMPTY",
@@ -24,5 +25,6 @@ export declare enum BCValidationTypes {
     CONFIRM_PASSWORD = "CONFIRM_PASSWORD",
     NAME_2_LETTERS = "NAME_2_LETTERS",
     TURKISH_IDENTITY = "TURKISH_IDENTITY",
-    DOMAIN = "DOMAIN"
+    DOMAIN = "DOMAIN",
+    PHONE_NUMBER = "PHONE_NUMBER"
 }

package/src/lib/hooks/useTheme.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+type Theme = 'light' | 'dark';
+export declare function useTheme(): {
+    theme: Theme;
+    setTheme: import("react").Dispatch<import("react").SetStateAction<Theme>>;
+    toggleTheme: () => void;
+};
+export {};