81 lines
2.5 KiB
JavaScript
81 lines
2.5 KiB
JavaScript
'use client';
|
|
"use strict";
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
function _export(target, all) {
|
|
for(var name in all)Object.defineProperty(target, name, {
|
|
enumerable: true,
|
|
get: all[name]
|
|
});
|
|
}
|
|
_export(exports, {
|
|
emptySwatchClassNames: function() {
|
|
return emptySwatchClassNames;
|
|
},
|
|
useEmptySwatchStyles_unstable: function() {
|
|
return useEmptySwatchStyles_unstable;
|
|
}
|
|
});
|
|
const _react = require("@griffel/react");
|
|
const _reacttheme = require("@fluentui/react-theme");
|
|
const _reacttabster = require("@fluentui/react-tabster");
|
|
const emptySwatchClassNames = {
|
|
root: 'fui-EmptySwatch'
|
|
};
|
|
/**
|
|
* Styles for the root slot
|
|
*/ const useStyles = (0, _react.makeResetStyles)({
|
|
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
|
border: `1px dashed ${_reacttheme.tokens.colorNeutralForeground4}`
|
|
});
|
|
const useSizeStyles = (0, _react.makeStyles)({
|
|
'extra-small': {
|
|
width: '20px',
|
|
height: '20px'
|
|
},
|
|
small: {
|
|
width: '24px',
|
|
height: '24px'
|
|
},
|
|
medium: {
|
|
width: '28px',
|
|
height: '28px'
|
|
},
|
|
large: {
|
|
width: '32px',
|
|
height: '32px'
|
|
}
|
|
});
|
|
const useShapeStyles = (0, _react.makeStyles)({
|
|
rounded: {
|
|
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
|
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
|
borderRadius: _reacttheme.tokens.borderRadiusMedium
|
|
})
|
|
},
|
|
circular: {
|
|
borderRadius: _reacttheme.tokens.borderRadiusCircular,
|
|
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
|
borderRadius: _reacttheme.tokens.borderRadiusCircular
|
|
})
|
|
},
|
|
square: {
|
|
borderRadius: _reacttheme.tokens.borderRadiusNone,
|
|
...(0, _reacttabster.createCustomFocusIndicatorStyle)({
|
|
borderRadius: _reacttheme.tokens.borderRadiusNone
|
|
})
|
|
}
|
|
});
|
|
const useEmptySwatchStyles_unstable = (state)=>{
|
|
'use no memo';
|
|
const styles = useStyles();
|
|
const sizeStyles = useSizeStyles();
|
|
const shapeStyles = useShapeStyles();
|
|
var _state_size;
|
|
const size = (_state_size = state.size) !== null && _state_size !== void 0 ? _state_size : 'medium';
|
|
var _state_shape;
|
|
state.root.className = (0, _react.mergeClasses)(emptySwatchClassNames.root, styles, sizeStyles[size], shapeStyles[(_state_shape = state.shape) !== null && _state_shape !== void 0 ? _state_shape : 'square'], state.root.className);
|
|
return state;
|
|
};
|