@hitachivantara/uikit-react-core
Version:
UI Kit Core React components.
58 lines (57 loc) • 1.57 kB
JavaScript
import { outlineStyles } from "../../utils/focusUtils.js";
import { theme } from "@hitachivantara/uikit-styles";
import { createClasses } from "@hitachivantara/uikit-react-utils";
//#region src/FileUploader/DropZone/DropZone.styles.tsx
var { staticClasses, useClasses } = createClasses("HvDropZone", {
dropZoneContainer: {
position: "relative",
width: "100%",
display: "flex",
border: `1px dashed ${theme.colors.textDisabled}`,
cursor: "pointer",
backgroundColor: theme.colors.bgContainer,
borderRadius: theme.radii.round,
"&:hover": { borderColor: theme.colors.text },
"&:focus-within": {
borderColor: theme.colors.text,
...outlineStyles
}
},
dropZoneLabelsGroup: { "& p:nth-of-type(2)": { marginLeft: "auto" } },
dragAction: {
backgroundColor: theme.colors.bgContainer,
borderColor: theme.colors.primary
},
dropZoneContainerDisabled: {
color: theme.colors.textDisabled,
backgroundColor: theme.colors.bgDisabled,
borderColor: "currentcolor",
cursor: "not-allowed",
"&:hover": { borderColor: "currentcolor" }
},
inputArea: {
opacity: 0,
width: "100%",
position: "absolute",
height: "100%",
cursor: "pointer",
"&:disabled": { cursor: "not-allowed" }
},
dropArea: {
display: "flex",
margin: theme.spacing("md", "auto"),
gap: theme.space.xs,
minHeight: 48
},
dropZoneAreaLabels: {
display: "flex",
maxWidth: 120,
margin: "auto"
},
dropZoneAreaIcon: {},
dropZoneLabel: {},
dragText: {},
selectFilesText: { fontWeight: theme.typography.label.fontWeight }
});
//#endregion
export { useClasses };