@hitachivantara/uikit-react-core
Version:
Core React components for the NEXT Design System.
71 lines (70 loc) • 1.96 kB
JavaScript
"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const uikitReactUtils = require("@hitachivantara/uikit-react-utils");
const uikitStyles = require("@hitachivantara/uikit-styles");
const focusUtils = require("../../utils/focusUtils.cjs");
const { staticClasses, useClasses } = uikitReactUtils.createClasses("HvDropZone", {
dropZoneContainer: {
position: "relative",
width: "100%",
display: "flex",
border: `1px dashed ${uikitStyles.theme.colors.textDisabled}`,
cursor: "pointer",
backgroundColor: uikitStyles.theme.colors.bgContainer,
borderRadius: uikitStyles.theme.radii.round,
"&:hover": {
borderColor: uikitStyles.theme.colors.text
},
"&:focus-within": {
borderColor: uikitStyles.theme.colors.text,
...focusUtils.outlineStyles
}
},
dropZoneLabelsGroup: {
"& p:nth-of-type(2)": {
marginLeft: "auto"
}
},
dragAction: {
backgroundColor: uikitStyles.theme.colors.bgContainer,
borderColor: uikitStyles.theme.colors.primary
},
dropZoneContainerDisabled: {
color: uikitStyles.theme.colors.textDisabled,
backgroundColor: uikitStyles.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: uikitStyles.theme.spacing("md", "auto"),
gap: uikitStyles.theme.space.xs,
minHeight: 48
},
dropZoneAreaLabels: {
display: "flex",
maxWidth: 120,
margin: "auto"
},
dropZoneAreaIcon: {},
dropZoneLabel: {},
dragText: {},
selectFilesText: {
fontWeight: uikitStyles.theme.typography.label.fontWeight
}
});
exports.staticClasses = staticClasses;
exports.useClasses = useClasses;