@aglyn/shared-ui-jsx 1.0.0-beta.143
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/LICENSE +201 -0
- package/README.md +7 -0
- package/package.json +63 -0
- package/src/index.d.ts +48 -0
- package/src/index.js +179 -0
- package/src/index.js.map +1 -0
- package/src/lib/components/aglyn-text.d.ts +86 -0
- package/src/lib/components/aglyn-text.js +44 -0
- package/src/lib/components/aglyn-text.js.map +1 -0
- package/src/lib/components/app-link.d.ts +74 -0
- package/src/lib/components/app-link.js +139 -0
- package/src/lib/components/app-link.js.map +1 -0
- package/src/lib/components/aspect-ratio.d.ts +59 -0
- package/src/lib/components/aspect-ratio.js +153 -0
- package/src/lib/components/aspect-ratio.js.map +1 -0
- package/src/lib/components/background-image.component.d.ts +30 -0
- package/src/lib/components/background-image.component.js +42 -0
- package/src/lib/components/background-image.component.js.map +1 -0
- package/src/lib/components/card-columns.d.ts +86 -0
- package/src/lib/components/card-columns.js +148 -0
- package/src/lib/components/card-columns.js.map +1 -0
- package/src/lib/components/card-display.d.ts +36 -0
- package/src/lib/components/card-display.js +158 -0
- package/src/lib/components/card-display.js.map +1 -0
- package/src/lib/components/card-list-item.d.ts +35 -0
- package/src/lib/components/card-list-item.js +137 -0
- package/src/lib/components/card-list-item.js.map +1 -0
- package/src/lib/components/children-function-prop.d.ts +25 -0
- package/src/lib/components/children-function-prop.js +29 -0
- package/src/lib/components/children-function-prop.js.map +1 -0
- package/src/lib/components/confirmation-provider.component.d.ts +19 -0
- package/src/lib/components/confirmation-provider.component.js +83 -0
- package/src/lib/components/confirmation-provider.component.js.map +1 -0
- package/src/lib/components/container.d.ts +25 -0
- package/src/lib/components/container.js +62 -0
- package/src/lib/components/container.js.map +1 -0
- package/src/lib/components/data-table.component.d.ts +54 -0
- package/src/lib/components/data-table.component.js +211 -0
- package/src/lib/components/data-table.component.js.map +1 -0
- package/src/lib/components/dialog-confirm.d.ts +36 -0
- package/src/lib/components/dialog-confirm.js +74 -0
- package/src/lib/components/dialog-confirm.js.map +1 -0
- package/src/lib/components/ellipsis-pulse.component.d.ts +22 -0
- package/src/lib/components/ellipsis-pulse.component.js +51 -0
- package/src/lib/components/ellipsis-pulse.component.js.map +1 -0
- package/src/lib/components/emotion-cache-provider.d.ts +31 -0
- package/src/lib/components/emotion-cache-provider.js +40 -0
- package/src/lib/components/emotion-cache-provider.js.map +1 -0
- package/src/lib/components/empty-state.component.d.ts +63 -0
- package/src/lib/components/empty-state.component.js +214 -0
- package/src/lib/components/empty-state.component.js.map +1 -0
- package/src/lib/components/error-boundary.component.d.ts +28 -0
- package/src/lib/components/error-boundary.component.js +86 -0
- package/src/lib/components/error-boundary.component.js.map +1 -0
- package/src/lib/components/grid-buttons.d.ts +26 -0
- package/src/lib/components/grid-buttons.js +45 -0
- package/src/lib/components/grid-buttons.js.map +1 -0
- package/src/lib/components/grid-items.d.ts +103 -0
- package/src/lib/components/grid-items.js +336 -0
- package/src/lib/components/grid-items.js.map +1 -0
- package/src/lib/components/grid-list.d.ts +37 -0
- package/src/lib/components/grid-list.js +156 -0
- package/src/lib/components/grid-list.js.map +1 -0
- package/src/lib/components/help-tip.component.d.ts +30 -0
- package/src/lib/components/help-tip.component.js +139 -0
- package/src/lib/components/help-tip.component.js.map +1 -0
- package/src/lib/components/link-navigation-reporter.d.ts +24 -0
- package/src/lib/components/link-navigation-reporter.js +64 -0
- package/src/lib/components/link-navigation-reporter.js.map +1 -0
- package/src/lib/components/list-pagination.component.d.ts +57 -0
- package/src/lib/components/list-pagination.component.js +90 -0
- package/src/lib/components/list-pagination.component.js.map +1 -0
- package/src/lib/components/list-table.component.d.ts +155 -0
- package/src/lib/components/list-table.component.js +369 -0
- package/src/lib/components/list-table.component.js.map +1 -0
- package/src/lib/components/loading-layout-app.component.d.ts +35 -0
- package/src/lib/components/loading-layout-app.component.js +42 -0
- package/src/lib/components/loading-layout-app.component.js.map +1 -0
- package/src/lib/components/loading-modal-overlay.d.ts +30 -0
- package/src/lib/components/loading-modal-overlay.js +156 -0
- package/src/lib/components/loading-modal-overlay.js.map +1 -0
- package/src/lib/components/loading-modal.d.ts +19 -0
- package/src/lib/components/loading-modal.js +113 -0
- package/src/lib/components/loading-modal.js.map +1 -0
- package/src/lib/components/loading-text.component.d.ts +21 -0
- package/src/lib/components/loading-text.component.js +40 -0
- package/src/lib/components/loading-text.component.js.map +1 -0
- package/src/lib/components/mdi-icon/index.d.ts +2 -0
- package/src/lib/components/mdi-icon/index.js +4 -0
- package/src/lib/components/mdi-icon/index.js.map +1 -0
- package/src/lib/components/mdi-icon/md-icon-stack.d.ts +31 -0
- package/src/lib/components/mdi-icon/md-icon-stack.js +101 -0
- package/src/lib/components/mdi-icon/md-icon-stack.js.map +1 -0
- package/src/lib/components/mdi-icon/md-icon.d.ts +32 -0
- package/src/lib/components/mdi-icon/md-icon.js +147 -0
- package/src/lib/components/mdi-icon/md-icon.js.map +1 -0
- package/src/lib/components/mdi-icon/mdi-icon-from-id.d.ts +23 -0
- package/src/lib/components/mdi-icon/mdi-icon-from-id.js +35 -0
- package/src/lib/components/mdi-icon/mdi-icon-from-id.js.map +1 -0
- package/src/lib/components/mdi-icon/mdi-icon.d.ts +24 -0
- package/src/lib/components/mdi-icon/mdi-icon.js +46 -0
- package/src/lib/components/mdi-icon/mdi-icon.js.map +1 -0
- package/src/lib/components/measured-figures.component.d.ts +64 -0
- package/src/lib/components/measured-figures.component.js +161 -0
- package/src/lib/components/measured-figures.component.js.map +1 -0
- package/src/lib/components/menu.d.ts +45 -0
- package/src/lib/components/menu.js +229 -0
- package/src/lib/components/menu.js.map +1 -0
- package/src/lib/components/mui-shadow-dom.d.ts +38 -0
- package/src/lib/components/mui-shadow-dom.js +161 -0
- package/src/lib/components/mui-shadow-dom.js.map +1 -0
- package/src/lib/components/navigation-drawer.component.d.ts +31 -0
- package/src/lib/components/navigation-drawer.component.js +76 -0
- package/src/lib/components/navigation-drawer.component.js.map +1 -0
- package/src/lib/components/navigation-intent.d.ts +18 -0
- package/src/lib/components/navigation-intent.js +56 -0
- package/src/lib/components/navigation-intent.js.map +1 -0
- package/src/lib/components/navigation-view/index.d.ts +18 -0
- package/src/lib/components/navigation-view/index.js +19 -0
- package/src/lib/components/navigation-view/index.js.map +1 -0
- package/src/lib/components/navigation-view/navigation-view.d.ts +35 -0
- package/src/lib/components/navigation-view/navigation-view.js +175 -0
- package/src/lib/components/navigation-view/navigation-view.js.map +1 -0
- package/src/lib/components/next-link.d.ts +27 -0
- package/src/lib/components/next-link.js +88 -0
- package/src/lib/components/next-link.js.map +1 -0
- package/src/lib/components/popper-styled.component.d.ts +25 -0
- package/src/lib/components/popper-styled.component.js +129 -0
- package/src/lib/components/popper-styled.component.js.map +1 -0
- package/src/lib/components/quota-readout.component.d.ts +69 -0
- package/src/lib/components/quota-readout.component.js +52 -0
- package/src/lib/components/quota-readout.component.js.map +1 -0
- package/src/lib/components/resizeable-stack.d.ts +4 -0
- package/src/lib/components/resizeable-stack.js +23 -0
- package/src/lib/components/resizeable-stack.js.map +1 -0
- package/src/lib/components/row-actions-menu.component.d.ts +53 -0
- package/src/lib/components/row-actions-menu.component.js +132 -0
- package/src/lib/components/row-actions-menu.component.js.map +1 -0
- package/src/lib/components/ruler-guides.component.d.ts +35 -0
- package/src/lib/components/ruler-guides.component.js +166 -0
- package/src/lib/components/ruler-guides.component.js.map +1 -0
- package/src/lib/components/sandbox-frame.d.ts +42 -0
- package/src/lib/components/sandbox-frame.js +122 -0
- package/src/lib/components/sandbox-frame.js.map +1 -0
- package/src/lib/components/scroll-reaction.d.ts +59 -0
- package/src/lib/components/scroll-reaction.js +43 -0
- package/src/lib/components/scroll-reaction.js.map +1 -0
- package/src/lib/components/scroll-table.component.d.ts +124 -0
- package/src/lib/components/scroll-table.component.js +103 -0
- package/src/lib/components/scroll-table.component.js.map +1 -0
- package/src/lib/components/shadow-dom/index.d.ts +18 -0
- package/src/lib/components/shadow-dom/index.js +19 -0
- package/src/lib/components/shadow-dom/index.js.map +1 -0
- package/src/lib/components/shadow-dom/shadow-dom.d.ts +42 -0
- package/src/lib/components/shadow-dom/shadow-dom.js +123 -0
- package/src/lib/components/shadow-dom/shadow-dom.js.map +1 -0
- package/src/lib/components/splash-screen.d.ts +33 -0
- package/src/lib/components/splash-screen.js +105 -0
- package/src/lib/components/splash-screen.js.map +1 -0
- package/src/lib/components/sr-only.d.ts +20 -0
- package/src/lib/components/sr-only.js +25 -0
- package/src/lib/components/sr-only.js.map +1 -0
- package/src/lib/components/status-screen-plain.component.d.ts +27 -0
- package/src/lib/components/status-screen-plain.component.js +178 -0
- package/src/lib/components/status-screen-plain.component.js.map +1 -0
- package/src/lib/components/usage-meter.component.d.ts +30 -0
- package/src/lib/components/usage-meter.component.js +92 -0
- package/src/lib/components/usage-meter.component.js.map +1 -0
- package/src/lib/components/variable-text-field.component.d.ts +50 -0
- package/src/lib/components/variable-text-field.component.js +188 -0
- package/src/lib/components/variable-text-field.component.js.map +1 -0
- package/src/lib/components/zoomable-panning-component/index.d.ts +1 -0
- package/src/lib/components/zoomable-panning-component/index.js +3 -0
- package/src/lib/components/zoomable-panning-component/index.js.map +1 -0
- package/src/lib/components/zoomable-panning-component/util.d.ts +58 -0
- package/src/lib/components/zoomable-panning-component/util.js +114 -0
- package/src/lib/components/zoomable-panning-component/util.js.map +1 -0
- package/src/lib/components/zoomable-panning-component/zoomable-panning-component.d.ts +132 -0
- package/src/lib/components/zoomable-panning-component/zoomable-panning-component.js +728 -0
- package/src/lib/components/zoomable-panning-component/zoomable-panning-component.js.map +1 -0
- package/src/lib/const/aglyn-besigner-logo-full.d.ts +39 -0
- package/src/lib/const/aglyn-besigner-logo-full.js +146 -0
- package/src/lib/const/aglyn-besigner-logo-full.js.map +1 -0
- package/src/lib/const/aglyn-console-logo-full.d.ts +34 -0
- package/src/lib/const/aglyn-console-logo-full.js +142 -0
- package/src/lib/const/aglyn-console-logo-full.js.map +1 -0
- package/src/lib/const/aglyn-logo-class-keys.d.ts +30 -0
- package/src/lib/const/aglyn-logo-class-keys.js +32 -0
- package/src/lib/const/aglyn-logo-class-keys.js.map +1 -0
- package/src/lib/const/aglyn-logo-full.d.ts +29 -0
- package/src/lib/const/aglyn-logo-full.js +111 -0
- package/src/lib/const/aglyn-logo-full.js.map +1 -0
- package/src/lib/const/list-filter.d.ts +260 -0
- package/src/lib/const/list-filter.js +409 -0
- package/src/lib/const/list-filter.js.map +1 -0
- package/src/lib/const/prebuilt-components.d.ts +17 -0
- package/src/lib/const/prebuilt-components.js +22 -0
- package/src/lib/const/prebuilt-components.js.map +1 -0
- package/src/lib/const/svg-icons.d.ts +75 -0
- package/src/lib/const/svg-icons.js +313 -0
- package/src/lib/const/svg-icons.js.map +1 -0
- package/src/lib/const/table-pagination.d.ts +106 -0
- package/src/lib/const/table-pagination.js +106 -0
- package/src/lib/const/table-pagination.js.map +1 -0
- package/src/lib/contexts/confirmation.context.d.ts +996 -0
- package/src/lib/contexts/confirmation.context.js +49 -0
- package/src/lib/contexts/confirmation.context.js.map +1 -0
- package/src/lib/contexts/loading.context.d.ts +93 -0
- package/src/lib/contexts/loading.context.js +126 -0
- package/src/lib/contexts/loading.context.js.map +1 -0
- package/src/lib/hocs/create-hoc-with-context-consumer.d.ts +36 -0
- package/src/lib/hocs/create-hoc-with-context-consumer.js +44 -0
- package/src/lib/hocs/create-hoc-with-context-consumer.js.map +1 -0
- package/src/lib/hocs/with-hoc.d.ts +32 -0
- package/src/lib/hocs/with-hoc.js +37 -0
- package/src/lib/hocs/with-hoc.js.map +1 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icon.d.ts +20 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icon.js +48 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icon.js.map +1 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons-fuzzy.d.ts +26 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons-fuzzy.js +73 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons-fuzzy.js.map +1 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons.d.ts +19 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons.js +49 -0
- package/src/lib/hooks/mdi-icon/use-mdi-icons.js.map +1 -0
- package/src/lib/hooks/router-events.d.ts +56 -0
- package/src/lib/hooks/router-events.js +88 -0
- package/src/lib/hooks/router-events.js.map +1 -0
- package/src/lib/hooks/use-async-effect.d.ts +24 -0
- package/src/lib/hooks/use-async-effect.js +44 -0
- package/src/lib/hooks/use-async-effect.js.map +1 -0
- package/src/lib/hooks/use-callback-param-ref.d.ts +19 -0
- package/src/lib/hooks/use-callback-param-ref.js +29 -0
- package/src/lib/hooks/use-callback-param-ref.js.map +1 -0
- package/src/lib/hooks/use-id.d.ts +21 -0
- package/src/lib/hooks/use-id.js +28 -0
- package/src/lib/hooks/use-id.js.map +1 -0
- package/src/lib/hooks/use-isomorphic-layout-effect.d.ts +19 -0
- package/src/lib/hooks/use-isomorphic-layout-effect.js +20 -0
- package/src/lib/hooks/use-isomorphic-layout-effect.js.map +1 -0
- package/src/lib/hooks/use-merge-refs.d.ts +38 -0
- package/src/lib/hooks/use-merge-refs.js +52 -0
- package/src/lib/hooks/use-merge-refs.js.map +1 -0
- package/src/lib/hooks/use-subscribable.d.ts +29 -0
- package/src/lib/hooks/use-subscribable.js +50 -0
- package/src/lib/hooks/use-subscribable.js.map +1 -0
- package/src/lib/types.d.ts +18 -0
- package/src/lib/types.js +18 -0
- package/src/lib/types.js.map +1 -0
- package/src/lib/utils/make-link-elements.d.ts +24 -0
- package/src/lib/utils/make-link-elements.js +32 -0
- package/src/lib/utils/make-link-elements.js.map +1 -0
- package/src/lib/utils/make-meta-elements.d.ts +24 -0
- package/src/lib/utils/make-meta-elements.js +32 -0
- package/src/lib/utils/make-meta-elements.js.map +1 -0
- package/src/lib/utils/scroll-overflow.d.ts +120 -0
- package/src/lib/utils/scroll-overflow.js +115 -0
- package/src/lib/utils/scroll-overflow.js.map +1 -0
- package/src/lib/utils/vendor.d.ts +17 -0
- package/src/lib/utils/vendor.js +18 -0
- package/src/lib/utils/vendor.js.map +1 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/card-list-item.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { generateComponentClassKeys, styled } from '@aglyn/shared-ui-theme'\nimport {\n Box,\n Card as MuiCard,\n type CardActionAreaProps as MuiCardActionAreaProps,\n type CardProps as MuiCardProps,\n Typography,\n type TypographyProps,\n} from '@mui/material'\nimport clsx from 'clsx'\nimport type { ComponentProps } from 'react'\nimport { forwardRef } from 'react'\nimport ChildrenFunctionProp from './children-function-prop'\nimport type { GridListItemData } from './grid-list'\n\nconst cardClasses = generateComponentClassKeys('CardListItem', [\n 'actionArea',\n 'selected',\n 'aspectContainer',\n 'wrapper',\n 'content',\n 'label',\n])\n\nconst CardBox = styled('div')({})\n\nconst Card = styled(MuiCard)(({ theme }) => {\n const tv = (theme as any).vars || theme\n return {\n // The selected treatment used to hang off `.CardListItem-actionArea`, a\n // class this component has never rendered — so `selected` set a class and\n // painted NOTHING, which is why the icon picker read as unresponsive and\n // invited repeat clicking (AGL-2486). It lives on the card itself now,\n // where there is always an element to carry it.\n [`&.${cardClasses.selected}`]: {\n backgroundColor: tv.palette.primary.main,\n color: tv.palette.primary.contrastText,\n outline: `2px solid ${tv.palette.primary.main}`,\n outlineOffset: 1,\n [`.${cardClasses.actionArea}`]: {\n backgroundColor: tv.palette.primary.main,\n color: tv.palette.primary.contrastText,\n },\n },\n [`.${cardClasses.aspectContainer}`]: {\n height: 0,\n position: 'relative',\n paddingTop: `${(3 / 4) * 100}%`, // 16:9\n },\n [`.${cardClasses.wrapper}`]: {\n position: 'absolute',\n left: 0,\n top: 0,\n width: '100%',\n height: '100%',\n },\n [`.${cardClasses.content}`]: {\n width: '100%',\n height: '100%',\n display: 'flex',\n textAlign: 'center',\n alignItems: 'center',\n flexDirection: 'column',\n justifyContent: 'space-evenly',\n padding: 0.5,\n },\n [`.${cardClasses.label}`]: {\n lineHeight: 1.43,\n fontSize: theme.typography.pxToRem(10),\n textTransform: 'uppercase',\n },\n }\n})\n\nexport interface CardListItemProps\n extends Omit<Partial<MuiCardProps>, 'children'> {\n item: GridListItemData\n children?:\n | JSX.Children\n | ((props: { item: GridListItemData; selected: boolean }) => JSX.Children)\n label?: JSX.Children\n selected?: boolean\n CardActionAreaProps?: Partial<MuiCardActionAreaProps>\n WrapperBoxProps?: Partial<ComponentProps<typeof CardBox>>\n ContentBoxProps?: Partial<ComponentProps<typeof CardBox>>\n LabelTypographyProps?: Partial<TypographyProps>\n}\n\nexport const CardListItem = forwardRef<any, CardListItemProps>(\n function RefRenderFn(props, ref) {\n const {\n className,\n children,\n selected,\n item,\n label,\n CardActionAreaProps,\n WrapperBoxProps,\n ContentBoxProps,\n LabelTypographyProps,\n ...rest\n } = props\n\n const isSelected = Boolean(selected)\n\n return (\n <Card\n ref={ref}\n className={clsx({ [cardClasses.selected]: isSelected }, className)}\n {...rest}\n >\n <Box\n className={clsx(\n cardClasses.aspectContainer,\n CardActionAreaProps?.className,\n )}\n >\n <Box\n {...WrapperBoxProps}\n className={clsx(cardClasses.wrapper, WrapperBoxProps?.className)}\n >\n <Box\n {...ContentBoxProps}\n className={clsx(cardClasses.content, ContentBoxProps?.className)}\n >\n <ChildrenFunctionProp\n childrenProp={children}\n args={{ item, selected: isSelected }}\n />\n\n {label && (\n <Typography\n component=\"span\"\n variant=\"subtitle2\"\n {...LabelTypographyProps}\n className={clsx(\n cardClasses.label,\n LabelTypographyProps?.className,\n )}\n sx={[{\n display: \"block\"\n }, ...(Array.isArray(LabelTypographyProps?.sx) ? LabelTypographyProps.sx : [LabelTypographyProps?.sx])]}>\n {label}\n </Typography>\n )}\n </Box>\n </Box>\n </Box>\n </Card>\n );\n },\n)\n\nCardListItem.displayName = 'CardListItem'\n\nexport default CardListItem\n"],"names":["generateComponentClassKeys","styled","Box","Card","MuiCard","Typography","clsx","forwardRef","ChildrenFunctionProp","cardClasses","CardBox","theme","tv","vars","selected","backgroundColor","palette","primary","main","color","contrastText","outline","outlineOffset","actionArea","aspectContainer","height","position","paddingTop","wrapper","left","top","width","content","display","textAlign","alignItems","flexDirection","justifyContent","padding","label","lineHeight","fontSize","typography","pxToRem","textTransform","CardListItem","RefRenderFn","props","ref","className","children","item","CardActionAreaProps","WrapperBoxProps","ContentBoxProps","LabelTypographyProps","rest","isSelected","Boolean","childrenProp","args","component","variant","sx","Array","isArray","displayName"],"mappings":"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"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/
|
|
17
|
+
export interface ChildrenFunctionPropProps<T = any> {
|
|
18
|
+
childrenProp?: JSX.Children | ((...props: T[]) => JSX.Children);
|
|
19
|
+
args?: T[] | T;
|
|
20
|
+
}
|
|
21
|
+
export declare const ChildrenFunctionProp: {
|
|
22
|
+
<T>(props: ChildrenFunctionPropProps<T>): import("react").JSX.Element;
|
|
23
|
+
displayName: string;
|
|
24
|
+
};
|
|
25
|
+
export default ChildrenFunctionProp;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/ import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
17
|
+
export const ChildrenFunctionProp = (props)=>{
|
|
18
|
+
const { childrenProp, args = [] } = props;
|
|
19
|
+
const arg = Array.isArray(args) ? args : args ? [
|
|
20
|
+
args
|
|
21
|
+
] : [];
|
|
22
|
+
return /*#__PURE__*/ _jsx(_Fragment, {
|
|
23
|
+
children: typeof childrenProp !== 'function' ? childrenProp : childrenProp(...arg)
|
|
24
|
+
});
|
|
25
|
+
};
|
|
26
|
+
ChildrenFunctionProp.displayName = 'ChildrenFunctionProp';
|
|
27
|
+
export default ChildrenFunctionProp;
|
|
28
|
+
|
|
29
|
+
//# sourceMappingURL=children-function-prop.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/children-function-prop.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nexport interface ChildrenFunctionPropProps<T = any> {\n childrenProp?: JSX.Children | ((...props: T[]) => JSX.Children)\n args?: T[] | T\n}\n\nexport const ChildrenFunctionProp = <T,>(\n props: ChildrenFunctionPropProps<T>,\n) => {\n const { childrenProp, args = [] } = props\n const arg = Array.isArray(args) ? args : args ? [args] : []\n\n return (\n <>\n {typeof childrenProp !== 'function' ? childrenProp : childrenProp(...arg)}\n </>\n )\n}\nChildrenFunctionProp.displayName = 'ChildrenFunctionProp'\n\nexport default ChildrenFunctionProp\n"],"names":["ChildrenFunctionProp","props","childrenProp","args","arg","Array","isArray","displayName"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC;AAOD,OAAO,MAAMA,uBAAuB,CAClCC;IAEA,MAAM,EAAEC,YAAY,EAAEC,OAAO,EAAE,EAAE,GAAGF;IACpC,MAAMG,MAAMC,MAAMC,OAAO,CAACH,QAAQA,OAAOA,OAAO;QAACA;KAAK,GAAG,EAAE;IAE3D,qBACE;kBACG,OAAOD,iBAAiB,aAAaA,eAAeA,gBAAgBE;;AAG3E,EAAC;AACDJ,qBAAqBO,WAAW,GAAG;AAEnC,eAAeP,qBAAoB"}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { type ElementType, type MouseEventHandler } from 'react';
|
|
2
|
+
import { type ConfirmationContextConfig } from '../contexts/confirmation.context';
|
|
3
|
+
export interface ConfirmationProviderComponentProps {
|
|
4
|
+
defaultOptions?: ConfirmationContextConfig;
|
|
5
|
+
children?: JSX.Children;
|
|
6
|
+
component?: ElementType<{
|
|
7
|
+
open: boolean;
|
|
8
|
+
options: ConfirmationContextConfig;
|
|
9
|
+
onClose: MouseEventHandler<unknown>;
|
|
10
|
+
onCancel: MouseEventHandler<unknown>;
|
|
11
|
+
onConfirm: MouseEventHandler<unknown>;
|
|
12
|
+
}>;
|
|
13
|
+
}
|
|
14
|
+
export declare function ConfirmationProviderComponent(props: ConfirmationProviderComponentProps): import("react").JSX.Element;
|
|
15
|
+
export declare namespace ConfirmationProviderComponent {
|
|
16
|
+
var displayName: string;
|
|
17
|
+
var aglyn: boolean;
|
|
18
|
+
}
|
|
19
|
+
export default ConfirmationProviderComponent;
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2024 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/ 'use client';
|
|
17
|
+
import { _ as _extends } from "@swc/helpers/_/_extends";
|
|
18
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
19
|
+
import { Fragment, useCallback, useMemo, useState } from "react";
|
|
20
|
+
import ConfirmationContext, { buildConfirmationContextConfig, DEFAULT_CONTEXT_CONFIG } from "../contexts/confirmation.context.js";
|
|
21
|
+
import DialogConfirm from "./dialog-confirm.js";
|
|
22
|
+
export function ConfirmationProviderComponent(props) {
|
|
23
|
+
const { children, defaultOptions = {}, component: Component = DialogConfirm } = props;
|
|
24
|
+
const [options, setOptions] = useState(_extends({}, DEFAULT_CONTEXT_CONFIG, defaultOptions));
|
|
25
|
+
const [resolveReject, setResolveReject] = useState([]);
|
|
26
|
+
const [resolve, reject] = resolveReject;
|
|
27
|
+
const confirm = useCallback((options = {})=>{
|
|
28
|
+
return new Promise((resolve, reject)=>{
|
|
29
|
+
setOptions(buildConfirmationContextConfig(defaultOptions, options));
|
|
30
|
+
setResolveReject([
|
|
31
|
+
resolve,
|
|
32
|
+
reject
|
|
33
|
+
]);
|
|
34
|
+
});
|
|
35
|
+
}, [
|
|
36
|
+
defaultOptions
|
|
37
|
+
]);
|
|
38
|
+
const handleClose = useCallback(()=>{
|
|
39
|
+
setResolveReject([]);
|
|
40
|
+
}, []);
|
|
41
|
+
const handleCancel = useCallback(()=>{
|
|
42
|
+
reject();
|
|
43
|
+
handleClose();
|
|
44
|
+
}, [
|
|
45
|
+
reject,
|
|
46
|
+
handleClose
|
|
47
|
+
]);
|
|
48
|
+
const handleConfirm = useCallback(()=>{
|
|
49
|
+
resolve();
|
|
50
|
+
handleClose();
|
|
51
|
+
}, [
|
|
52
|
+
resolve,
|
|
53
|
+
handleClose
|
|
54
|
+
]);
|
|
55
|
+
const child = useMemo(()=>{
|
|
56
|
+
return /*#__PURE__*/ _jsx(ConfirmationContext.Provider, {
|
|
57
|
+
value: {
|
|
58
|
+
confirm
|
|
59
|
+
},
|
|
60
|
+
children: children
|
|
61
|
+
});
|
|
62
|
+
}, [
|
|
63
|
+
children,
|
|
64
|
+
confirm
|
|
65
|
+
]);
|
|
66
|
+
return /*#__PURE__*/ _jsxs(Fragment, {
|
|
67
|
+
children: [
|
|
68
|
+
child,
|
|
69
|
+
/*#__PURE__*/ _jsx(Component, {
|
|
70
|
+
open: resolveReject.length === 2,
|
|
71
|
+
options: options,
|
|
72
|
+
onClose: handleClose,
|
|
73
|
+
onCancel: handleCancel,
|
|
74
|
+
onConfirm: handleConfirm
|
|
75
|
+
})
|
|
76
|
+
]
|
|
77
|
+
});
|
|
78
|
+
}
|
|
79
|
+
ConfirmationProviderComponent.displayName = 'ConfirmationProviderComponent';
|
|
80
|
+
ConfirmationProviderComponent.aglyn = true;
|
|
81
|
+
export default ConfirmationProviderComponent;
|
|
82
|
+
|
|
83
|
+
//# sourceMappingURL=confirmation-provider.component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/confirmation-provider.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2024 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n'use client'\n\nimport {\n type ElementType,\n Fragment,\n type MouseEventHandler,\n useCallback,\n useMemo,\n useState,\n} from 'react'\nimport ConfirmationContext, {\n buildConfirmationContextConfig,\n type ConfirmationContextConfig,\n type ConfirmFunction,\n DEFAULT_CONTEXT_CONFIG,\n} from '../contexts/confirmation.context'\nimport DialogConfirm from './dialog-confirm'\n\nexport interface ConfirmationProviderComponentProps {\n defaultOptions?: ConfirmationContextConfig\n children?: JSX.Children\n component?: ElementType<{\n open: boolean\n options: ConfirmationContextConfig\n onClose: MouseEventHandler<unknown>\n onCancel: MouseEventHandler<unknown>\n onConfirm: MouseEventHandler<unknown>\n }>\n}\n\nexport function ConfirmationProviderComponent(\n props: ConfirmationProviderComponentProps,\n) {\n const {\n children,\n defaultOptions = {},\n component: Component = DialogConfirm,\n } = props\n const [options, setOptions] = useState({\n ...DEFAULT_CONTEXT_CONFIG,\n ...defaultOptions,\n })\n const [resolveReject, setResolveReject] = useState([])\n const [resolve, reject] = resolveReject\n\n const confirm = useCallback<ConfirmFunction>(\n (options: ConfirmationContextConfig = {}) => {\n return new Promise((resolve, reject) => {\n setOptions(buildConfirmationContextConfig(defaultOptions, options))\n setResolveReject([resolve, reject])\n })\n },\n [defaultOptions],\n )\n\n const handleClose = useCallback(() => {\n setResolveReject([])\n }, [])\n\n const handleCancel = useCallback(() => {\n reject()\n handleClose()\n }, [reject, handleClose])\n\n const handleConfirm = useCallback(() => {\n resolve()\n handleClose()\n }, [resolve, handleClose])\n\n const child = useMemo(() => {\n return (\n <ConfirmationContext.Provider value={{ confirm }}>\n {children}\n </ConfirmationContext.Provider>\n )\n }, [children, confirm])\n\n return (\n <Fragment>\n {child}\n <Component\n open={resolveReject.length === 2}\n options={options}\n onClose={handleClose}\n onCancel={handleCancel}\n onConfirm={handleConfirm}\n />\n </Fragment>\n )\n}\nConfirmationProviderComponent.displayName = 'ConfirmationProviderComponent'\nConfirmationProviderComponent.aglyn = true\n\nexport default ConfirmationProviderComponent\n"],"names":["Fragment","useCallback","useMemo","useState","ConfirmationContext","buildConfirmationContextConfig","DEFAULT_CONTEXT_CONFIG","DialogConfirm","ConfirmationProviderComponent","props","children","defaultOptions","component","Component","options","setOptions","resolveReject","setResolveReject","resolve","reject","confirm","Promise","handleClose","handleCancel","handleConfirm","child","Provider","value","open","length","onClose","onCancel","onConfirm","displayName","aglyn"],"mappings":"AAAA;;;;;;;;;;;;;;;CAeC,GACD;;;AAEA,SAEEA,QAAQ,EAERC,WAAW,EACXC,OAAO,EACPC,QAAQ,QACH,QAAO;AACd,OAAOC,uBACLC,8BAA8B,EAG9BC,sBAAsB,QACjB,sCAAkC;AACzC,OAAOC,mBAAmB,sBAAkB;AAc5C,OAAO,SAASC,8BACdC,KAAyC;IAEzC,MAAM,EACJC,QAAQ,EACRC,iBAAiB,CAAC,CAAC,EACnBC,WAAWC,YAAYN,aAAa,EACrC,GAAGE;IACJ,MAAM,CAACK,SAASC,WAAW,GAAGZ,SAAS,aAClCG,wBACAK;IAEL,MAAM,CAACK,eAAeC,iBAAiB,GAAGd,SAAS,EAAE;IACrD,MAAM,CAACe,SAASC,OAAO,GAAGH;IAE1B,MAAMI,UAAUnB,YACd,CAACa,UAAqC,CAAC,CAAC;QACtC,OAAO,IAAIO,QAAQ,CAACH,SAASC;YAC3BJ,WAAWV,+BAA+BM,gBAAgBG;YAC1DG,iBAAiB;gBAACC;gBAASC;aAAO;QACpC;IACF,GACA;QAACR;KAAe;IAGlB,MAAMW,cAAcrB,YAAY;QAC9BgB,iBAAiB,EAAE;IACrB,GAAG,EAAE;IAEL,MAAMM,eAAetB,YAAY;QAC/BkB;QACAG;IACF,GAAG;QAACH;QAAQG;KAAY;IAExB,MAAME,gBAAgBvB,YAAY;QAChCiB;QACAI;IACF,GAAG;QAACJ;QAASI;KAAY;IAEzB,MAAMG,QAAQvB,QAAQ;QACpB,qBACE,KAACE,oBAAoBsB,QAAQ;YAACC,OAAO;gBAAEP;YAAQ;sBAC5CV;;IAGP,GAAG;QAACA;QAAUU;KAAQ;IAEtB,qBACE,MAACpB;;YACEyB;0BACD,KAACZ;gBACCe,MAAMZ,cAAca,MAAM,KAAK;gBAC/Bf,SAASA;gBACTgB,SAASR;gBACTS,UAAUR;gBACVS,WAAWR;;;;AAInB;AACAhB,8BAA8ByB,WAAW,GAAG;AAC5CzB,8BAA8B0B,KAAK,GAAG;AAEtC,eAAe1B,8BAA6B"}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/
|
|
17
|
+
import { type ContainerProps as MuiContainerProps } from '@mui/material';
|
|
18
|
+
import type { Spacing } from '@mui/system';
|
|
19
|
+
export interface ContainerProps extends MuiContainerProps {
|
|
20
|
+
gutterMode?: 'margin' | 'padding';
|
|
21
|
+
gutterY?: Partial<Parameters<Spacing>> | boolean;
|
|
22
|
+
dense?: boolean;
|
|
23
|
+
}
|
|
24
|
+
export declare const Container: import("@emotion/styled").StyledComponent<import("@mui/material").ContainerOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "fixed" | "children" | "style" | "className" | "maxWidth" | "classes" | "sx" | "variant" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & ContainerProps, {}, {}>;
|
|
25
|
+
export default Container;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
import { _ as _extends } from "@swc/helpers/_/_extends";
|
|
2
|
+
/**
|
|
3
|
+
* @license
|
|
4
|
+
* Copyright 2023 Aglyn LLC
|
|
5
|
+
*
|
|
6
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
7
|
+
* you may not use this file except in compliance with the License.
|
|
8
|
+
* You may obtain a copy of the License at
|
|
9
|
+
*
|
|
10
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
11
|
+
*
|
|
12
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
13
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
14
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
15
|
+
* See the License for the specific language governing permissions and
|
|
16
|
+
* limitations under the License.
|
|
17
|
+
*/ import { styled } from "@aglyn/shared-ui-theme";
|
|
18
|
+
import { _isEqualitySameType } from "@aglyn/shared-util-tools";
|
|
19
|
+
import { Container as MuiContainer } from "@mui/material";
|
|
20
|
+
const isBoolean = (value)=>{
|
|
21
|
+
return typeof value === 'boolean';
|
|
22
|
+
};
|
|
23
|
+
export const Container = styled(MuiContainer, {
|
|
24
|
+
name: 'AglynContainer',
|
|
25
|
+
shouldForwardProp: (propName)=>!_isEqualitySameType(propName, null, 'gutterMode', 'gutterY', 'dense')
|
|
26
|
+
})(({ disableGutters, gutterMode, gutterY, theme, dense })=>{
|
|
27
|
+
const mode = gutterMode === 'margin' ? 'margin' : 'padding';
|
|
28
|
+
const base = dense ? {
|
|
29
|
+
[`${mode}Left`]: theme.spacing(1),
|
|
30
|
+
[`${mode}Right`]: theme.spacing(1),
|
|
31
|
+
[theme.breakpoints.up('md')]: {
|
|
32
|
+
[`${mode}Left`]: theme.spacing(2),
|
|
33
|
+
[`${mode}Right`]: theme.spacing(2)
|
|
34
|
+
}
|
|
35
|
+
} : {};
|
|
36
|
+
if (disableGutters) return base;
|
|
37
|
+
if (isBoolean(gutterY) && gutterY) {
|
|
38
|
+
return _extends({}, base, {
|
|
39
|
+
[`${mode}Top`]: theme.spacing(2),
|
|
40
|
+
[`${mode}Bottom`]: theme.spacing(2),
|
|
41
|
+
[theme.breakpoints.up('sm')]: {
|
|
42
|
+
[`${mode}Top`]: theme.spacing(3),
|
|
43
|
+
[`${mode}Bottom`]: theme.spacing(3)
|
|
44
|
+
}
|
|
45
|
+
});
|
|
46
|
+
} else if (!isBoolean(gutterY) && gutterY) {
|
|
47
|
+
const param = Array.isArray(gutterY) ? gutterY : [
|
|
48
|
+
gutterY
|
|
49
|
+
];
|
|
50
|
+
const space = theme.spacing(...param);
|
|
51
|
+
return _extends({}, base, {
|
|
52
|
+
[`${mode}Top`]: space,
|
|
53
|
+
[`${mode}Bottom`]: space
|
|
54
|
+
});
|
|
55
|
+
}
|
|
56
|
+
return base;
|
|
57
|
+
});
|
|
58
|
+
Container.displayName = 'Container';
|
|
59
|
+
Container.aglyn = true;
|
|
60
|
+
export default Container;
|
|
61
|
+
|
|
62
|
+
//# sourceMappingURL=container.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/container.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2023 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { styled } from '@aglyn/shared-ui-theme'\nimport { _isEqualitySameType } from '@aglyn/shared-util-tools'\nimport {\n Container as MuiContainer,\n type ContainerProps as MuiContainerProps,\n} from '@mui/material'\nimport type { Spacing } from '@mui/system'\n\nexport interface ContainerProps extends MuiContainerProps {\n gutterMode?: 'margin' | 'padding'\n gutterY?: Partial<Parameters<Spacing>> | boolean\n dense?: boolean\n}\n\nconst isBoolean = (value: unknown) => {\n return typeof value === 'boolean'\n}\n\nexport const Container = styled(MuiContainer, {\n name: 'AglynContainer',\n shouldForwardProp: (propName) =>\n !_isEqualitySameType(propName, null, 'gutterMode', 'gutterY', 'dense'),\n})<ContainerProps>(({ disableGutters, gutterMode, gutterY, theme, dense }) => {\n const mode = gutterMode === 'margin' ? 'margin' : 'padding'\n const base = dense\n ? {\n [`${mode}Left`]: theme.spacing(1),\n [`${mode}Right`]: theme.spacing(1),\n [theme.breakpoints.up('md')]: {\n [`${mode}Left`]: theme.spacing(2),\n [`${mode}Right`]: theme.spacing(2),\n },\n }\n : {}\n if (disableGutters) return base\n\n if (isBoolean(gutterY) && gutterY) {\n return {\n ...base,\n [`${mode}Top`]: theme.spacing(2),\n [`${mode}Bottom`]: theme.spacing(2),\n [theme.breakpoints.up('sm')]: {\n [`${mode}Top`]: theme.spacing(3),\n [`${mode}Bottom`]: theme.spacing(3),\n },\n }\n } else if (!isBoolean(gutterY) && gutterY) {\n const param = (\n Array.isArray(gutterY) ? gutterY : [gutterY]\n ) as Parameters<Spacing>\n const space = theme.spacing(...param)\n return {\n ...base,\n [`${mode}Top`]: space,\n [`${mode}Bottom`]: space,\n }\n }\n return base\n})\nContainer.displayName = 'Container'\nContainer.aglyn = true\n\nexport default Container\n"],"names":["styled","_isEqualitySameType","Container","MuiContainer","isBoolean","value","name","shouldForwardProp","propName","disableGutters","gutterMode","gutterY","theme","dense","mode","base","spacing","breakpoints","up","param","Array","isArray","space","displayName","aglyn"],"mappings":";AAAA;;;;;;;;;;;;;;;CAeC,GAED,SAASA,MAAM,QAAQ,yBAAwB;AAC/C,SAASC,mBAAmB,QAAQ,2BAA0B;AAC9D,SACEC,aAAaC,YAAY,QAEpB,gBAAe;AAStB,MAAMC,YAAY,CAACC;IACjB,OAAO,OAAOA,UAAU;AAC1B;AAEA,OAAO,MAAMH,YAAYF,OAAOG,cAAc;IAC5CG,MAAM;IACNC,mBAAmB,CAACC,WAClB,CAACP,oBAAoBO,UAAU,MAAM,cAAc,WAAW;AAClE,GAAmB,CAAC,EAAEC,cAAc,EAAEC,UAAU,EAAEC,OAAO,EAAEC,KAAK,EAAEC,KAAK,EAAE;IACvE,MAAMC,OAAOJ,eAAe,WAAW,WAAW;IAClD,MAAMK,OAAOF,QACT;QACE,CAAC,GAAGC,KAAK,IAAI,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;QAC/B,CAAC,GAAGF,KAAK,KAAK,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;QAChC,CAACJ,MAAMK,WAAW,CAACC,EAAE,CAAC,MAAM,EAAE;YAC5B,CAAC,GAAGJ,KAAK,IAAI,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;YAC/B,CAAC,GAAGF,KAAK,KAAK,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;QAClC;IACF,IACA,CAAC;IACL,IAAIP,gBAAgB,OAAOM;IAE3B,IAAIX,UAAUO,YAAYA,SAAS;QACjC,OAAO,aACFI;YACH,CAAC,GAAGD,KAAK,GAAG,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;YAC9B,CAAC,GAAGF,KAAK,MAAM,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;YACjC,CAACJ,MAAMK,WAAW,CAACC,EAAE,CAAC,MAAM,EAAE;gBAC5B,CAAC,GAAGJ,KAAK,GAAG,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;gBAC9B,CAAC,GAAGF,KAAK,MAAM,CAAC,CAAC,EAAEF,MAAMI,OAAO,CAAC;YACnC;;IAEJ,OAAO,IAAI,CAACZ,UAAUO,YAAYA,SAAS;QACzC,MAAMQ,QACJC,MAAMC,OAAO,CAACV,WAAWA,UAAU;YAACA;SAAQ;QAE9C,MAAMW,QAAQV,MAAMI,OAAO,IAAIG;QAC/B,OAAO,aACFJ;YACH,CAAC,GAAGD,KAAK,GAAG,CAAC,CAAC,EAAEQ;YAChB,CAAC,GAAGR,KAAK,MAAM,CAAC,CAAC,EAAEQ;;IAEvB;IACA,OAAOP;AACT,GAAE;AACFb,UAAUqB,WAAW,GAAG;AACxBrB,UAAUsB,KAAK,GAAG;AAElB,eAAetB,UAAS"}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2022 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/
|
|
17
|
+
import { type BoxProps, type LinearProgressProps as MuiLinearProgressProps } from '@mui/material';
|
|
18
|
+
import { type DataGridProps as MuiDataGridProps, type GridColDef as MuiGridColDef } from '@mui/x-data-grid';
|
|
19
|
+
import { type ReactNode } from 'react';
|
|
20
|
+
type LoadingOverlayViewProps = {
|
|
21
|
+
LinearProgressProps?: MuiLinearProgressProps;
|
|
22
|
+
};
|
|
23
|
+
export interface DataTableProps extends Partial<MuiDataGridProps> {
|
|
24
|
+
rows?: MuiDataGridProps['rows'];
|
|
25
|
+
columns?: MuiDataGridProps['columns'];
|
|
26
|
+
loading?: MuiDataGridProps['loading'];
|
|
27
|
+
RootBoxProps?: Partial<BoxProps>;
|
|
28
|
+
LoadingOverlayViewProps?: LoadingOverlayViewProps;
|
|
29
|
+
noRowsLabel?: string;
|
|
30
|
+
/**
|
|
31
|
+
* The empty state's second line and its way OUT (AGL-1152).
|
|
32
|
+
*
|
|
33
|
+
* `EmptyStateComponent` has drawn a description and an action since AGL-2501;
|
|
34
|
+
* this grid only ever handed it a label, so every list built on it — layouts,
|
|
35
|
+
* components, templates — showed an illustration and a dead end, while the
|
|
36
|
+
* screens list (which is not a grid) grew its own empty state WITH buttons
|
|
37
|
+
* and no illustration. Same product, same moment, two different answers, and
|
|
38
|
+
* neither one complete.
|
|
39
|
+
*/
|
|
40
|
+
noRowsDescription?: ReactNode;
|
|
41
|
+
/** The create button an empty list should offer. */
|
|
42
|
+
noRowsAction?: ReactNode;
|
|
43
|
+
children?: JSX.Children;
|
|
44
|
+
}
|
|
45
|
+
/**
|
|
46
|
+
* Adds a small help affordance to the header of every column that declares a
|
|
47
|
+
* `description` (AGL-601). Columns with their own `renderHeader` are left
|
|
48
|
+
* untouched. Also usable directly by call sites that render MUI `DataGrid`
|
|
49
|
+
* themselves instead of `DataTableComponent`.
|
|
50
|
+
*/
|
|
51
|
+
export declare function withColumnHelp(columns: readonly MuiGridColDef[]): MuiGridColDef[];
|
|
52
|
+
declare const DataTableComponent: import("react").ForwardRefExoticComponent<DataTableProps & import("react").RefAttributes<HTMLElement>>;
|
|
53
|
+
export { DataTableComponent };
|
|
54
|
+
export default DataTableComponent;
|
|
@@ -0,0 +1,211 @@
|
|
|
1
|
+
import { _ as _extends } from "@swc/helpers/_/_extends";
|
|
2
|
+
import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
|
|
3
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
4
|
+
/**
|
|
5
|
+
* @license
|
|
6
|
+
* Copyright 2022 Aglyn LLC
|
|
7
|
+
*
|
|
8
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
9
|
+
* you may not use this file except in compliance with the License.
|
|
10
|
+
* You may obtain a copy of the License at
|
|
11
|
+
*
|
|
12
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
13
|
+
*
|
|
14
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
15
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
16
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
17
|
+
* See the License for the specific language governing permissions and
|
|
18
|
+
* limitations under the License.
|
|
19
|
+
*/ import { mergeSxProps } from "@aglyn/shared-ui-theme";
|
|
20
|
+
import { Box, LinearProgress } from "@mui/material";
|
|
21
|
+
import { DataGrid, GridOverlay } from "@mui/x-data-grid";
|
|
22
|
+
import { forwardRef } from "react";
|
|
23
|
+
import { TABLE_EMPTY_STATE_HEIGHT } from "../const/table-pagination.js";
|
|
24
|
+
import { EmptyStateComponent } from "./empty-state.component.js";
|
|
25
|
+
import { HelpTip } from "./help-tip.component.js";
|
|
26
|
+
/**
|
|
27
|
+
* The grid's empty state is THE console empty state (AGL-2501).
|
|
28
|
+
*
|
|
29
|
+
* The illustration and its five mode-aware fills used to live here, which is
|
|
30
|
+
* why the media library — not a grid — had a bare line of text where every
|
|
31
|
+
* other list had a picture and a sentence. `EmptyStateComponent` owns it now
|
|
32
|
+
* and both render the same thing.
|
|
33
|
+
*/ const noRowsOverlay = (label, description, action)=>function NoRowsOverlay(props) {
|
|
34
|
+
return /*#__PURE__*/ _jsx(GridOverlay, _extends({}, props, {
|
|
35
|
+
children: /*#__PURE__*/ _jsx(EmptyStateComponent, {
|
|
36
|
+
label: label != null ? label : 'No Items',
|
|
37
|
+
description: description,
|
|
38
|
+
action: action
|
|
39
|
+
})
|
|
40
|
+
}));
|
|
41
|
+
};
|
|
42
|
+
const AppLoaderOverlayView = (props = {})=>function AppLoaderOverlayView() {
|
|
43
|
+
return /*#__PURE__*/ _jsx(GridOverlay, {
|
|
44
|
+
children: /*#__PURE__*/ _jsx("div", {
|
|
45
|
+
style: {
|
|
46
|
+
position: 'absolute',
|
|
47
|
+
top: 0,
|
|
48
|
+
width: '100%'
|
|
49
|
+
},
|
|
50
|
+
children: /*#__PURE__*/ _jsx(LinearProgress, _extends({
|
|
51
|
+
color: "primary"
|
|
52
|
+
}, props.LinearProgressProps))
|
|
53
|
+
})
|
|
54
|
+
});
|
|
55
|
+
};
|
|
56
|
+
/**
|
|
57
|
+
* Adds a small help affordance to the header of every column that declares a
|
|
58
|
+
* `description` (AGL-601). Columns with their own `renderHeader` are left
|
|
59
|
+
* untouched. Also usable directly by call sites that render MUI `DataGrid`
|
|
60
|
+
* themselves instead of `DataTableComponent`.
|
|
61
|
+
*/ export function withColumnHelp(columns) {
|
|
62
|
+
return columns.map((column)=>{
|
|
63
|
+
if (!column.description || column.renderHeader) return column;
|
|
64
|
+
return _extends({}, column, {
|
|
65
|
+
renderHeader: ()=>{
|
|
66
|
+
var _column_headerName, _column_headerName1;
|
|
67
|
+
return /*#__PURE__*/ _jsxs(Box, {
|
|
68
|
+
component: "span",
|
|
69
|
+
sx: {
|
|
70
|
+
display: 'inline-flex',
|
|
71
|
+
alignItems: 'center',
|
|
72
|
+
gap: 0.25
|
|
73
|
+
},
|
|
74
|
+
children: [
|
|
75
|
+
/*#__PURE__*/ _jsx(Box, {
|
|
76
|
+
component: "span",
|
|
77
|
+
className: "MuiDataGrid-columnHeaderTitle",
|
|
78
|
+
children: (_column_headerName = column.headerName) != null ? _column_headerName : column.field
|
|
79
|
+
}),
|
|
80
|
+
/*#__PURE__*/ _jsx(HelpTip, {
|
|
81
|
+
excerpt: column.description,
|
|
82
|
+
ariaLabel: `Help: ${(_column_headerName1 = column.headerName) != null ? _column_headerName1 : column.field}`,
|
|
83
|
+
sx: {
|
|
84
|
+
fontSize: '0.9em'
|
|
85
|
+
}
|
|
86
|
+
})
|
|
87
|
+
]
|
|
88
|
+
});
|
|
89
|
+
}
|
|
90
|
+
});
|
|
91
|
+
});
|
|
92
|
+
}
|
|
93
|
+
const DataTableComponent = /*#__PURE__*/ forwardRef(function RefRenderFn(props, ref) {
|
|
94
|
+
const { rows = [], columns = [], loading, RootBoxProps, noRowsLabel, noRowsDescription, noRowsAction, LoadingOverlayViewProps, children, sx, slots } = props, rest = _object_without_properties_loose(props, [
|
|
95
|
+
"rows",
|
|
96
|
+
"columns",
|
|
97
|
+
"loading",
|
|
98
|
+
"RootBoxProps",
|
|
99
|
+
"noRowsLabel",
|
|
100
|
+
"noRowsDescription",
|
|
101
|
+
"noRowsAction",
|
|
102
|
+
"LoadingOverlayViewProps",
|
|
103
|
+
"children",
|
|
104
|
+
"sx",
|
|
105
|
+
"slots"
|
|
106
|
+
]);
|
|
107
|
+
return /*#__PURE__*/ _jsxs(Box, _extends({
|
|
108
|
+
ref: ref,
|
|
109
|
+
sx: mergeSxProps({
|
|
110
|
+
height: 400,
|
|
111
|
+
width: '100%',
|
|
112
|
+
display: 'flex',
|
|
113
|
+
flexDirection: 'column',
|
|
114
|
+
/*
|
|
115
|
+
THE EMPTY STATE'S ROOM, RESERVED BEFORE IT IS DRAWN.
|
|
116
|
+
|
|
117
|
+
MUI X sizes the no-rows overlay from this variable and falls back
|
|
118
|
+
to two rows when nothing declares it — shorter than the empty
|
|
119
|
+
state's illustration on its own. The overlay is centered in the
|
|
120
|
+
slot and `.MuiDataGrid-main` clips what leaves it, so a slot two
|
|
121
|
+
rows tall does not crop the empty state at the bottom: it draws
|
|
122
|
+
the top half of it across the column headers and cuts the
|
|
123
|
+
description off mid-sentence.
|
|
124
|
+
|
|
125
|
+
An `autoHeight` grid grows to whatever is reserved here. A grid
|
|
126
|
+
holding a height of its own keeps it and centers the overlay in
|
|
127
|
+
what the header and the footer leave. Either way a grid WITH rows
|
|
128
|
+
is untouched: the variable is read only where there are no rows
|
|
129
|
+
to measure. A list still loading has none either, which is what
|
|
130
|
+
keeps it from changing height when the read lands empty.
|
|
131
|
+
|
|
132
|
+
On the wrapper rather than on the grid so that it inherits down
|
|
133
|
+
and a caller's `sx`, merged after this one, can still raise it.
|
|
134
|
+
*/ '--DataGrid-overlayHeight': `${TABLE_EMPTY_STATE_HEIGHT}px`,
|
|
135
|
+
'& .MuiDataGrid-root': {
|
|
136
|
+
border: 'none',
|
|
137
|
+
'& .MuiDataGrid-cell': {
|
|
138
|
+
'&:focus': {
|
|
139
|
+
outline: 'none'
|
|
140
|
+
}
|
|
141
|
+
},
|
|
142
|
+
// Column headers styled to match a plain MUI <TableHead>, which
|
|
143
|
+
// is what the screens list renders (it uses a bespoke table, not
|
|
144
|
+
// this grid). Without this the console shows two different table
|
|
145
|
+
// header designs depending on which listing you look at.
|
|
146
|
+
//
|
|
147
|
+
// Nested inside .MuiDataGrid-root deliberately: at the Box level
|
|
148
|
+
// these lost the cascade to the grid's own class-level styles —
|
|
149
|
+
// the separators stayed visible while the font rules landed,
|
|
150
|
+
// which is exactly the kind of half-applied styling that reads
|
|
151
|
+
// as "close but wrong".
|
|
152
|
+
'& .MuiDataGrid-columnSeparator': {
|
|
153
|
+
display: 'none'
|
|
154
|
+
},
|
|
155
|
+
/*
|
|
156
|
+
NO border-bottom here, and that is the point (AGL-2501).
|
|
157
|
+
|
|
158
|
+
A `1px solid divider` on the header CONTAINER duplicates a line
|
|
159
|
+
the grid already draws one level down: every
|
|
160
|
+
`.MuiDataGrid-columnHeader` cell carries a bottom border in
|
|
161
|
+
`--DataGrid-rowBorderColor`, and `.MuiDataGrid-filler` carries
|
|
162
|
+
it across whatever width the columns leave over. Measured on
|
|
163
|
+
the layouts list, the cells' line ends at y=364.43 and a
|
|
164
|
+
container line at y=365.68 — two 1.25px rules a fifth of a
|
|
165
|
+
pixel apart, which paints as a doubled border under the header
|
|
166
|
+
on every grid list.
|
|
167
|
+
|
|
168
|
+
The colours are identical anyway: `divider` is
|
|
169
|
+
rgba(0,0,0,0.12), and the row border resolves to rgb(224,224,224)
|
|
170
|
+
— the same line MuiTableCell head draws. So the one to keep is
|
|
171
|
+
the grid's own, which spans the full width without help.
|
|
172
|
+
*/ '& .MuiDataGrid-columnHeader': {
|
|
173
|
+
'&:focus, &:focus-within': {
|
|
174
|
+
outline: 'none'
|
|
175
|
+
}
|
|
176
|
+
},
|
|
177
|
+
'& .MuiDataGrid-columnHeaderTitle': {
|
|
178
|
+
// Matches MuiTableCell head: medium weight at body-2 size.
|
|
179
|
+
fontWeight: 500,
|
|
180
|
+
fontSize: '0.875rem',
|
|
181
|
+
lineHeight: 1.5
|
|
182
|
+
}
|
|
183
|
+
}
|
|
184
|
+
}, sx)
|
|
185
|
+
}, RootBoxProps, {
|
|
186
|
+
children: [
|
|
187
|
+
/*#__PURE__*/ _jsx(DataGrid, _extends({
|
|
188
|
+
sx: {
|
|
189
|
+
flexGrow: 1
|
|
190
|
+
},
|
|
191
|
+
// Same height as a row by default, like a TableHead cell; a caller
|
|
192
|
+
// that sets columnHeaderHeight explicitly still wins via `rest`.
|
|
193
|
+
columnHeaderHeight: 48,
|
|
194
|
+
rows: rows,
|
|
195
|
+
columns: withColumnHelp(columns),
|
|
196
|
+
loading: loading,
|
|
197
|
+
slots: _extends({
|
|
198
|
+
noRowsOverlay: noRowsOverlay(noRowsLabel, noRowsDescription, noRowsAction),
|
|
199
|
+
loadingOverlay: AppLoaderOverlayView(LoadingOverlayViewProps)
|
|
200
|
+
}, slots)
|
|
201
|
+
}, rest)),
|
|
202
|
+
children
|
|
203
|
+
]
|
|
204
|
+
}));
|
|
205
|
+
});
|
|
206
|
+
DataTableComponent.displayName = 'DataTableComponent';
|
|
207
|
+
DataTableComponent.aglyn = true;
|
|
208
|
+
export { DataTableComponent };
|
|
209
|
+
export default DataTableComponent;
|
|
210
|
+
|
|
211
|
+
//# sourceMappingURL=data-table.component.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"sources":["../../../../../../../../libs/shared/ui/jsx/src/lib/components/data-table.component.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2022 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { mergeSxProps } from '@aglyn/shared-ui-theme'\nimport {\n Box,\n type BoxProps,\n LinearProgress,\n type LinearProgressProps as MuiLinearProgressProps,\n} from '@mui/material'\nimport {\n DataGrid,\n type DataGridProps as MuiDataGridProps,\n type GridColDef as MuiGridColDef,\n GridOverlay,\n type GridOverlayProps,\n} from '@mui/x-data-grid'\nimport { forwardRef, type ReactNode } from 'react'\nimport { TABLE_EMPTY_STATE_HEIGHT } from '../const/table-pagination'\nimport { EmptyStateComponent } from './empty-state.component'\nimport { HelpTip } from './help-tip.component'\n\n/**\n * The grid's empty state is THE console empty state (AGL-2501).\n *\n * The illustration and its five mode-aware fills used to live here, which is\n * why the media library — not a grid — had a bare line of text where every\n * other list had a picture and a sentence. `EmptyStateComponent` owns it now\n * and both render the same thing.\n */\nconst noRowsOverlay = (\n label: string,\n description?: ReactNode,\n action?: ReactNode,\n) =>\n (function NoRowsOverlay(props: GridOverlayProps) {\n return (\n <GridOverlay {...props}>\n <EmptyStateComponent\n label={label ?? 'No Items'}\n description={description}\n action={action}\n />\n </GridOverlay>\n )\n })\n\ntype LoadingOverlayViewProps = {\n LinearProgressProps?: MuiLinearProgressProps\n}\nconst AppLoaderOverlayView = (props: LoadingOverlayViewProps = {}) =>\n (function AppLoaderOverlayView() {\n return (\n <GridOverlay>\n <div style={{ position: 'absolute', top: 0, width: '100%' }}>\n <LinearProgress color=\"primary\" {...props.LinearProgressProps} />\n </div>\n </GridOverlay>\n )\n })\n\nexport interface DataTableProps extends Partial<MuiDataGridProps> {\n rows?: MuiDataGridProps['rows']\n columns?: MuiDataGridProps['columns']\n loading?: MuiDataGridProps['loading']\n RootBoxProps?: Partial<BoxProps>\n LoadingOverlayViewProps?: LoadingOverlayViewProps\n noRowsLabel?: string\n /**\n * The empty state's second line and its way OUT (AGL-1152).\n *\n * `EmptyStateComponent` has drawn a description and an action since AGL-2501;\n * this grid only ever handed it a label, so every list built on it — layouts,\n * components, templates — showed an illustration and a dead end, while the\n * screens list (which is not a grid) grew its own empty state WITH buttons\n * and no illustration. Same product, same moment, two different answers, and\n * neither one complete.\n */\n noRowsDescription?: ReactNode\n /** The create button an empty list should offer. */\n noRowsAction?: ReactNode\n children?: JSX.Children\n}\n\n/**\n * Adds a small help affordance to the header of every column that declares a\n * `description` (AGL-601). Columns with their own `renderHeader` are left\n * untouched. Also usable directly by call sites that render MUI `DataGrid`\n * themselves instead of `DataTableComponent`.\n */\nexport function withColumnHelp(\n columns: readonly MuiGridColDef[],\n): MuiGridColDef[] {\n return columns.map((column) => {\n if (!column.description || column.renderHeader) return column\n return {\n ...column,\n renderHeader: () => (\n <Box\n component=\"span\"\n sx={{ display: 'inline-flex', alignItems: 'center', gap: 0.25 }}\n >\n <Box component=\"span\" className=\"MuiDataGrid-columnHeaderTitle\">\n {column.headerName ?? column.field}\n </Box>\n <HelpTip\n excerpt={column.description}\n ariaLabel={`Help: ${column.headerName ?? column.field}`}\n sx={{ fontSize: '0.9em' }}\n />\n </Box>\n ),\n }\n })\n}\n\nconst DataTableComponent = forwardRef<HTMLElement, DataTableProps>(\n function RefRenderFn(props, ref) {\n const {\n rows = [],\n columns = [],\n loading,\n RootBoxProps,\n noRowsLabel,\n noRowsDescription,\n noRowsAction,\n LoadingOverlayViewProps,\n children,\n sx,\n slots,\n ...rest\n } = props\n return (\n <Box\n ref={ref}\n sx={mergeSxProps(\n {\n height: 400,\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n /*\n THE EMPTY STATE'S ROOM, RESERVED BEFORE IT IS DRAWN.\n\n MUI X sizes the no-rows overlay from this variable and falls back\n to two rows when nothing declares it — shorter than the empty\n state's illustration on its own. The overlay is centered in the\n slot and `.MuiDataGrid-main` clips what leaves it, so a slot two\n rows tall does not crop the empty state at the bottom: it draws\n the top half of it across the column headers and cuts the\n description off mid-sentence.\n\n An `autoHeight` grid grows to whatever is reserved here. A grid\n holding a height of its own keeps it and centers the overlay in\n what the header and the footer leave. Either way a grid WITH rows\n is untouched: the variable is read only where there are no rows\n to measure. A list still loading has none either, which is what\n keeps it from changing height when the read lands empty.\n\n On the wrapper rather than on the grid so that it inherits down\n and a caller's `sx`, merged after this one, can still raise it.\n */\n '--DataGrid-overlayHeight': `${TABLE_EMPTY_STATE_HEIGHT}px`,\n '& .MuiDataGrid-root': {\n border: 'none',\n '& .MuiDataGrid-cell': {\n '&:focus': {\n outline: 'none',\n },\n },\n // Column headers styled to match a plain MUI <TableHead>, which\n // is what the screens list renders (it uses a bespoke table, not\n // this grid). Without this the console shows two different table\n // header designs depending on which listing you look at.\n //\n // Nested inside .MuiDataGrid-root deliberately: at the Box level\n // these lost the cascade to the grid's own class-level styles —\n // the separators stayed visible while the font rules landed,\n // which is exactly the kind of half-applied styling that reads\n // as \"close but wrong\".\n '& .MuiDataGrid-columnSeparator': { display: 'none' },\n /*\n NO border-bottom here, and that is the point (AGL-2501).\n\n A `1px solid divider` on the header CONTAINER duplicates a line\n the grid already draws one level down: every\n `.MuiDataGrid-columnHeader` cell carries a bottom border in\n `--DataGrid-rowBorderColor`, and `.MuiDataGrid-filler` carries\n it across whatever width the columns leave over. Measured on\n the layouts list, the cells' line ends at y=364.43 and a\n container line at y=365.68 — two 1.25px rules a fifth of a\n pixel apart, which paints as a doubled border under the header\n on every grid list.\n\n The colours are identical anyway: `divider` is\n rgba(0,0,0,0.12), and the row border resolves to rgb(224,224,224)\n — the same line MuiTableCell head draws. So the one to keep is\n the grid's own, which spans the full width without help.\n */\n '& .MuiDataGrid-columnHeader': {\n '&:focus, &:focus-within': { outline: 'none' },\n },\n '& .MuiDataGrid-columnHeaderTitle': {\n // Matches MuiTableCell head: medium weight at body-2 size.\n fontWeight: 500,\n fontSize: '0.875rem',\n lineHeight: 1.5,\n },\n },\n },\n sx,\n )}\n {...RootBoxProps}\n >\n <DataGrid\n sx={{ flexGrow: 1 }}\n // Same height as a row by default, like a TableHead cell; a caller\n // that sets columnHeaderHeight explicitly still wins via `rest`.\n columnHeaderHeight={48}\n rows={rows}\n columns={withColumnHelp(columns)}\n loading={loading}\n slots={{\n noRowsOverlay: noRowsOverlay(\n noRowsLabel,\n noRowsDescription,\n noRowsAction,\n ),\n loadingOverlay: AppLoaderOverlayView(LoadingOverlayViewProps),\n ...slots,\n }}\n {...rest}\n />\n {children}\n </Box>\n )\n },\n)\n\nDataTableComponent.displayName = 'DataTableComponent'\nDataTableComponent.aglyn = true\n\nexport { DataTableComponent }\nexport default DataTableComponent\n"],"names":["mergeSxProps","Box","LinearProgress","DataGrid","GridOverlay","forwardRef","TABLE_EMPTY_STATE_HEIGHT","EmptyStateComponent","HelpTip","noRowsOverlay","label","description","action","NoRowsOverlay","props","AppLoaderOverlayView","div","style","position","top","width","color","LinearProgressProps","withColumnHelp","columns","map","column","renderHeader","component","sx","display","alignItems","gap","className","headerName","field","excerpt","ariaLabel","fontSize","DataTableComponent","RefRenderFn","ref","rows","loading","RootBoxProps","noRowsLabel","noRowsDescription","noRowsAction","LoadingOverlayViewProps","children","slots","rest","height","flexDirection","border","outline","fontWeight","lineHeight","flexGrow","columnHeaderHeight","loadingOverlay","displayName","aglyn"],"mappings":"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"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* @license
|
|
3
|
+
* Copyright 2023 Aglyn LLC
|
|
4
|
+
*
|
|
5
|
+
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
6
|
+
* you may not use this file except in compliance with the License.
|
|
7
|
+
* You may obtain a copy of the License at
|
|
8
|
+
*
|
|
9
|
+
* http://www.apache.org/licenses/LICENSE-2.0
|
|
10
|
+
*
|
|
11
|
+
* Unless required by applicable law or agreed to in writing, software
|
|
12
|
+
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
13
|
+
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
14
|
+
* See the License for the specific language governing permissions and
|
|
15
|
+
* limitations under the License.
|
|
16
|
+
*/
|
|
17
|
+
import { ButtonProps } from '@mui/material/Button';
|
|
18
|
+
import { DialogProps } from '@mui/material/Dialog';
|
|
19
|
+
import { DialogContentTextProps } from '@mui/material/DialogContentText';
|
|
20
|
+
import { DialogTitleProps } from '@mui/material/DialogTitle';
|
|
21
|
+
export interface DialogConfirmOptions {
|
|
22
|
+
cancellationText?: ButtonProps['children'];
|
|
23
|
+
confirmationText?: ButtonProps['children'];
|
|
24
|
+
cancellationButtonProps?: Partial<ButtonProps>;
|
|
25
|
+
confirmationButtonProps?: Partial<ButtonProps>;
|
|
26
|
+
dialogProps?: Partial<DialogProps>;
|
|
27
|
+
title?: DialogTitleProps['children'];
|
|
28
|
+
description?: DialogContentTextProps['children'];
|
|
29
|
+
}
|
|
30
|
+
export interface DialogConfirmProps extends DialogProps {
|
|
31
|
+
options?: DialogConfirmOptions;
|
|
32
|
+
onConfirm?: ButtonProps['onClick'];
|
|
33
|
+
onCancel?: ButtonProps['onClick'];
|
|
34
|
+
}
|
|
35
|
+
export declare const DialogConfirm: import("react").ForwardRefExoticComponent<Omit<DialogConfirmProps, "ref"> & import("react").RefAttributes<any>>;
|
|
36
|
+
export default DialogConfirm;
|