@cyber-harbour/ui 1.0.46 → 1.0.48

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/index.d.mts CHANGED
@@ -23,6 +23,8 @@ type ButtonSize = 'small' | 'medium';
23
23
  type InputVariant = 'outlined' | 'empty';
24
24
  type InputState = 'default' | 'focus' | 'error' | 'disabled';
25
25
  type InputSize = 'empty' | 'small' | 'medium';
26
+ type TagVariant = 'fill' | 'outlined';
27
+ type TagColor = 'default' | 'primary' | 'error' | 'warning' | 'success' | 'disabled' | string;
26
28
  type Breakpoint = 'xs' | 's' | 'm' | 'l' | 'xl';
27
29
  type ButtonElementStyle = {
28
30
  background: string;
@@ -60,6 +62,13 @@ type InputSizeStyle = {
60
62
  height: number | string;
61
63
  lineHeight: number;
62
64
  };
65
+ type TagElementStyle = {
66
+ paddingInline: number | string;
67
+ paddingBlock: number | string;
68
+ borderRadius: number | string;
69
+ borderWidth: number | string;
70
+ color: Record<TagColor, string>;
71
+ };
63
72
  type Theme = {
64
73
  mode: 'light' | 'dark';
65
74
  baseSize: number;
@@ -239,6 +248,7 @@ type Theme = {
239
248
  foreground: string;
240
249
  background: string;
241
250
  };
251
+ tag: Record<TagVariant, TagElementStyle>;
242
252
  };
243
253
  type ThemeColors = Theme['colors'];
244
254
  type ColorCategory = keyof ThemeColors;
@@ -297,6 +307,10 @@ declare const getTypographyStyles: (theme: DefaultTheme, variant?: string) => {
297
307
  * Функція для отримання медіа-запитів для breakpoints
298
308
  */
299
309
  declare const getBreakpoint: (theme: DefaultTheme, size?: Breakpoint) => string;
310
+ /**
311
+ * Функція для отримання rgba кольору з hex формату
312
+ */
313
+ declare const hexToRgba: (hex: string, alpha: number) => string;
300
314
 
301
315
  /**
302
316
  * Палітра, що містить як кольори, так і розміри в px
@@ -577,6 +591,36 @@ interface MaximizeIconProps extends SVGProps<SVGSVGElement> {
577
591
  }
578
592
  declare const MaximizeIcon: ({ fill, ...props }: MaximizeIconProps) => react_jsx_runtime.JSX.Element;
579
593
 
594
+ interface BusIconProps extends SVGProps<SVGSVGElement> {
595
+ fill?: string;
596
+ }
597
+ declare const BusIcon: ({ fill, ...props }: BusIconProps) => react_jsx_runtime.JSX.Element;
598
+
599
+ interface CarIconProps extends SVGProps<SVGSVGElement> {
600
+ fill?: string;
601
+ }
602
+ declare const CarIcon: ({ fill, ...props }: CarIconProps) => react_jsx_runtime.JSX.Element;
603
+
604
+ interface WayIconProps extends SVGProps<SVGSVGElement> {
605
+ fill?: string;
606
+ }
607
+ declare const WayIcon: ({ fill, ...props }: WayIconProps) => react_jsx_runtime.JSX.Element;
608
+
609
+ interface PlaneIconProps extends SVGProps<SVGSVGElement> {
610
+ fill?: string;
611
+ }
612
+ declare const PlaneIcon: ({ fill, ...props }: PlaneIconProps) => react_jsx_runtime.JSX.Element;
613
+
614
+ interface ShipIconProps extends SVGProps<SVGSVGElement> {
615
+ fill?: string;
616
+ }
617
+ declare const ShipIcon: ({ fill, ...props }: ShipIconProps) => react_jsx_runtime.JSX.Element;
618
+
619
+ interface FileIconProps extends SVGProps<SVGSVGElement> {
620
+ fill?: string;
621
+ }
622
+ declare const FileIcon: ({ fill, ...props }: FileIconProps) => react_jsx_runtime.JSX.Element;
623
+
580
624
  interface SidebarProps {
581
625
  defaultCollapsed?: boolean;
582
626
  children: any;
@@ -820,6 +864,18 @@ interface EmptyDataProps {
820
864
  }
821
865
  declare const EmptyData: ({ children, title, note, className }: EmptyDataProps) => react_jsx_runtime.JSX.Element;
822
866
 
867
+ type TagProps = FabricComponent<{
868
+ children?: any;
869
+ variant?: TagVariant;
870
+ color?: TagColor;
871
+ className?: string;
872
+ icon?: any;
873
+ disabled?: boolean;
874
+ onClick?: () => void;
875
+ onDelete?: () => void;
876
+ }> & Omit<react__default.HTMLAttributes<HTMLDivElement>, 'children'>;
877
+ declare const Tag: ({ children, variant, color, className, disabled, icon, onClick, onDelete, ...props }: TagProps) => react_jsx_runtime.JSX.Element;
878
+
823
879
  interface PageLayoutProps {
824
880
  header?: any;
825
881
  sidebar?: any;
@@ -913,4 +969,4 @@ interface FullscreenCardProps {
913
969
  }
914
970
  declare const FullscreenCard: ({ isActive, position, top, left, right, bottom, ...props }: FullscreenCardProps) => react_jsx_runtime.JSX.Element;
915
971
 
916
- export { type Action, AlertIcon, ApiIcon, ArrowCircleTopRightIcon, ArrowRightIcon, BallsMenu, Box, type Breakpoint, BugReportIcon, Button, type ButtonColor, type ButtonElementStyle, type ButtonProps, type ButtonSize, type ButtonSizeStyle, type ButtonState, type ButtonVariant, CalendarIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseCircleIcon, ClosedLockIcon, type ColorVariant, type ColumnTable, Container, ContextMenu, ContextMenuDelimiter, CrossIcon, DataSetsIcon, DeepSearchIcon, DisabledVisibleIcon, DocsIcon, DownloadIcon, EditUserIcon, EmptyData, type EmptyDataProps, EnableVisibleIcon, EnterArrowLeftIcon, type FabricComponent, FiltersIcon, FlexContainer, FlexItem, FullscreenCard, GlobalStyle, Graph2D, type Graph2DProps, type Graph2DRef, type GraphData, Header, HeaderDelimeter, HeaderSection, HomepageIcon, InfoCircleFilledIcon, InfoCircleIcon, Input, type InputElementProps, type InputElementStyle, type InputProps, type InputSize, type InputSizeStyle, type InputState, type InputVariant, Line, type LinkObject, ListMenu, ListMenuItem, type ListMenuItemAnchorProps, type ListMenuItemBase, type ListMenuItemButtonProps, type ListMenuItemProps, type ListMenuProps, ListMenuSection, type ListMenuSectionProps, MapRadarIcon, MaximizeIcon, MoonIcon, type NestedColorPaths, type NodeButton, type NodeObject, OpenLockIcon, OrganizationIcon, PageLayout, Pagination, type PaginationProps, PasswordFinderIcon, PhonebookIcon, PlusIcon, PrintIcon, Profiler2Icon, ProfilerIcon, type RenderCellProps, type RenderHeaderCellProps, RowActionsMenu, SandBoxIcon, SearchIcon, Select, Sidebar, SidebarContext, SidebarDelimeter, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, StatisticIcon, StyledContainer, SunIcon, Table, type TextAreaElementProps, type Theme, type ThemeMode, ThemeProvider, Typography, type TypographyVariant, UnfoldIcon, UpRightArrowCircleIcon, UsersIcon, VectorIcon, convertPaletteToRem, createComponent, darkTheme, darkThemePx, getBreakpoint, getButtonSizeStyles, getButtonStyles, getInputStyles, getTypographyStyles, lightTheme, lightThemePx, pxToRem, remToPx, resolveThemeColor, useContextMenuControl };
972
+ export { type Action, AlertIcon, ApiIcon, ArrowCircleTopRightIcon, ArrowRightIcon, BallsMenu, Box, type Breakpoint, BugReportIcon, BusIcon, Button, type ButtonColor, type ButtonElementStyle, type ButtonProps, type ButtonSize, type ButtonSizeStyle, type ButtonState, type ButtonVariant, CalendarIcon, CarIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseCircleIcon, ClosedLockIcon, type ColorVariant, type ColumnTable, Container, ContextMenu, ContextMenuDelimiter, CrossIcon, DataSetsIcon, DeepSearchIcon, DisabledVisibleIcon, DocsIcon, DownloadIcon, EditUserIcon, EmptyData, type EmptyDataProps, EnableVisibleIcon, EnterArrowLeftIcon, type FabricComponent, FileIcon, FiltersIcon, FlexContainer, FlexItem, FullscreenCard, GlobalStyle, Graph2D, type Graph2DProps, type Graph2DRef, type GraphData, Header, HeaderDelimeter, HeaderSection, HomepageIcon, InfoCircleFilledIcon, InfoCircleIcon, Input, type InputElementProps, type InputElementStyle, type InputProps, type InputSize, type InputSizeStyle, type InputState, type InputVariant, Line, type LinkObject, ListMenu, ListMenuItem, type ListMenuItemAnchorProps, type ListMenuItemBase, type ListMenuItemButtonProps, type ListMenuItemProps, type ListMenuProps, ListMenuSection, type ListMenuSectionProps, MapRadarIcon, MaximizeIcon, MoonIcon, type NestedColorPaths, type NodeButton, type NodeObject, OpenLockIcon, OrganizationIcon, PageLayout, Pagination, type PaginationProps, PasswordFinderIcon, PhonebookIcon, PlaneIcon, PlusIcon, PrintIcon, Profiler2Icon, ProfilerIcon, type RenderCellProps, type RenderHeaderCellProps, RowActionsMenu, SandBoxIcon, SearchIcon, Select, ShipIcon, Sidebar, SidebarContext, SidebarDelimeter, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, StatisticIcon, StyledContainer, SunIcon, Table, Tag, type TagColor, type TagElementStyle, type TagVariant, type TextAreaElementProps, type Theme, type ThemeMode, ThemeProvider, Typography, type TypographyVariant, UnfoldIcon, UpRightArrowCircleIcon, UsersIcon, VectorIcon, WayIcon, convertPaletteToRem, createComponent, darkTheme, darkThemePx, getBreakpoint, getButtonSizeStyles, getButtonStyles, getInputStyles, getTypographyStyles, hexToRgba, lightTheme, lightThemePx, pxToRem, remToPx, resolveThemeColor, useContextMenuControl };
package/dist/index.d.ts CHANGED
@@ -23,6 +23,8 @@ type ButtonSize = 'small' | 'medium';
23
23
  type InputVariant = 'outlined' | 'empty';
24
24
  type InputState = 'default' | 'focus' | 'error' | 'disabled';
25
25
  type InputSize = 'empty' | 'small' | 'medium';
26
+ type TagVariant = 'fill' | 'outlined';
27
+ type TagColor = 'default' | 'primary' | 'error' | 'warning' | 'success' | 'disabled' | string;
26
28
  type Breakpoint = 'xs' | 's' | 'm' | 'l' | 'xl';
27
29
  type ButtonElementStyle = {
28
30
  background: string;
@@ -60,6 +62,13 @@ type InputSizeStyle = {
60
62
  height: number | string;
61
63
  lineHeight: number;
62
64
  };
65
+ type TagElementStyle = {
66
+ paddingInline: number | string;
67
+ paddingBlock: number | string;
68
+ borderRadius: number | string;
69
+ borderWidth: number | string;
70
+ color: Record<TagColor, string>;
71
+ };
63
72
  type Theme = {
64
73
  mode: 'light' | 'dark';
65
74
  baseSize: number;
@@ -239,6 +248,7 @@ type Theme = {
239
248
  foreground: string;
240
249
  background: string;
241
250
  };
251
+ tag: Record<TagVariant, TagElementStyle>;
242
252
  };
243
253
  type ThemeColors = Theme['colors'];
244
254
  type ColorCategory = keyof ThemeColors;
@@ -297,6 +307,10 @@ declare const getTypographyStyles: (theme: DefaultTheme, variant?: string) => {
297
307
  * Функція для отримання медіа-запитів для breakpoints
298
308
  */
299
309
  declare const getBreakpoint: (theme: DefaultTheme, size?: Breakpoint) => string;
310
+ /**
311
+ * Функція для отримання rgba кольору з hex формату
312
+ */
313
+ declare const hexToRgba: (hex: string, alpha: number) => string;
300
314
 
301
315
  /**
302
316
  * Палітра, що містить як кольори, так і розміри в px
@@ -577,6 +591,36 @@ interface MaximizeIconProps extends SVGProps<SVGSVGElement> {
577
591
  }
578
592
  declare const MaximizeIcon: ({ fill, ...props }: MaximizeIconProps) => react_jsx_runtime.JSX.Element;
579
593
 
594
+ interface BusIconProps extends SVGProps<SVGSVGElement> {
595
+ fill?: string;
596
+ }
597
+ declare const BusIcon: ({ fill, ...props }: BusIconProps) => react_jsx_runtime.JSX.Element;
598
+
599
+ interface CarIconProps extends SVGProps<SVGSVGElement> {
600
+ fill?: string;
601
+ }
602
+ declare const CarIcon: ({ fill, ...props }: CarIconProps) => react_jsx_runtime.JSX.Element;
603
+
604
+ interface WayIconProps extends SVGProps<SVGSVGElement> {
605
+ fill?: string;
606
+ }
607
+ declare const WayIcon: ({ fill, ...props }: WayIconProps) => react_jsx_runtime.JSX.Element;
608
+
609
+ interface PlaneIconProps extends SVGProps<SVGSVGElement> {
610
+ fill?: string;
611
+ }
612
+ declare const PlaneIcon: ({ fill, ...props }: PlaneIconProps) => react_jsx_runtime.JSX.Element;
613
+
614
+ interface ShipIconProps extends SVGProps<SVGSVGElement> {
615
+ fill?: string;
616
+ }
617
+ declare const ShipIcon: ({ fill, ...props }: ShipIconProps) => react_jsx_runtime.JSX.Element;
618
+
619
+ interface FileIconProps extends SVGProps<SVGSVGElement> {
620
+ fill?: string;
621
+ }
622
+ declare const FileIcon: ({ fill, ...props }: FileIconProps) => react_jsx_runtime.JSX.Element;
623
+
580
624
  interface SidebarProps {
581
625
  defaultCollapsed?: boolean;
582
626
  children: any;
@@ -820,6 +864,18 @@ interface EmptyDataProps {
820
864
  }
821
865
  declare const EmptyData: ({ children, title, note, className }: EmptyDataProps) => react_jsx_runtime.JSX.Element;
822
866
 
867
+ type TagProps = FabricComponent<{
868
+ children?: any;
869
+ variant?: TagVariant;
870
+ color?: TagColor;
871
+ className?: string;
872
+ icon?: any;
873
+ disabled?: boolean;
874
+ onClick?: () => void;
875
+ onDelete?: () => void;
876
+ }> & Omit<react__default.HTMLAttributes<HTMLDivElement>, 'children'>;
877
+ declare const Tag: ({ children, variant, color, className, disabled, icon, onClick, onDelete, ...props }: TagProps) => react_jsx_runtime.JSX.Element;
878
+
823
879
  interface PageLayoutProps {
824
880
  header?: any;
825
881
  sidebar?: any;
@@ -913,4 +969,4 @@ interface FullscreenCardProps {
913
969
  }
914
970
  declare const FullscreenCard: ({ isActive, position, top, left, right, bottom, ...props }: FullscreenCardProps) => react_jsx_runtime.JSX.Element;
915
971
 
916
- export { type Action, AlertIcon, ApiIcon, ArrowCircleTopRightIcon, ArrowRightIcon, BallsMenu, Box, type Breakpoint, BugReportIcon, Button, type ButtonColor, type ButtonElementStyle, type ButtonProps, type ButtonSize, type ButtonSizeStyle, type ButtonState, type ButtonVariant, CalendarIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseCircleIcon, ClosedLockIcon, type ColorVariant, type ColumnTable, Container, ContextMenu, ContextMenuDelimiter, CrossIcon, DataSetsIcon, DeepSearchIcon, DisabledVisibleIcon, DocsIcon, DownloadIcon, EditUserIcon, EmptyData, type EmptyDataProps, EnableVisibleIcon, EnterArrowLeftIcon, type FabricComponent, FiltersIcon, FlexContainer, FlexItem, FullscreenCard, GlobalStyle, Graph2D, type Graph2DProps, type Graph2DRef, type GraphData, Header, HeaderDelimeter, HeaderSection, HomepageIcon, InfoCircleFilledIcon, InfoCircleIcon, Input, type InputElementProps, type InputElementStyle, type InputProps, type InputSize, type InputSizeStyle, type InputState, type InputVariant, Line, type LinkObject, ListMenu, ListMenuItem, type ListMenuItemAnchorProps, type ListMenuItemBase, type ListMenuItemButtonProps, type ListMenuItemProps, type ListMenuProps, ListMenuSection, type ListMenuSectionProps, MapRadarIcon, MaximizeIcon, MoonIcon, type NestedColorPaths, type NodeButton, type NodeObject, OpenLockIcon, OrganizationIcon, PageLayout, Pagination, type PaginationProps, PasswordFinderIcon, PhonebookIcon, PlusIcon, PrintIcon, Profiler2Icon, ProfilerIcon, type RenderCellProps, type RenderHeaderCellProps, RowActionsMenu, SandBoxIcon, SearchIcon, Select, Sidebar, SidebarContext, SidebarDelimeter, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, StatisticIcon, StyledContainer, SunIcon, Table, type TextAreaElementProps, type Theme, type ThemeMode, ThemeProvider, Typography, type TypographyVariant, UnfoldIcon, UpRightArrowCircleIcon, UsersIcon, VectorIcon, convertPaletteToRem, createComponent, darkTheme, darkThemePx, getBreakpoint, getButtonSizeStyles, getButtonStyles, getInputStyles, getTypographyStyles, lightTheme, lightThemePx, pxToRem, remToPx, resolveThemeColor, useContextMenuControl };
972
+ export { type Action, AlertIcon, ApiIcon, ArrowCircleTopRightIcon, ArrowRightIcon, BallsMenu, Box, type Breakpoint, BugReportIcon, BusIcon, Button, type ButtonColor, type ButtonElementStyle, type ButtonProps, type ButtonSize, type ButtonSizeStyle, type ButtonState, type ButtonVariant, CalendarIcon, CarIcon, CheckIcon, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon, CloseCircleIcon, ClosedLockIcon, type ColorVariant, type ColumnTable, Container, ContextMenu, ContextMenuDelimiter, CrossIcon, DataSetsIcon, DeepSearchIcon, DisabledVisibleIcon, DocsIcon, DownloadIcon, EditUserIcon, EmptyData, type EmptyDataProps, EnableVisibleIcon, EnterArrowLeftIcon, type FabricComponent, FileIcon, FiltersIcon, FlexContainer, FlexItem, FullscreenCard, GlobalStyle, Graph2D, type Graph2DProps, type Graph2DRef, type GraphData, Header, HeaderDelimeter, HeaderSection, HomepageIcon, InfoCircleFilledIcon, InfoCircleIcon, Input, type InputElementProps, type InputElementStyle, type InputProps, type InputSize, type InputSizeStyle, type InputState, type InputVariant, Line, type LinkObject, ListMenu, ListMenuItem, type ListMenuItemAnchorProps, type ListMenuItemBase, type ListMenuItemButtonProps, type ListMenuItemProps, type ListMenuProps, ListMenuSection, type ListMenuSectionProps, MapRadarIcon, MaximizeIcon, MoonIcon, type NestedColorPaths, type NodeButton, type NodeObject, OpenLockIcon, OrganizationIcon, PageLayout, Pagination, type PaginationProps, PasswordFinderIcon, PhonebookIcon, PlaneIcon, PlusIcon, PrintIcon, Profiler2Icon, ProfilerIcon, type RenderCellProps, type RenderHeaderCellProps, RowActionsMenu, SandBoxIcon, SearchIcon, Select, ShipIcon, Sidebar, SidebarContext, SidebarDelimeter, SidebarItem, type SidebarItemProps, type SidebarProps, SidebarSection, type SidebarSectionProps, StatisticIcon, StyledContainer, SunIcon, Table, Tag, type TagColor, type TagElementStyle, type TagVariant, type TextAreaElementProps, type Theme, type ThemeMode, ThemeProvider, Typography, type TypographyVariant, UnfoldIcon, UpRightArrowCircleIcon, UsersIcon, VectorIcon, WayIcon, convertPaletteToRem, createComponent, darkTheme, darkThemePx, getBreakpoint, getButtonSizeStyles, getButtonStyles, getInputStyles, getTypographyStyles, hexToRgba, lightTheme, lightThemePx, pxToRem, remToPx, resolveThemeColor, useContextMenuControl };