@vuu-ui/vuu-layout 0.8.60 → 0.8.61
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/cjs/palette/Palette.css.js +1 -1
- package/cjs/palette/Palette.js +2 -3
- package/cjs/palette/Palette.js.map +1 -1
- package/esm/palette/Palette.css.js +1 -1
- package/esm/palette/Palette.js +2 -3
- package/esm/palette/Palette.js.map +1 -1
- package/package.json +9 -9
- package/types/palette/Palette.d.ts +6 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var paletteCss = ".vuuPalette {\n --vuuList-borderStyle: none;\n}\n\n.vuuPalette-horizontal {\n align-items: center;\n display: flex;\n}\n\n.vuuPaletteItem {\n --vuu-icon-color: var(--salt-content-
|
|
3
|
+
var paletteCss = ".vuuPalette {\n --vuu-svg-draggable: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 17\"><path d=\"M12.6666 6.5H3.33329C2.96663 6.5 2.66663 6.8 2.66663 7.16667C2.66663 7.53333 2.96663 7.83333 3.33329 7.83333H12.6666C13.0333 7.83333 13.3333 7.53333 13.3333 7.16667C13.3333 6.8 13.0333 6.5 12.6666 6.5ZM3.33329 10.5H12.6666C13.0333 10.5 13.3333 10.2 13.3333 9.83333C13.3333 9.46667 13.0333 9.16667 12.6666 9.16667H3.33329C2.96663 9.16667 2.66663 9.46667 2.66663 9.83333C2.66663 10.2 2.96663 10.5 3.33329 10.5Z\" /></svg>');\n --vuuList-borderStyle: none;\n}\n\n.vuuPalette-horizontal {\n align-items: center;\n display: flex;\n}\n\n.vuuPaletteItem {\n --vuu-icon-color: var(--salt-content-secondary-foreground);\n --list-item-text-padding: 0 0 0 calc(var(--salt-size-unit) * 3);\n padding-left: 12px;\n font-size: 12px;\n font-weight: 600;\n gap: var(--salt-spacing-200);\n}\n\n.vuuSimpleDraggableWrapper > .vuuPaletteItem {\n --vuu-icon-color: var(--salt-selectable-foreground);\n}\n\n.salt-theme .vuuPaletteItem {\n font-size: 11px;\n font-weight: normal;\n}\n";
|
|
4
4
|
|
|
5
5
|
module.exports = paletteCss;
|
|
6
6
|
//# sourceMappingURL=Palette.css.js.map
|
package/cjs/palette/Palette.js
CHANGED
|
@@ -21,7 +21,7 @@ const clonePaletteItem = (paletteItem) => {
|
|
|
21
21
|
const PaletteItem = React.memo(
|
|
22
22
|
({
|
|
23
23
|
className,
|
|
24
|
-
|
|
24
|
+
component,
|
|
25
25
|
idx,
|
|
26
26
|
resizeable,
|
|
27
27
|
header,
|
|
@@ -39,7 +39,6 @@ const PaletteItem = React.memo(
|
|
|
39
39
|
{
|
|
40
40
|
className: cx("vuuPaletteItem", className),
|
|
41
41
|
"data-draggable": true,
|
|
42
|
-
"data-icon": "draggable",
|
|
43
42
|
...props
|
|
44
43
|
}
|
|
45
44
|
);
|
|
@@ -62,7 +61,7 @@ const Palette = ({
|
|
|
62
61
|
const listItemElement = target.closest(".vuuPaletteItem");
|
|
63
62
|
const idx = parseInt(listItemElement.dataset?.index ?? "-1");
|
|
64
63
|
const {
|
|
65
|
-
props: { caption,
|
|
64
|
+
props: { caption, component: payload, template, ...props2 }
|
|
66
65
|
} = children[idx];
|
|
67
66
|
const { ViewProps: componentViewProps } = payload.props;
|
|
68
67
|
const { height, left, top, width } = listItemElement.getBoundingClientRect();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Palette.js","sources":["../../src/palette/Palette.tsx"],"sourcesContent":["import {\n List,\n ListItem,\n ListItemProps,\n ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { registerComponent, uuid } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n cloneElement,\n memo,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View, ViewProps } from \"../layout-view\";\n\nimport paletteCss from \"./Palette.css\";\n\nconst clonePaletteItem = (paletteItem: HTMLElement) => {\n const dolly = paletteItem.cloneNode(true) as HTMLElement;\n dolly.id = \"\";\n delete dolly.dataset.idx;\n return dolly;\n};\n\nexport interface PaletteItemProps extends ListItemProps {\n
|
|
1
|
+
{"version":3,"file":"Palette.js","sources":["../../src/palette/Palette.tsx"],"sourcesContent":["import {\n List,\n ListItem,\n ListItemProps,\n ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { registerComponent, uuid } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n cloneElement,\n memo,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View, ViewProps } from \"../layout-view\";\n\nimport paletteCss from \"./Palette.css\";\n\nconst clonePaletteItem = (paletteItem: HTMLElement) => {\n const dolly = paletteItem.cloneNode(true) as HTMLElement;\n dolly.id = \"\";\n delete dolly.dataset.idx;\n return dolly;\n};\n\nexport interface PaletteItemProps extends ListItemProps {\n /**\n * This is the payload that will be created when the\n * palette item is dropped\n */\n component: ReactElement;\n closeable?: boolean;\n header?: boolean;\n idx?: number;\n resize?: \"defer\";\n resizeable?: boolean;\n}\n\nexport const PaletteItem = memo(\n ({\n className,\n component,\n idx,\n resizeable,\n header,\n closeable,\n ...props\n }: PaletteItemProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-palette\",\n css: paletteCss,\n window: targetWindow,\n });\n\n return (\n <ListItem\n className={cx(\"vuuPaletteItem\", className)}\n data-draggable\n {...props}\n />\n );\n }\n);\n\nPaletteItem.displayName = \"PaletteItem\";\n\nexport interface PaletteProps\n extends Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onDragStart\" | \"onDrop\" | \"onSelect\"\n > {\n ListProps?: Partial<ListProps>;\n ViewProps?: Partial<ViewProps>;\n children: ReactElement[];\n itemHeight?: number;\n orientation: \"horizontal\" | \"vertical\";\n selection?: string;\n}\n\nexport const Palette = ({\n ListProps,\n ViewProps,\n children,\n className,\n itemHeight = 41,\n orientation = \"horizontal\",\n ...props\n}: PaletteProps) => {\n const dispatch = useLayoutProviderDispatch();\n const classBase = \"vuuPalette\";\n\n function handleMouseDown(evt: MouseEvent) {\n const target = evt.target as HTMLElement;\n const listItemElement = target.closest(\".vuuPaletteItem\") as HTMLElement;\n const idx = parseInt(listItemElement.dataset?.index ?? \"-1\");\n const {\n props: { caption, component: payload, template, ...props },\n } = children[idx];\n const { ViewProps: componentViewProps } = payload.props;\n const { height, left, top, width } =\n listItemElement.getBoundingClientRect();\n const id = uuid();\n const identifiers = { id, key: id };\n const component = template ? (\n payload\n ) : (\n <View\n {...ViewProps}\n {...identifiers}\n {...props}\n {...componentViewProps}\n title={props.label}\n >\n {payload}\n </View>\n );\n\n dispatch({\n dragRect: {\n left,\n top,\n right: left + width,\n bottom: top + 150,\n width,\n height,\n },\n dragElement: clonePaletteItem(listItemElement),\n evt: evt.nativeEvent,\n instructions: {\n DoNotRemove: true,\n DoNotTransform: true,\n DriftHomeIfNoDropTarget: true,\n RemoveDraggableOnDragEnd: true,\n dragThreshold: 10,\n },\n path: \"*\",\n payload: component,\n type: \"drag-start\",\n });\n }\n\n return (\n <List\n {...ListProps}\n {...props}\n className={cx(classBase, className, `${classBase}-${orientation}`)}\n itemHeight={itemHeight}\n selected={null}\n >\n {children.map((child, idx) =>\n child.type === PaletteItem\n ? cloneElement(child, {\n key: idx,\n onMouseDown: handleMouseDown,\n })\n : child\n )}\n </List>\n );\n};\n\nregisterComponent(\"Palette\", Palette, \"view\");\n"],"names":["memo","useWindow","useComponentCssInjection","paletteCss","jsx","ListItem","ListProps","ViewProps","useLayoutProviderDispatch","props","uuid","View","List","cloneElement","registerComponent"],"mappings":"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"}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
var paletteCss = ".vuuPalette {\n --vuuList-borderStyle: none;\n}\n\n.vuuPalette-horizontal {\n align-items: center;\n display: flex;\n}\n\n.vuuPaletteItem {\n --vuu-icon-color: var(--salt-content-
|
|
1
|
+
var paletteCss = ".vuuPalette {\n --vuu-svg-draggable: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 17\"><path d=\"M12.6666 6.5H3.33329C2.96663 6.5 2.66663 6.8 2.66663 7.16667C2.66663 7.53333 2.96663 7.83333 3.33329 7.83333H12.6666C13.0333 7.83333 13.3333 7.53333 13.3333 7.16667C13.3333 6.8 13.0333 6.5 12.6666 6.5ZM3.33329 10.5H12.6666C13.0333 10.5 13.3333 10.2 13.3333 9.83333C13.3333 9.46667 13.0333 9.16667 12.6666 9.16667H3.33329C2.96663 9.16667 2.66663 9.46667 2.66663 9.83333C2.66663 10.2 2.96663 10.5 3.33329 10.5Z\" /></svg>');\n --vuuList-borderStyle: none;\n}\n\n.vuuPalette-horizontal {\n align-items: center;\n display: flex;\n}\n\n.vuuPaletteItem {\n --vuu-icon-color: var(--salt-content-secondary-foreground);\n --list-item-text-padding: 0 0 0 calc(var(--salt-size-unit) * 3);\n padding-left: 12px;\n font-size: 12px;\n font-weight: 600;\n gap: var(--salt-spacing-200);\n}\n\n.vuuSimpleDraggableWrapper > .vuuPaletteItem {\n --vuu-icon-color: var(--salt-selectable-foreground);\n}\n\n.salt-theme .vuuPaletteItem {\n font-size: 11px;\n font-weight: normal;\n}\n";
|
|
2
2
|
|
|
3
3
|
export { paletteCss as default };
|
|
4
4
|
//# sourceMappingURL=Palette.css.js.map
|
package/esm/palette/Palette.js
CHANGED
|
@@ -19,7 +19,7 @@ const clonePaletteItem = (paletteItem) => {
|
|
|
19
19
|
const PaletteItem = memo(
|
|
20
20
|
({
|
|
21
21
|
className,
|
|
22
|
-
|
|
22
|
+
component,
|
|
23
23
|
idx,
|
|
24
24
|
resizeable,
|
|
25
25
|
header,
|
|
@@ -37,7 +37,6 @@ const PaletteItem = memo(
|
|
|
37
37
|
{
|
|
38
38
|
className: cx("vuuPaletteItem", className),
|
|
39
39
|
"data-draggable": true,
|
|
40
|
-
"data-icon": "draggable",
|
|
41
40
|
...props
|
|
42
41
|
}
|
|
43
42
|
);
|
|
@@ -60,7 +59,7 @@ const Palette = ({
|
|
|
60
59
|
const listItemElement = target.closest(".vuuPaletteItem");
|
|
61
60
|
const idx = parseInt(listItemElement.dataset?.index ?? "-1");
|
|
62
61
|
const {
|
|
63
|
-
props: { caption,
|
|
62
|
+
props: { caption, component: payload, template, ...props2 }
|
|
64
63
|
} = children[idx];
|
|
65
64
|
const { ViewProps: componentViewProps } = payload.props;
|
|
66
65
|
const { height, left, top, width } = listItemElement.getBoundingClientRect();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Palette.js","sources":["../../src/palette/Palette.tsx"],"sourcesContent":["import {\n List,\n ListItem,\n ListItemProps,\n ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { registerComponent, uuid } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n cloneElement,\n memo,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View, ViewProps } from \"../layout-view\";\n\nimport paletteCss from \"./Palette.css\";\n\nconst clonePaletteItem = (paletteItem: HTMLElement) => {\n const dolly = paletteItem.cloneNode(true) as HTMLElement;\n dolly.id = \"\";\n delete dolly.dataset.idx;\n return dolly;\n};\n\nexport interface PaletteItemProps extends ListItemProps {\n
|
|
1
|
+
{"version":3,"file":"Palette.js","sources":["../../src/palette/Palette.tsx"],"sourcesContent":["import {\n List,\n ListItem,\n ListItemProps,\n ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { registerComponent, uuid } from \"@vuu-ui/vuu-utils\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport cx from \"clsx\";\nimport {\n HTMLAttributes,\n MouseEvent,\n ReactElement,\n cloneElement,\n memo,\n} from \"react\";\nimport { useLayoutProviderDispatch } from \"../layout-provider\";\nimport { View, ViewProps } from \"../layout-view\";\n\nimport paletteCss from \"./Palette.css\";\n\nconst clonePaletteItem = (paletteItem: HTMLElement) => {\n const dolly = paletteItem.cloneNode(true) as HTMLElement;\n dolly.id = \"\";\n delete dolly.dataset.idx;\n return dolly;\n};\n\nexport interface PaletteItemProps extends ListItemProps {\n /**\n * This is the payload that will be created when the\n * palette item is dropped\n */\n component: ReactElement;\n closeable?: boolean;\n header?: boolean;\n idx?: number;\n resize?: \"defer\";\n resizeable?: boolean;\n}\n\nexport const PaletteItem = memo(\n ({\n className,\n component,\n idx,\n resizeable,\n header,\n closeable,\n ...props\n }: PaletteItemProps) => {\n const targetWindow = useWindow();\n useComponentCssInjection({\n testId: \"vuu-palette\",\n css: paletteCss,\n window: targetWindow,\n });\n\n return (\n <ListItem\n className={cx(\"vuuPaletteItem\", className)}\n data-draggable\n {...props}\n />\n );\n }\n);\n\nPaletteItem.displayName = \"PaletteItem\";\n\nexport interface PaletteProps\n extends Omit<\n HTMLAttributes<HTMLDivElement>,\n \"onDragStart\" | \"onDrop\" | \"onSelect\"\n > {\n ListProps?: Partial<ListProps>;\n ViewProps?: Partial<ViewProps>;\n children: ReactElement[];\n itemHeight?: number;\n orientation: \"horizontal\" | \"vertical\";\n selection?: string;\n}\n\nexport const Palette = ({\n ListProps,\n ViewProps,\n children,\n className,\n itemHeight = 41,\n orientation = \"horizontal\",\n ...props\n}: PaletteProps) => {\n const dispatch = useLayoutProviderDispatch();\n const classBase = \"vuuPalette\";\n\n function handleMouseDown(evt: MouseEvent) {\n const target = evt.target as HTMLElement;\n const listItemElement = target.closest(\".vuuPaletteItem\") as HTMLElement;\n const idx = parseInt(listItemElement.dataset?.index ?? \"-1\");\n const {\n props: { caption, component: payload, template, ...props },\n } = children[idx];\n const { ViewProps: componentViewProps } = payload.props;\n const { height, left, top, width } =\n listItemElement.getBoundingClientRect();\n const id = uuid();\n const identifiers = { id, key: id };\n const component = template ? (\n payload\n ) : (\n <View\n {...ViewProps}\n {...identifiers}\n {...props}\n {...componentViewProps}\n title={props.label}\n >\n {payload}\n </View>\n );\n\n dispatch({\n dragRect: {\n left,\n top,\n right: left + width,\n bottom: top + 150,\n width,\n height,\n },\n dragElement: clonePaletteItem(listItemElement),\n evt: evt.nativeEvent,\n instructions: {\n DoNotRemove: true,\n DoNotTransform: true,\n DriftHomeIfNoDropTarget: true,\n RemoveDraggableOnDragEnd: true,\n dragThreshold: 10,\n },\n path: \"*\",\n payload: component,\n type: \"drag-start\",\n });\n }\n\n return (\n <List\n {...ListProps}\n {...props}\n className={cx(classBase, className, `${classBase}-${orientation}`)}\n itemHeight={itemHeight}\n selected={null}\n >\n {children.map((child, idx) =>\n child.type === PaletteItem\n ? cloneElement(child, {\n key: idx,\n onMouseDown: handleMouseDown,\n })\n : child\n )}\n </List>\n );\n};\n\nregisterComponent(\"Palette\", Palette, \"view\");\n"],"names":["ListProps","ViewProps","props","View"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
1
|
{
|
|
2
|
-
"version": "0.8.
|
|
2
|
+
"version": "0.8.61",
|
|
3
3
|
"description": "VUU Layout Components",
|
|
4
4
|
"author": "heswell",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"types": "types/index.d.ts",
|
|
7
7
|
"devDependencies": {
|
|
8
|
-
"@vuu-ui/vuu-data-types": "0.8.
|
|
9
|
-
"@vuu-ui/vuu-filter-types": "0.8.
|
|
8
|
+
"@vuu-ui/vuu-data-types": "0.8.61",
|
|
9
|
+
"@vuu-ui/vuu-filter-types": "0.8.61"
|
|
10
10
|
},
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"@salt-ds/core": "1.27.1",
|
|
13
13
|
"@salt-ds/styles": "0.2.1",
|
|
14
14
|
"@salt-ds/window": "0.1.1",
|
|
15
|
-
"@vuu-ui/vuu-data-types": "0.8.
|
|
16
|
-
"@vuu-ui/vuu-filters": "0.8.
|
|
17
|
-
"@vuu-ui/vuu-popups": "0.8.
|
|
18
|
-
"@vuu-ui/vuu-table": "0.8.
|
|
19
|
-
"@vuu-ui/vuu-ui-controls": "0.8.
|
|
20
|
-
"@vuu-ui/vuu-utils": "0.8.
|
|
15
|
+
"@vuu-ui/vuu-data-types": "0.8.61",
|
|
16
|
+
"@vuu-ui/vuu-filters": "0.8.61",
|
|
17
|
+
"@vuu-ui/vuu-popups": "0.8.61",
|
|
18
|
+
"@vuu-ui/vuu-table": "0.8.61",
|
|
19
|
+
"@vuu-ui/vuu-ui-controls": "0.8.61",
|
|
20
|
+
"@vuu-ui/vuu-utils": "0.8.61"
|
|
21
21
|
},
|
|
22
22
|
"peerDependencies": {
|
|
23
23
|
"clsx": "^2.0.0",
|
|
@@ -2,14 +2,18 @@ import { ListItemProps, ListProps } from "@vuu-ui/vuu-ui-controls";
|
|
|
2
2
|
import { HTMLAttributes, ReactElement } from "react";
|
|
3
3
|
import { ViewProps } from "../layout-view";
|
|
4
4
|
export interface PaletteItemProps extends ListItemProps {
|
|
5
|
-
|
|
5
|
+
/**
|
|
6
|
+
* This is the payload that will be created when the
|
|
7
|
+
* palette item is dropped
|
|
8
|
+
*/
|
|
9
|
+
component: ReactElement;
|
|
6
10
|
closeable?: boolean;
|
|
7
11
|
header?: boolean;
|
|
8
12
|
idx?: number;
|
|
9
13
|
resize?: "defer";
|
|
10
14
|
resizeable?: boolean;
|
|
11
15
|
}
|
|
12
|
-
export declare const PaletteItem: import("react").MemoExoticComponent<({ className,
|
|
16
|
+
export declare const PaletteItem: import("react").MemoExoticComponent<({ className, component, idx, resizeable, header, closeable, ...props }: PaletteItemProps) => JSX.Element>;
|
|
13
17
|
export interface PaletteProps extends Omit<HTMLAttributes<HTMLDivElement>, "onDragStart" | "onDrop" | "onSelect"> {
|
|
14
18
|
ListProps?: Partial<ListProps>;
|
|
15
19
|
ViewProps?: Partial<ViewProps>;
|