@digital-ai/dot-components 2.24.0 → 2.24.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/index.esm.js +12 -16
- package/package.json +1 -1
- package/src/lib/components/css-grid/CssCell.d.ts +2 -3
package/index.esm.js
CHANGED
|
@@ -2742,8 +2742,9 @@ const StyledIconButton = styled(IconButton).withConfig({
|
|
|
2742
2742
|
displayName: "IconButtonstyles__StyledIconButton",
|
|
2743
2743
|
componentId: "eko0kb-0"
|
|
2744
2744
|
})(["", ""], ({
|
|
2745
|
-
theme
|
|
2746
|
-
|
|
2745
|
+
theme,
|
|
2746
|
+
color
|
|
2747
|
+
}) => css(["&.", "{", " ", " font-size:inherit;padding:10px;&:hover{background-color:", ";}&:active{background-color:", ";}&:focus{background-color:", ";}&.Mui-disabled .dot-icon{color:", ";}&.ripple-disabled{&:hover,&:focus{background:", ";}}&.shape-square{border-radius:4px;border:1px solid ", ";padding:", ";&:active{background:", ";}}.dot-icon{color:inherit;}.dot-icon.MuiIcon-fontSizeSmall{padding:1px;}&.MuiIconButton-sizeSmall{padding:3px;}"], rootClassName$U, color === 'inherit' ? css(["color:inherit;"]) : '', color === 'default' ? css(["color:", ";"], theme.palette.figma.icon.black) : '', theme.palette.figma.neutral.elevated, theme.palette.figma.neutral.ripple, theme.palette.figma.neutral.active, theme.palette.figma.icon.disabled, theme.palette.figma.neutral.elevated, theme.palette.figma.border.defaultButton, theme.spacing(1), theme.palette.figma.toggleTabs.bckg));
|
|
2747
2748
|
|
|
2748
2749
|
const DotIconButton = ({
|
|
2749
2750
|
ariaLabel,
|
|
@@ -4323,7 +4324,7 @@ const StyledSidebar = styled.aside.withConfig({
|
|
|
4323
4324
|
componentId: "l3atb4-0"
|
|
4324
4325
|
})(["", ""], ({
|
|
4325
4326
|
theme
|
|
4326
|
-
}) => css(["&.", "{align-items:stretch;background:", ";border-width:0 1px;border-style:solid;border-color:", ";box-sizing:border-box;color:", ";display:flex;height:100%;flex-direction:column;justify-content:space-between;letter-spacing:0.01em;-o-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;-moz-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;-webkit-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;header{align-items:center;border-bottom:1px solid;border-bottom-color:", ";display:flex;height:40px;flex-shrink:0;overflow:hidden;padding:", ";white-space:nowrap;&.app-logo{box-sizing:border-box;.dot-app-logo{svg,img{max-width:100%;}}}.dot-avatar{margin-right:", ";}}.go-back{align-items:center;border-bottom:1px solid;border-bottom-color:", ";display:flex;.go-back-button{
|
|
4327
|
+
}) => css(["&.", "{align-items:stretch;background:", ";border-width:0 1px;border-style:solid;border-color:", ";box-sizing:border-box;color:", ";display:flex;height:100%;flex-direction:column;justify-content:space-between;letter-spacing:0.01em;-o-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;-moz-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;-webkit-transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;transition:width cubic-bezier(0.4,0,0.6,1) 0.3s;header{align-items:center;border-bottom:1px solid;border-bottom-color:", ";display:flex;height:40px;flex-shrink:0;overflow:hidden;padding:", ";white-space:nowrap;&.app-logo{box-sizing:border-box;.dot-app-logo{svg,img{max-width:100%;}}}.dot-avatar{margin-right:", ";}}.go-back{align-items:center;border-bottom:1px solid;border-bottom-color:", ";display:flex;.go-back-button{margin:", ";&:focus-visible{box-shadow:0 0 0 2px ", ",0 0 0 4px ", ";}}.back-button-text{margin-right:", ";}}hr.MuiDivider-root{border-color:", ";margin:", ";}.MuiListSubheader-root{border-bottom:1px solid ", ";margin:", ";.dot-typography{display:block;margin:0;padding:", ";}}ul.side-nav{background:transparent;flex-grow:2;overflow-x:hidden;overflow-y:auto;padding:0;width:auto;.dot-nested-list{background:transparent;}.", "{.dot-drawer-paper{padding:", ";overflow-y:auto;border-right:1px solid ", ";box-shadow:0 0 5px 0 rgba(0,0,0,0.15);background:", ";color:", ";}.MuiTypography-root.MuiTypography-subtitle2{line-height:40px;}}.", "{height:44px;margin:0;padding:0;.dot-typography{margin-left:", ";}.MuiListItemIcon-root{min-width:40px;.dot-icon{margin:0;}}&:before{content:'';position:relative;left:0;top:0;bottom:0;border-radius:0 2px 2px 0;height:24px;width:4px;background-color:transparent;margin-right:", ";}&:hover{background-color:", ";color:", ";.dot-typography,.dot-icon i:before,.MuiListItemIcon-root .dot-icon i:before{color:", ";}}&.Mui-selected{background-color:", ";color:", ";&:before{background-color:", ";}.dot-typography,.MuiListItemIcon-root .dot-icon i:before{color:", ";}}&.Mui-focusVisible{background-color:", ";box-shadow:inset 0 0 0 2px ", ";border:2px solid ", ";}&.open{border:'none';}.dot-list-item-link .dot-icon{margin-right:", ";}.dot-icon{border-radius:50%;display:flex;height:40px;margin:", ";width:40px;}.dot-typography{white-space:nowrap;}}}.toggle-nav{border-top:1px solid ", ";padding:", ";text-align:right;.dot-icon{transform:rotate(0deg);-o-transition:all cubic-bezier(0.4,0,0.2,1) 0.3s;-moz-transition:all cubic-bezier(0.4,0,0.2,1) 0.3s;-webkit-transition:all cubic-bezier(0.4,0,0.2,1) 0.3s;transition:all cubic-bezier(0.4,0,0.2,1) 0.3s;}}.powered-by{border-top:1px solid ", ";color:", ";display:flex;flex-direction:column;flex-shrink:0;font-size:12px;overflow:hidden;padding:", ";p.desc{white-space:nowrap;}.company-name{margin-top:", ";}.d-icon{display:none;}}&.collapsed{overflow:hidden;width:58px;-o-transition:all cubic-bezier(0.4,0,0.6,1) 0.3s;-moz-transition:all cubic-bezier(0.4,0,0.6,1) 0.3s;-webkit-transition:all cubic-bezier(0.4,0,0.6,1) 0.3s;transition:all cubic-bezier(0.4,0,0.6,1) 0.3s;li.MuiListSubheader-root .dot-typography,.go-back .MuiTypography-root,.MuiListItem-divider .dot-list-item-link,.child,.powered-by .company-name,.powered-by p.desc{display:none;}.dot-nested-drawer li.MuiListSubheader-root .dot-typography,.powered-by .d-icon{display:block;}header .dot-app-logo{text-align:center;}ul.side-nav{width:56px;.dot-list-item{margin-left:0;}.toggle-nav{align-self:center;}}.powered-by{align-items:center;}}}"], rootClassName$O, theme.palette.figma.background.level1.white, theme.palette.figma.border.default, theme.palette.figma.typography.black, theme.palette.figma.border.default, theme.spacing(1, 2), theme.spacing(1), theme.palette.figma.border.default, theme.spacing(0.5, 1), theme.palette.figma.icon.white, theme.palette.figma.icon.black, theme.spacing(2.5), theme.palette.figma.border.default, theme.spacing(1, 0), theme.palette.figma.border.default, theme.spacing(0, 0, 1), theme.spacing(1.5, 2), nestedDrawerClassName, theme.spacing(2), theme.palette.figma.border.default, theme.palette.figma.background.level0.componentsBackground, theme.palette.figma.typography.black, listItemRootClass, theme.spacing(1), theme.spacing(1), theme.palette.figma.overlay.table.highlights, theme.palette.figma.toggleTabs.text, theme.palette.figma.toggleTabs.text, theme.palette.figma.overlay.table.highlights, theme.palette.figma.toggleTabs.text, theme.palette.figma.toggleTabs.text, theme.palette.figma.toggleTabs.text, theme.palette.figma.primary.light, theme.palette.figma.background.level0.componentsBackground, theme.palette.figma.primary.normal, theme.spacing(1), theme.spacing(0, 1), theme.palette.figma.border.default, theme.spacing(1), theme.palette.figma.border.default, theme.palette.figma.typography.gray, theme.spacing(1), theme.spacing(1)));
|
|
4327
4328
|
|
|
4328
4329
|
const rootClassName$N = 'dot-truncate-with-tooltip';
|
|
4329
4330
|
const StyledTruncateWithTooltip = styled(Tooltip).withConfig({
|
|
@@ -6241,19 +6242,18 @@ const CssCell = styled(Cell).withConfig({
|
|
|
6241
6242
|
middle: _middle = true,
|
|
6242
6243
|
md,
|
|
6243
6244
|
sm,
|
|
6244
|
-
start,
|
|
6245
6245
|
theme,
|
|
6246
6246
|
top,
|
|
6247
|
-
width,
|
|
6248
6247
|
xl,
|
|
6248
|
+
xxl,
|
|
6249
6249
|
xs
|
|
6250
|
-
}) => css(["height:", ";min-width:0;box-sizing:border-box;", ";", ";
|
|
6250
|
+
}) => css(["height:", ";min-width:0;box-sizing:border-box;", ";", ";grid-row-end:", ";", ";", ";", " ", " ", " ", " ", " ", " grid-column:", ";}"], height ? height : '100%', top && `grid-row-start: ${top}`, _center && `text-align: center`, height && `span ${height}`, area && `grid-area: ${area}`, _middle && `
|
|
6251
6251
|
display: inline-flex;
|
|
6252
6252
|
flex-flow: column wrap;
|
|
6253
6253
|
justify-content: ${_justifyContent};
|
|
6254
6254
|
align-items: ${_alignItems};
|
|
6255
6255
|
justify-self: stretch;
|
|
6256
|
-
`, xs && breakpointsGetter(xs, theme, 'xs'), sm && breakpointsGetter(sm, theme, 'sm'), md && breakpointsGetter(md, theme, 'md'), lg && breakpointsGetter(lg, theme, 'lg'),
|
|
6256
|
+
`, xs && breakpointsGetter(xs, theme, 'xs'), sm && breakpointsGetter(sm, theme, 'sm'), md && breakpointsGetter(md, theme, 'md'), lg && breakpointsGetter(lg, theme, 'lg'), xl && breakpointsGetter(xl, theme, 'xl'), xxl && breakpointsGetter(xxl, theme, 'xxl'), gridColumn));
|
|
6257
6257
|
|
|
6258
6258
|
const gridClassName = 'debug-grid';
|
|
6259
6259
|
const gridClassContainer = 'debug-grid-container';
|
|
@@ -6344,13 +6344,9 @@ const CssGridDebug = ({
|
|
|
6344
6344
|
}), jsx(StyledGridOverlay, {
|
|
6345
6345
|
className: gridClassName,
|
|
6346
6346
|
rows: "minmax(100vh, 100%)",
|
|
6347
|
-
children:
|
|
6348
|
-
|
|
6349
|
-
|
|
6350
|
-
start: i + 1,
|
|
6351
|
-
width: 1
|
|
6352
|
-
}, i);
|
|
6353
|
-
})
|
|
6347
|
+
children: Array.from(Array(columns), (_item, i) => jsx(CssCell, {
|
|
6348
|
+
className: `${cellClassName}`
|
|
6349
|
+
}, i))
|
|
6354
6350
|
})]
|
|
6355
6351
|
});
|
|
6356
6352
|
};
|
|
@@ -10444,7 +10440,7 @@ const StyledPickersDay = styled(PickersDay).withConfig({
|
|
|
10444
10440
|
componentId: "sc-1to4suu-2"
|
|
10445
10441
|
})(["", ""], ({
|
|
10446
10442
|
theme
|
|
10447
|
-
}) => css(["&.", "{border-radius:", ";&.MuiPickersDay-today{background:", ";border:1px solid ", ";}&:hover{background:", ";color:", ";}}"], rectanglePickersDayClassName, theme.spacing(0.5), theme.palette.figma.neutral.normal, theme.palette.figma.primary.normal, theme.palette.figma.primary.normal, theme.palette.figma.typography.white));
|
|
10443
|
+
}) => css(["&.", "{border-radius:", ";&.MuiPickersDay-today:not(.Mui-selected){background:", ";border:1px solid ", ";&:hover{background:", ";}}&:hover{background:", ";color:", ";}}"], rectanglePickersDayClassName, theme.spacing(0.5), theme.palette.figma.neutral.normal, theme.palette.figma.primary.normal, theme.palette.figma.primary.normal, theme.palette.figma.primary.normal, theme.palette.figma.typography.white));
|
|
10448
10444
|
|
|
10449
10445
|
const RectanglePickersDay = pickersDayProps => {
|
|
10450
10446
|
return jsx(StyledPickersDay, Object.assign({}, pickersDayProps, {
|
|
@@ -10725,7 +10721,7 @@ const StyledTimePicker = styled(TimePicker).withConfig({
|
|
|
10725
10721
|
componentId: "sc-17aptuh-1"
|
|
10726
10722
|
})(["", ""], ({
|
|
10727
10723
|
theme
|
|
10728
|
-
}) => css(["&.", "{", ";.Mui-disabled.MuiInputBase-root,&.read-only .MuiInputBase-root{", ";}.MuiFormLabel-root{color:", ";}}"], rootClassName$1, pickerInputStyles(theme), readOnlyStyles(theme), theme.palette.
|
|
10724
|
+
}) => css(["&.", "{", ";.Mui-disabled.MuiInputBase-root,&.read-only .MuiInputBase-root{", ";}.dot-icon-btn .dot-i{margin-top:-5px;}.MuiFormLabel-root{color:", ";}}"], rootClassName$1, pickerInputStyles(theme), readOnlyStyles(theme), theme.palette.figma.typography.black));
|
|
10729
10725
|
|
|
10730
10726
|
dayjs.extend(utc);
|
|
10731
10727
|
const DEFAULT_PICKER_TIME_FORMAT = 'HH:mm';
|
package/package.json
CHANGED
|
@@ -28,15 +28,14 @@ export interface CssCellProps extends CommonProps {
|
|
|
28
28
|
middle?: boolean;
|
|
29
29
|
/** Small column breakpoint */
|
|
30
30
|
sm?: CellSize;
|
|
31
|
-
/** Column start when Cell column breakpoints are not used */
|
|
32
|
-
start?: number | string;
|
|
33
31
|
/** Row start override */
|
|
34
32
|
top?: number | string;
|
|
35
|
-
width?: number;
|
|
36
33
|
/** Extra large column breakpoint */
|
|
37
34
|
xl?: CellSize;
|
|
38
35
|
/** Extra small column breakpoint */
|
|
39
36
|
xs?: CellSize;
|
|
37
|
+
/** Extra, extra large column breakpoint */
|
|
38
|
+
xxl?: CellSize;
|
|
40
39
|
}
|
|
41
40
|
export declare const Cell: ({ children, className }: CssCellProps) => import("react/jsx-runtime").JSX.Element;
|
|
42
41
|
export declare const CssCell: import("styled-components").StyledComponent<({ children, className }: CssCellProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
|