@blockscout/ui-toolkit
Version:
A comprehensive collection of reusable Chakra UI components and theme system for Blockscout's projects
67 lines (66 loc) • 2.18 kB
TypeScript
export declare const recipe: import('@chakra-ui/react').SlotRecipeDefinition<"input", {
size: {
md: {
input: {
boxSize: number;
borderRadius: "base";
};
};
};
variant: {
outline: {
input: {
bg: "input.bg";
borderWidth: "2px";
borderColor: "input.border.filled";
focusVisibleRing: "none";
_placeholder: {
color: "input.placeholder";
};
_placeholderShown: {
borderColor: "input.border";
overflow: "hidden";
textOverflow: "ellipsis";
whiteSpace: "nowrap";
_invalid: {
borderColor: "input.border.error";
};
};
_hover: {
borderColor: "input.border.hover";
};
_focus: {
borderColor: "input.border.focus";
boxShadow: "size.md";
_hover: {
borderColor: "input.border.focus";
};
};
_readOnly: {
userSelect: "all";
pointerEvents: "none";
bg: "input.bg.readOnly";
borderColor: "input.border.readOnly";
_focus: {
borderColor: "input.border.readOnly";
};
_hover: {
borderColor: "input.border.readOnly";
};
};
_disabled: {
opacity: "control.disabled";
};
_invalid: {
borderColor: "input.border.error";
_placeholder: {
color: "input.placeholder.error";
};
_hover: {
borderColor: "input.border.error";
};
};
};
};
};
}>;