Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
Socket
Sign inDemoInstall
Socket
Sign inDemoInstall

@chakra-ui/theme

Package Overview
Dependencies
Maintainers
2
Versions
655
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@chakra-ui/theme - npm Package Compare versions

Comparing version 0.0.0-dev-20240219165930 to 0.0.0-dev-20240224205404

dist/cjs/components/field.cjs
dist/cjs/components/mark.cjs
dist/esm/components/field.mjs
dist/esm/components/mark.mjs
dist/types/components/field.d.ts
dist/types/components/mark.d.ts

17

dist/types/components/accordion.d.ts
export declare const accordionTheme: {
baseStyle?: {
container: {
item: {
borderTopWidth: string;
borderColor: string;
overflowAnchor: string;
_last: {

@@ -10,3 +11,7 @@ borderBottomWidth: string;

};
button: {
trigger: {
display: string;
alignItems: string;
width: string;
outline: number;
transitionProperty: string;

@@ -28,3 +33,3 @@ transitionDuration: string;

};
panel: {
content: {
pt: string;

@@ -40,3 +45,3 @@ px: string;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "root" | "button" | "panel" | "icon")[];
keys: ("root" | "item" | "trigger" | "content" | "icon")[];
}>;

@@ -46,3 +51,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "root" | "button" | "panel" | "icon")[];
keys: ("root" | "item" | "trigger" | "content" | "icon")[];
}>;

@@ -55,3 +60,3 @@ } | undefined;

} | undefined;
parts: ("container" | "root" | "button" | "panel" | "icon")[];
parts: ("root" | "item" | "trigger" | "content" | "icon")[];
};

20

dist/types/components/alert.d.ts
import { StyleFunctionProps } from "@chakra-ui/styled-system";
export declare const alertTheme: {
baseStyle?: {
container: {
root: {
width: string;
display: string;
alignItems: string;
position: string;
overflow: string;
bg: string;

@@ -15,2 +20,3 @@ px: string;

description: {
display: string;
lineHeight: string;

@@ -35,3 +41,3 @@ };

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "icon" | "title" | "description" | "spinner")[];
keys: ("root" | "icon" | "title" | "description" | "spinner")[];
}>;

@@ -41,3 +47,3 @@ } | undefined;

subtle: (props: StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -52,3 +58,3 @@ [x: string]: string;

"left-accent": (props: StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -66,3 +72,3 @@ [x: string]: string;

"top-accent": (props: StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -80,3 +86,3 @@ [x: string]: string;

solid: (props: StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -97,3 +103,3 @@ [x: string]: string;

} | undefined;
parts: ("container" | "icon" | "title" | "description" | "spinner")[];
parts: ("root" | "icon" | "title" | "description" | "spinner")[];
};

32

dist/types/components/avatar.d.ts
export declare const avatarTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
group: {
display: string;
alignItems: string;
justifyContent: string;
flexDirection: string;
};
badge: {

@@ -15,5 +21,2 @@ [x: string]: string | {

excessLabel: {
[x: string]: string | {
[x: string]: string;
};
bg: string;

@@ -27,7 +30,12 @@ fontSize: string;

};
display: string;
alignItems: string;
justifyContent: string;
textAlign: string;
textTransform: string;
fontWeight: string;
position: string;
flexShrink: number;
};
container: {
[x: string]: string | {
[x: string]: string;
};
bg: string;

@@ -46,2 +54,10 @@ fontSize: string;

};
display: string;
alignItems: string;
justifyContent: string;
textAlign: string;
textTransform: string;
fontWeight: string;
position: string;
flexShrink: number;
};

@@ -201,3 +217,3 @@ label: {

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "label" | "badge" | "excessLabel" | "group")[];
keys: ("root" | "label" | "badge" | "excessLabel" | "group")[];
}>;

@@ -210,3 +226,3 @@ } | undefined;

} | undefined;
parts: ("container" | "label" | "badge" | "excessLabel" | "group")[];
parts: ("root" | "label" | "badge" | "excessLabel" | "group")[];
};

10

dist/types/components/breadcrumb.d.ts

@@ -29,6 +29,10 @@ export declare const breadcrumbTheme: {

};
item: {
display: string;
alignItems: string;
};
} | undefined;
sizes?: {
[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "link" | "item" | "separator")[];
keys: ("root" | "item" | "link" | "separator")[];
}>;

@@ -38,3 +42,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "link" | "item" | "separator")[];
keys: ("root" | "item" | "link" | "separator")[];
}>;

@@ -47,3 +51,3 @@ } | undefined;

} | undefined;
parts: ("container" | "link" | "item" | "separator")[];
parts: ("root" | "item" | "link" | "separator")[];
};

15

dist/types/components/button.d.ts
export declare const buttonTheme: {
baseStyle?: {
display: string;
appearance: string;
alignItems: string;
justifyContent: string;
userSelect: string;
position: string;
whiteSpace: string;
verticalAlign: string;
outline: string;
lineHeight: string;
gap: string;
borderRadius: string;

@@ -8,2 +18,7 @@ fontWeight: string;

transitionDuration: string;
_focus: {
"&[data-in-group]": {
zIndex: number;
};
};
_focusVisible: {

@@ -10,0 +25,0 @@ boxShadow: string;

22

dist/types/components/card.d.ts
export declare const cardTheme: {
baseStyle?: {
container: {
[x: string]: string;
root: {
[x: string]: string | number;
display: string;
position: string;
minWidth: number;
wordWrap: string;
backgroundColor: string;

@@ -25,3 +29,3 @@ boxShadow: string;

sm: {
container: {
root: {
[x: string]: string;

@@ -31,3 +35,3 @@ };

md: {
container: {
root: {
[x: string]: string;

@@ -37,3 +41,3 @@ };

lg: {
container: {
root: {
[x: string]: string;

@@ -45,3 +49,3 @@ };

elevated: {
container: {
root: {
[x: string]: string | {

@@ -56,3 +60,3 @@ [x: string]: string;

outline: {
container: {
root: {
[x: string]: string;

@@ -62,3 +66,3 @@ };

filled: {
container: {
root: {
[x: string]: string;

@@ -84,3 +88,3 @@ };

} | undefined;
parts: ("container" | "header" | "body" | "footer")[];
parts: ("root" | "header" | "body" | "footer")[];
};

18

dist/types/components/checkbox.d.ts

@@ -7,3 +7,9 @@ export declare const checkboxTheme: {

};
container: {
root: {
display: string;
gap: string;
alignItems: string;
verticalAlign: string;
cursor: string;
position: string;
_disabled: {

@@ -14,2 +20,7 @@ cursor: string;

control: {
display: string;
alignItems: string;
justifyContent: string;
flexShrink: number;
userSelect: string;
w: string;

@@ -23,2 +34,3 @@ h: string;

color: string;
verticalAlign: string;
_checked: {

@@ -98,3 +110,3 @@ bg: string;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "icon" | "label" | "control")[];
keys: ("root" | "icon" | "label" | "control")[];
}>;

@@ -107,3 +119,3 @@ } | undefined;

} | undefined;
parts: ("container" | "icon" | "label" | "control")[];
parts: ("root" | "icon" | "label" | "control")[];
};

5

dist/types/components/close-button.d.ts
export declare const closeButtonTheme: {
baseStyle?: {
outline: number;
display: string;
alignItems: string;
justifyContent: string;
flexShrink: number;
w: string[];

@@ -4,0 +9,0 @@ h: string[];

20

dist/types/components/drawer.d.ts

@@ -7,3 +7,3 @@ export declare const drawerTheme: {

};
dialogContainer: {
positioner: {
display: string;

@@ -13,3 +13,3 @@ zIndex: string;

};
dialog: any;
content: any;
header: {

@@ -39,3 +39,3 @@ px: string;

xs: {
dialog: {
content: {
maxW: string;

@@ -45,3 +45,3 @@ };

sm: {
dialog: {
content: {
maxW: string;

@@ -51,3 +51,3 @@ };

md: {
dialog: {
content: {
maxW: string;

@@ -57,3 +57,3 @@ };

lg: {
dialog: {
content: {
maxW: string;

@@ -63,3 +63,3 @@ };

xl: {
dialog: {
content: {
maxW: string;

@@ -69,3 +69,3 @@ };

full: {
dialog: {
content: {
maxW: string;

@@ -77,3 +77,3 @@ };

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("overlay" | "dialogContainer" | "dialog" | "header" | "closeButton" | "body" | "footer")[];
keys: ("content" | "overlay" | "positioner" | "header" | "closeTrigger" | "body" | "footer")[];
}>;

@@ -86,3 +86,3 @@ } | undefined;

} | undefined;
parts: ("overlay" | "dialogContainer" | "dialog" | "header" | "closeButton" | "body" | "footer")[];
parts: ("content" | "overlay" | "positioner" | "header" | "closeTrigger" | "body" | "footer")[];
};

22

dist/types/components/editable.d.ts

@@ -8,5 +8,12 @@ export declare const editableTheme: {

transitionDuration: string;
cursor: string;
display: string;
fontSize: string;
fontWeight: string;
textAlign: string;
bg: string;
};
input: {
borderRadius: string;
outline: number;
py: string;

@@ -22,4 +29,9 @@ transitionProperty: string;

};
fontSize: string;
fontWeight: string;
textAlign: string;
bg: string;
};
textarea: {
outline: number;
borderRadius: string;

@@ -36,2 +48,6 @@ py: string;

};
fontSize: string;
fontWeight: string;
textAlign: string;
bg: string;
};

@@ -41,3 +57,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("preview" | "input" | "textarea")[];
keys: ("root" | "preview" | "input" | "textarea")[];
}>;

@@ -47,3 +63,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("preview" | "input" | "textarea")[];
keys: ("root" | "preview" | "input" | "textarea")[];
}>;

@@ -56,3 +72,3 @@ } | undefined;

} | undefined;
parts: ("preview" | "input" | "textarea")[];
parts: ("root" | "preview" | "input" | "textarea")[];
};

19

dist/types/components/list.d.ts
export declare const listTheme: {
baseStyle?: {
root: {
display: string;
flexDirection: string;
};
icon: {

@@ -8,6 +12,15 @@ marginEnd: string;

};
item: {
"--align": string;
display: string;
alignItems: string;
whiteSpace: string;
"&:has(svg)": {
"--align": string;
};
};
} | undefined;
sizes?: {
[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "icon" | "item")[];
keys: ("root" | "item" | "icon")[];
}>;

@@ -17,3 +30,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "icon" | "item")[];
keys: ("root" | "item" | "icon")[];
}>;

@@ -26,3 +39,3 @@ } | undefined;

} | undefined;
parts: ("container" | "icon" | "item")[];
parts: ("root" | "item" | "icon")[];
};

26

dist/types/components/menu.d.ts
export declare const menuTheme: {
baseStyle?: {
button: {
trigger: {
transitionProperty: string;
transitionDuration: string;
display: string;
appearance: string;
alignItems: string;
outline: number;
};
list: {
[x: string]: string | {
content: {
[x: string]: string | number | {
[x: string]: string;
};
outline: number;
_dark: {

@@ -24,2 +29,11 @@ [x: string]: string;

item: {
textDecoration: string;
color: string;
userSelect: string;
display: string;
width: string;
alignItems: string;
textAlign: string;
flex: string;
outline: number;
py: string;

@@ -85,3 +99,3 @@ px: string;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
keys: ("item" | "trigger" | "content" | "icon" | "groupTitle" | "command" | "divider")[];
}>;

@@ -91,3 +105,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
keys: ("item" | "trigger" | "content" | "icon" | "groupTitle" | "command" | "divider")[];
}>;

@@ -100,3 +114,3 @@ } | undefined;

} | undefined;
parts: ("button" | "icon" | "item" | "list" | "groupTitle" | "command" | "divider")[];
parts: ("item" | "trigger" | "content" | "icon" | "groupTitle" | "command" | "divider")[];
};

51

dist/types/components/modal.d.ts
export declare const modalTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
overlay: {
pos: string;
left: string;
top: string;
w: string;
h: string;
bg: string;
zIndex: string;
};
dialogContainer: {
positioner: {
display: string;
width: string;
height: string;
position: string;
left: number;
top: number;
zIndex: string;

@@ -15,6 +25,11 @@ justifyContent: string;

};
dialog: {
[x: string]: string | {
content: {
[x: string]: string | number | {
[x: string]: string;
} | undefined;
display: string;
flexDirection: string;
position: string;
width: string;
outline: number;
borderRadius: string;

@@ -33,2 +48,3 @@ color: string;

header: {
flex: number;
px: string;

@@ -51,2 +67,5 @@ py: string;

footer: {
display: string;
alignItems: string;
justifyContent: string;
px: string;

@@ -58,3 +77,3 @@ py: string;

xs: {
dialog: {
content: {
maxW: string;

@@ -64,3 +83,3 @@ };

sm: {
dialog: {
content: {
maxW: string;

@@ -70,3 +89,3 @@ };

md: {
dialog: {
content: {
maxW: string;

@@ -76,3 +95,3 @@ };

lg: {
dialog: {
content: {
maxW: string;

@@ -82,3 +101,3 @@ };

xl: {
dialog: {
content: {
maxW: string;

@@ -88,3 +107,3 @@ };

"2xl": {
dialog: {
content: {
maxW: string;

@@ -94,3 +113,3 @@ };

"3xl": {
dialog: {
content: {
maxW: string;

@@ -100,3 +119,3 @@ };

"4xl": {
dialog: {
content: {
maxW: string;

@@ -106,3 +125,3 @@ };

"5xl": {
dialog: {
content: {
maxW: string;

@@ -112,3 +131,3 @@ };

"6xl": {
dialog: {
content: {
maxW: string;

@@ -118,3 +137,3 @@ };

full: {
dialog: {
content: {
maxW: string;

@@ -126,3 +145,3 @@ };

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("overlay" | "dialogContainer" | "dialog" | "header" | "closeButton" | "body" | "footer")[];
keys: ("content" | "overlay" | "positioner" | "header" | "closeTrigger" | "body" | "footer")[];
}>;

@@ -135,3 +154,3 @@ } | undefined;

} | undefined;
parts: ("overlay" | "dialogContainer" | "dialog" | "header" | "closeButton" | "body" | "footer")[];
parts: ("content" | "overlay" | "positioner" | "header" | "closeTrigger" | "body" | "footer")[];
};

4

dist/types/components/number-input.d.ts
export declare const numberInputTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
root: {
[x: string]: string;
[x: string]: string | number;
position: string;
zIndex: number;
};

@@ -6,0 +8,0 @@ field: {};

9

dist/types/components/popover.d.ts

@@ -15,2 +15,5 @@ export declare const popoverTheme: {

};
position: string;
display: string;
flexDirection: string;
bg: string;

@@ -55,3 +58,3 @@ _dark: {

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("header" | "closeButton" | "body" | "footer" | "content" | "popper" | "arrow")[];
keys: ("content" | "positioner" | "header" | "closeTrigger" | "body" | "footer" | "arrow")[];
}>;

@@ -61,3 +64,3 @@ } | undefined;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("header" | "closeButton" | "body" | "footer" | "content" | "popper" | "arrow")[];
keys: ("content" | "positioner" | "header" | "closeTrigger" | "body" | "footer" | "arrow")[];
}>;

@@ -70,3 +73,3 @@ } | undefined;

} | undefined;
parts: ("header" | "closeButton" | "body" | "footer" | "content" | "popper" | "arrow")[];
parts: ("content" | "positioner" | "header" | "closeTrigger" | "body" | "footer" | "arrow")[];
};

4

dist/types/components/progress.d.ts
export declare const progressTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
label: {
valueText: {
lineHeight: string;

@@ -11,2 +11,4 @@ fontSize: string;

track: {
overflow: string;
position: string;
bg: string;

@@ -13,0 +15,0 @@ };

26

dist/types/components/radio.d.ts
export declare const radioTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
root: {
display: string;
gap: string;
alignItems: string;
verticalAlign: string;
cursor: string;
position: string;
_disabled: {
cursor: string;
};
} | undefined;
label: {

@@ -9,7 +20,2 @@ userSelect: string;

} | undefined;
container: {
_disabled: {
cursor: string;
};
} | undefined;
control: {

@@ -40,2 +46,7 @@ borderRadius: string;

};
display?: string | undefined;
alignItems?: string | undefined;
justifyContent?: string | undefined;
flexShrink?: number | undefined;
userSelect?: string | undefined;
w?: string | undefined;

@@ -48,2 +59,3 @@ h?: string | undefined;

color?: string | undefined;
verticalAlign?: string | undefined;
_indeterminate?: {

@@ -97,3 +109,3 @@ bg: string;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "label" | "control")[];
keys: ("root" | "label" | "control")[];
}>;

@@ -106,3 +118,3 @@ } | undefined;

} | undefined;
parts: ("container" | "label" | "control")[];
parts: ("root" | "label" | "control")[];
};

19

dist/types/components/select.d.ts
export declare const selectTheme: {
baseStyle?: {
root: {
width: string;
height: string;
position: string;
};
field: {
paddingEnd: string;
appearance: string;

@@ -8,2 +14,5 @@ paddingBottom: string;

bg: string;
_focus: {
zIndex: string;
};
_dark: {

@@ -31,6 +40,12 @@ [x: string]: string;

icon: {
position: string;
display: string;
alignItems: string;
justifyContent: string;
pointerEvents: string;
top: string;
transform: string;
width: string;
height: string;
insetEnd: string;
position: string;
color: string;

@@ -181,3 +196,3 @@ fontSize: string;

} | undefined;
parts: ("icon" | "field")[];
parts: ("root" | "icon" | "field")[];
};

12

dist/types/components/slider.d.ts
export declare const sliderTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
container: {
root: {
h: string;

@@ -178,3 +178,3 @@ w?: undefined;

lg: {
container: {
root: {
[x: string]: string;

@@ -184,3 +184,3 @@ };

md: {
container: {
root: {
[x: string]: string;

@@ -190,3 +190,3 @@ };

sm: {
container: {
root: {
[x: string]: string;

@@ -198,3 +198,3 @@ };

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "track" | "filledTrack" | "thumb" | "mark")[];
keys: ("root" | "track" | "filledTrack" | "thumb" | "mark")[];
}>;

@@ -207,3 +207,3 @@ } | undefined;

} | undefined;
parts: ("container" | "track" | "filledTrack" | "thumb" | "mark")[];
parts: ("root" | "track" | "filledTrack" | "thumb" | "mark")[];
};

9

dist/types/components/stat.d.ts
export declare const statTheme: {
baseStyle?: {
container: {};
root: {
position: string;
flex: string;
};
label: {

@@ -37,3 +40,3 @@ fontWeight: string;

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("number" | "container" | "icon" | "label" | "helpText")[];
keys: ("number" | "root" | "icon" | "label" | "helpText")[];
}>;

@@ -46,3 +49,3 @@ } | undefined;

} | undefined;
parts: ("number" | "container" | "icon" | "label" | "helpText")[];
parts: ("number" | "root" | "icon" | "label" | "helpText")[];
};

29

dist/types/components/switch.d.ts
export declare const switchTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
container: {
[x: string]: string | {
root: {
[x: string]: string | number | {
[x: string]: string;
};
display: string;
position: string;
verticalAlign: string;
lineHeight: number;
_rtl: {

@@ -12,3 +16,3 @@ [x: string]: string;

track: {
[x: string]: string | string[] | {
[x: string]: string | number | string[] | {
[x: string]: string;

@@ -40,2 +44,8 @@ boxShadow?: undefined;

};
display: string;
gap: string;
flexShrink: number;
justifyContent: string;
boxSizing: string;
cursor: string;
borderRadius: string;

@@ -78,6 +88,9 @@ p: string;

};
label: {
userSelect: string;
};
}) | undefined;
sizes?: {
sm: {
container: {
root: {
[x: string]: string;

@@ -87,3 +100,3 @@ };

md: {
container: {
root: {
[x: string]: string;

@@ -93,3 +106,3 @@ };

lg: {
container: {
root: {
[x: string]: string;

@@ -101,3 +114,3 @@ };

[key: string]: import("@chakra-ui/styled-system").PartsStyleInterpolation<{
keys: ("container" | "label" | "track" | "thumb")[];
keys: ("root" | "label" | "track" | "thumb")[];
}>;

@@ -110,3 +123,3 @@ } | undefined;

} | undefined;
parts: ("container" | "label" | "track" | "thumb")[];
parts: ("root" | "label" | "track" | "thumb")[];
};

50

dist/types/components/table.d.ts
export declare const tableTheme: {
baseStyle?: {
table: {
root: {
fontVariantNumeric: string;

@@ -8,3 +8,3 @@ borderCollapse: string;

};
th: {
columnHeader: {
fontFamily: string;

@@ -16,3 +16,3 @@ fontWeight: string;

};
td: {
cell: {
textAlign: string;

@@ -29,3 +29,3 @@ };

sm: {
th: {
columnHeader: {
px: string;

@@ -36,3 +36,3 @@ py: string;

};
td: {
cell: {
px: string;

@@ -50,3 +50,3 @@ py: string;

md: {
th: {
columnHeader: {
px: string;

@@ -57,3 +57,3 @@ py: string;

};
td: {
cell: {
px: string;

@@ -70,3 +70,3 @@ py: string;

lg: {
th: {
columnHeader: {
px: string;

@@ -77,3 +77,3 @@ py: string;

};
td: {
cell: {
px: string;

@@ -92,15 +92,15 @@ py: string;

simple: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
th: {
"&[data-is-numeric=true]": {
columnHeader: {
"&[data-is-numeric]": {
textAlign: string;
};
color: string;
borderBottom: string;
borderBottomWidth: string;
borderColor: string;
};
td: {
"&[data-is-numeric=true]": {
cell: {
"&[data-is-numeric]": {
textAlign: string;
};
borderBottom: string;
borderBottomWidth: string;
borderColor: string;

@@ -111,3 +111,3 @@ };

};
tfoot: {
footer: {
tr: {

@@ -123,15 +123,15 @@ "&:last-of-type": {

striped: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
th: {
"&[data-is-numeric=true]": {
columnHeader: {
"&[data-is-numeric]": {
textAlign: string;
};
color: string;
borderBottom: string;
borderBottomWidth: string;
borderColor: string;
};
td: {
"&[data-is-numeric=true]": {
cell: {
"&[data-is-numeric]": {
textAlign: string;
};
borderBottom: string;
borderBottomWidth: string;
borderColor: string;

@@ -142,3 +142,3 @@ };

};
tbody: {
body: {
tr: {

@@ -156,3 +156,3 @@ "&:nth-of-type(odd)": {

};
tfoot: {
footer: {
tr: {

@@ -174,3 +174,3 @@ "&:last-of-type": {

} | undefined;
parts: ("table" | "thead" | "tbody" | "tr" | "th" | "td" | "tfoot" | "caption")[];
parts: ("root" | "header" | "body" | "footer" | "row" | "columnHeader" | "cell" | "caption")[];
};

40

dist/types/components/tabs.d.ts
export declare const tabsTheme: {
baseStyle?: ((props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
root: {
position: string;
display: string;
};
tab: {
trigger: {
outline: string;
display: string;
alignItems: string;
justifyContent: string;
flex: number | undefined;

@@ -19,13 +24,18 @@ transitionProperty: string;

};
tablist: {
list: {
display: string;
justifyContent: string;
flexDirection: string;
};
tabpanel: {
content: {
p: number;
outline: string;
};
contentGroup: {
width: string;
};
}) | undefined;
sizes?: {
sm: {
tab: {
trigger: {
py: number;

@@ -37,3 +47,3 @@ px: number;

md: {
tab: {
trigger: {
fontSize: string;

@@ -45,3 +55,3 @@ py: number;

lg: {
tab: {
trigger: {
fontSize: string;

@@ -55,7 +65,7 @@ py: number;

line: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
tablist: {
list: {
[x: string]: string;
borderColor: string;
};
tab: {
trigger: {
[x: string]: string | {

@@ -114,3 +124,3 @@ [x: string]: string | {

enclosed: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
tab: {
trigger: {
[x: string]: string | {

@@ -142,3 +152,3 @@ [x: string]: string | {

};
tablist: {
list: {
mb: string;

@@ -150,3 +160,3 @@ borderBottom: string;

"enclosed-colored": (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
tab: {
trigger: {
[x: string]: string | {

@@ -200,3 +210,3 @@ [x: string]: string;

};
tablist: {
list: {
mb: string;

@@ -208,3 +218,3 @@ borderBottom: string;

"soft-rounded": (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
tab: {
trigger: {
borderRadius: string;

@@ -220,3 +230,3 @@ fontWeight: string;

"solid-rounded": (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
tab: {
trigger: {
[x: string]: string | {

@@ -257,3 +267,3 @@ [x: string]: string;

} | undefined;
parts: ("root" | "tab" | "tablist" | "tabpanel" | "tabpanels" | "indicator")[];
parts: ("root" | "trigger" | "content" | "list" | "contentGroup" | "indicator")[];
};

29

dist/types/components/tag.d.ts
export declare const tagTheme: {
baseStyle?: {
container: {
root: {
[x: string]: string | number | {

@@ -10,2 +10,7 @@ [x: string]: string;

outline: number;
display: string;
verticalAlign: string;
gap: string;
alignItems: string;
maxWidth: string;
color: string;

@@ -27,3 +32,7 @@ bg: string;

};
closeButton: {
closeTrigger: {
display: string;
alignItems: string;
justifyContent: string;
outline: string;
fontSize: string;

@@ -55,6 +64,6 @@ w: string;

sm: {
container: {
root: {
[x: string]: string;
};
closeButton: {
closeTrigger: {
marginEnd: string;

@@ -65,3 +74,3 @@ marginStart: string;

md: {
container: {
root: {
[x: string]: string;

@@ -71,3 +80,3 @@ };

lg: {
container: {
root: {
[x: string]: string;

@@ -79,3 +88,3 @@ };

subtle: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -90,3 +99,3 @@ [x: string]: string;

solid: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -101,3 +110,3 @@ [x: string]: string;

outline: (props: import("@chakra-ui/styled-system").StyleFunctionProps) => {
container: {
root: {
[x: string]: string | {

@@ -117,3 +126,3 @@ [x: string]: string;

} | undefined;
parts: ("container" | "label" | "closeButton")[];
parts: ("root" | "label" | "closeTrigger")[];
};

12

package.json
{
"name": "@chakra-ui/theme",
"version": "0.0.0-dev-20240219165930",
"version": "0.0.0-dev-20240224205404",
"description": "The default theme for chakra components",

@@ -33,12 +33,12 @@ "keywords": [

"dependencies": {
"@chakra-ui/anatomy": "2.2.2",
"@chakra-ui/theme-tools": "2.1.2",
"@chakra-ui/utils": "2.0.15"
"@chakra-ui/anatomy": "0.0.0-dev-20240224205404",
"@chakra-ui/theme-tools": "0.0.0-dev-20240224205404",
"@chakra-ui/utils": "0.0.0-dev-20240224205404"
},
"peerDependencies": {
"@chakra-ui/styled-system": "0.0.0-dev-20240219165930"
"@chakra-ui/styled-system": "0.0.0-dev-20240224205404"
},
"devDependencies": {
"@chakra-ui/cli": "2.4.1",
"@chakra-ui/styled-system": "0.0.0-dev-20240219165930"
"@chakra-ui/styled-system": "0.0.0-dev-20240224205404"
},

@@ -45,0 +45,0 @@ "exports": {

dist/cjs/components/form-control.cjs
dist/esm/components/form-control.mjs
dist/types/components/form-control.d.ts
dist/cjs/components/accordion.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/alert.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/avatar.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/breadcrumb.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/button.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/card.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/checkbox.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/close-button.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/drawer.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/editable.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/index.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/list.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/menu.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/modal.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/number-input.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/popover.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/progress.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/radio.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/select.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/slider.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/stat.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/switch.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/table.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/tabs.cjs

Sorry, the diff of this file is not supported yet

dist/cjs/components/tag.cjs

Sorry, the diff of this file is not supported yet

dist/esm/components/accordion.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/alert.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/avatar.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/breadcrumb.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/button.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/card.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/checkbox.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/close-button.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/drawer.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/editable.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/index.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/list.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/menu.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/modal.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/number-input.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/popover.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/progress.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/radio.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/select.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/slider.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/stat.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/switch.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/table.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/tabs.mjs

Sorry, the diff of this file is not supported yet

dist/esm/components/tag.mjs

Sorry, the diff of this file is not supported yet

dist/types/components/index.d.ts

Sorry, the diff of this file is too big to display

dist/types/index.d.mts

Sorry, the diff of this file is not supported yet

dist/types/index.d.ts

Sorry, the diff of this file is too big to display

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

About

Packages

npm

Go

Maven

PyPI

Rubygems

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc