@hypericon/mico 0.4.1 → 0.5.0

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.
Files changed (95) hide show
  1. package/dist/cjs/components/dialog/dialog-manager.js +1 -1
  2. package/dist/cjs/components/markdown-editor/MarkdownEditor.js +17 -7
  3. package/dist/cjs/components/select/SelectOptionsPanel.d.ts +0 -1
  4. package/dist/cjs/components/table/Table.d.ts +6 -2
  5. package/dist/cjs/components/table/Table.js +7 -3
  6. package/dist/cjs/components/toast/toast.js +19 -9
  7. package/dist/cjs/components/tooltip/tooltip-function.d.ts +1 -1
  8. package/dist/cjs/components/tooltip/tooltip-function.js +3 -4
  9. package/dist/cjs/components/tree/Tree.d.ts +30 -30
  10. package/dist/cjs/components/tree/Tree.js +3 -3
  11. package/dist/cjs/components/tree/tree-utils.js +1 -2
  12. package/dist/cjs/utils/date-time.js +2 -3
  13. package/dist/cjs/utils/dom.js +2 -3
  14. package/dist/cjs/utils/events.js +1 -2
  15. package/dist/esm/components/accordion/index.d.ts +1 -0
  16. package/dist/esm/components/accordion/index.js +1 -0
  17. package/dist/esm/components/data-grid/index.d.ts +1 -0
  18. package/dist/esm/components/data-grid/index.js +1 -0
  19. package/dist/esm/components/data-table/index.d.ts +1 -0
  20. package/dist/esm/components/data-table/index.js +1 -0
  21. package/dist/esm/components/dialog/Dialog.js +2 -1
  22. package/dist/esm/components/dialog/dialog-manager.js +21 -14
  23. package/dist/esm/components/dialog/index.js +17 -1
  24. package/dist/esm/components/drag-handler/DragHandler.js +9 -3
  25. package/dist/esm/components/drag-handler/index.js +17 -1
  26. package/dist/esm/components/drawer/index.d.ts +1 -0
  27. package/dist/esm/components/drawer/index.js +1 -0
  28. package/dist/esm/components/drop-target/DropTarget.js +15 -9
  29. package/dist/esm/components/drop-target/drop-target.state.js +14 -10
  30. package/dist/esm/components/drop-target/index.js +17 -1
  31. package/dist/esm/components/form/Form.js +4 -1
  32. package/dist/esm/components/form/index.js +17 -1
  33. package/dist/esm/components/icon/Icon.js +9 -3
  34. package/dist/esm/components/icon/icons.js +2 -1
  35. package/dist/esm/components/icon/index.js +18 -2
  36. package/dist/esm/components/index.js +28 -12
  37. package/dist/esm/components/markdown/Markdown.js +15 -9
  38. package/dist/esm/components/markdown/index.js +17 -1
  39. package/dist/esm/components/markdown-editor/MarkdownEditor.js +80 -44
  40. package/dist/esm/components/markdown-editor/index.js +17 -1
  41. package/dist/esm/components/markdown-editor/markdown-editor.state.js +11 -7
  42. package/dist/esm/components/menu/Menu.js +16 -10
  43. package/dist/esm/components/menu/MenuButton.js +31 -25
  44. package/dist/esm/components/menu/MenuSeparator.js +11 -5
  45. package/dist/esm/components/menu/index.js +22 -6
  46. package/dist/esm/components/menu/menu-constants.js +4 -1
  47. package/dist/esm/components/menu/menu-manager.js +18 -11
  48. package/dist/esm/components/menu/menu-settings.js +4 -1
  49. package/dist/esm/components/modal/index.d.ts +1 -0
  50. package/dist/esm/components/modal/index.js +1 -0
  51. package/dist/esm/components/pagination/Pagination.js +35 -29
  52. package/dist/esm/components/pagination/index.js +18 -2
  53. package/dist/esm/components/pagination/pagination-settings.js +4 -1
  54. package/dist/esm/components/panel-tree/PanelTree.js +27 -21
  55. package/dist/esm/components/panel-tree/index.d.ts +1 -0
  56. package/dist/esm/components/panel-tree/index.js +1 -0
  57. package/dist/esm/components/panel-tree/panel-tree-constants.js +5 -2
  58. package/dist/esm/components/panel-tree/panel-tree-store.js +13 -9
  59. package/dist/esm/components/panel-tree/panel-tree-utils.js +7 -3
  60. package/dist/esm/components/popover/index.d.ts +1 -0
  61. package/dist/esm/components/popover/index.js +1 -0
  62. package/dist/esm/components/reorderable-list/RedorderableList.js +17 -11
  63. package/dist/esm/components/reorderable-list/index.d.ts +1 -0
  64. package/dist/esm/components/reorderable-list/index.js +1 -0
  65. package/dist/esm/components/select/Select.js +18 -12
  66. package/dist/esm/components/select/SelectOptionsPanel.d.ts +0 -1
  67. package/dist/esm/components/select/SelectOptionsPanel.js +19 -13
  68. package/dist/esm/components/select/constants.js +5 -2
  69. package/dist/esm/components/select/index.js +18 -2
  70. package/dist/esm/components/select/select-options-manager.js +7 -3
  71. package/dist/esm/components/tab-panel/TabPanel.js +19 -13
  72. package/dist/esm/components/tab-panel/index.js +19 -3
  73. package/dist/esm/components/tab-panel/tab-panel-default-settings.js +4 -1
  74. package/dist/esm/components/tab-panel/tab-panel-settings.js +2 -1
  75. package/dist/esm/components/table/Table.d.ts +6 -2
  76. package/dist/esm/components/table/Table.js +24 -13
  77. package/dist/esm/components/table/index.js +17 -1
  78. package/dist/esm/components/toast/index.js +17 -1
  79. package/dist/esm/components/toast/toast.js +49 -9
  80. package/dist/esm/components/tooltip/index.js +19 -3
  81. package/dist/esm/components/tooltip/tooltip-defaults.js +4 -1
  82. package/dist/esm/components/tooltip/tooltip-function.d.ts +1 -1
  83. package/dist/esm/components/tooltip/tooltip-function.js +25 -21
  84. package/dist/esm/components/tooltip/tooltip-interfaces.js +2 -1
  85. package/dist/esm/components/tree/Tree.d.ts +30 -30
  86. package/dist/esm/components/tree/Tree.js +30 -23
  87. package/dist/esm/components/tree/index.js +19 -3
  88. package/dist/esm/components/tree/tree-node.interface.js +2 -1
  89. package/dist/esm/components/tree/tree-utils.js +4 -1
  90. package/dist/esm/index.js +18 -2
  91. package/dist/esm/utils/date-time.js +6 -2
  92. package/dist/esm/utils/dom.js +6 -2
  93. package/dist/esm/utils/events.js +4 -1
  94. package/dist/esm/utils/index.js +19 -3
  95. package/package.json +1 -1
@@ -1,3 +1,19 @@
1
- export * from "./tooltip-defaults";
2
- export * from "./tooltip-function";
3
- export * from "./tooltip-interfaces";
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./tooltip-defaults"), exports);
18
+ __exportStar(require("./tooltip-function"), exports);
19
+ __exportStar(require("./tooltip-interfaces"), exports);
@@ -1,4 +1,7 @@
1
- export const TOOLTIP_DEFAULTS = {
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.TOOLTIP_DEFAULTS = void 0;
4
+ exports.TOOLTIP_DEFAULTS = {
2
5
  /** How to position the tooltips by default */
3
6
  DEFAULT_POS: "cursor",
4
7
  /** Delay in milliseconds before showing the tooltip */
@@ -23,7 +23,7 @@ export declare function tooltip(ev: MouseEvent, tooltip: string, opts?: Partial<
23
23
  * }, "Click me"),
24
24
  * // is equivalent to:
25
25
  * m("button", {
26
- * onmousenter: (ev: Mousevent) => tooltip(ev, "Click the button"),
26
+ * onmouseenter: (ev: MouseEvent) => tooltip(ev, "Click the button"),
27
27
  * }, "Click me"),
28
28
  * ```
29
29
  * @param value
@@ -1,4 +1,8 @@
1
- import { TOOLTIP_DEFAULTS } from "./tooltip-defaults";
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.tooltip = tooltip;
4
+ exports.tooltipSpread = tooltipSpread;
5
+ const tooltip_defaults_1 = require("./tooltip-defaults");
2
6
  /**
3
7
  * Display a tooltip using the given mouse event.
4
8
  * Call this function from an element's "mouseenter" event.
@@ -12,19 +16,19 @@ import { TOOLTIP_DEFAULTS } from "./tooltip-defaults";
12
16
  * @param opts
13
17
  * @returns
14
18
  */
15
- export function tooltip(ev, tooltip, opts) {
19
+ function tooltip(ev, tooltip, opts) {
16
20
  var _a;
17
- if (TOOLTIP_DEFAULTS.IS_ENABLED === false)
21
+ if (tooltip_defaults_1.TOOLTIP_DEFAULTS.IS_ENABLED === false)
18
22
  return;
19
23
  // If there is no tooltip, don't bother
20
24
  if (!tooltip)
21
25
  return;
22
26
  const target = ev.currentTarget;
23
27
  const eventTarget = ev.target;
24
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`target is ${target === null || target === void 0 ? void 0 : target.tagName}`);
25
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`event target is ${eventTarget === null || eventTarget === void 0 ? void 0 : eventTarget.tagName}`);
28
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`target is ${target === null || target === void 0 ? void 0 : target.tagName}`);
29
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`event target is ${eventTarget === null || eventTarget === void 0 ? void 0 : eventTarget.tagName}`);
26
30
  if (!target) {
27
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("No target; returning from tooltip()");
31
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("No target; returning from tooltip()");
28
32
  return;
29
33
  }
30
34
  // if (target?.classList.contains(TOOLTIP_CLASS) || eventTarget?.classList.contains(TOOLTIP_CLASS)) {
@@ -34,12 +38,12 @@ export function tooltip(ev, tooltip, opts) {
34
38
  let hasTooltip = false;
35
39
  target.childNodes.forEach((child, key, parent) => {
36
40
  var _a;
37
- if ((_a = child === null || child === void 0 ? void 0 : child.classList) === null || _a === void 0 ? void 0 : _a.contains(TOOLTIP_DEFAULTS.TOOLTIP_CLASS)) {
41
+ if ((_a = child === null || child === void 0 ? void 0 : child.classList) === null || _a === void 0 ? void 0 : _a.contains(tooltip_defaults_1.TOOLTIP_DEFAULTS.TOOLTIP_CLASS)) {
38
42
  hasTooltip = true;
39
43
  }
40
44
  });
41
45
  if (hasTooltip) {
42
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("Target already has tooltip; returning from tooltip()");
46
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("Target already has tooltip; returning from tooltip()");
43
47
  return;
44
48
  }
45
49
  const mousePos = { x: ev.x, y: ev.y };
@@ -50,9 +54,9 @@ export function tooltip(ev, tooltip, opts) {
50
54
  target.addEventListener("mousemove", latestPosFn);
51
55
  const timeout = setTimeout(() => {
52
56
  displayTooltip({ ev, target, tooltip, opts, mousePos });
53
- }, (_a = opts === null || opts === void 0 ? void 0 : opts.delay) !== null && _a !== void 0 ? _a : TOOLTIP_DEFAULTS.DEFAULT_DELAY);
57
+ }, (_a = opts === null || opts === void 0 ? void 0 : opts.delay) !== null && _a !== void 0 ? _a : tooltip_defaults_1.TOOLTIP_DEFAULTS.DEFAULT_DELAY);
54
58
  const clearFn = (ev) => {
55
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("Clearing tooltip timeout");
59
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log("Clearing tooltip timeout");
56
60
  clearTimeout(timeout);
57
61
  target.removeEventListener("mouseleave", clearFn);
58
62
  target.removeEventListener("mousemove", latestPosFn);
@@ -69,14 +73,14 @@ export function tooltip(ev, tooltip, opts) {
69
73
  * }, "Click me"),
70
74
  * // is equivalent to:
71
75
  * m("button", {
72
- * onmousenter: (ev: Mousevent) => tooltip(ev, "Click the button"),
76
+ * onmouseenter: (ev: MouseEvent) => tooltip(ev, "Click the button"),
73
77
  * }, "Click me"),
74
78
  * ```
75
79
  * @param value
76
80
  * @param opts
77
81
  * @returns
78
82
  */
79
- export function tooltipSpread(value, opts) {
83
+ function tooltipSpread(value, opts) {
80
84
  return {
81
85
  onmouseenter: (ev) => tooltip(ev, value, opts),
82
86
  };
@@ -90,22 +94,22 @@ function displayTooltip(settings) {
90
94
  const { ev, target, tooltip, opts, mousePos } = settings;
91
95
  const cursorOffsetX = 5;
92
96
  const cursorOffsetY = 20;
93
- const pos = (_a = opts === null || opts === void 0 ? void 0 : opts.pos) !== null && _a !== void 0 ? _a : TOOLTIP_DEFAULTS.DEFAULT_POS;
97
+ const pos = (_a = opts === null || opts === void 0 ? void 0 : opts.pos) !== null && _a !== void 0 ? _a : tooltip_defaults_1.TOOLTIP_DEFAULTS.DEFAULT_POS;
94
98
  let targetRect = target.getBoundingClientRect();
95
99
  // targetRect = new DOMRect(targetRect.x, targetRect.y, targetRect.width, targetRect.height);
96
100
  let targetCenter = {
97
101
  x: targetRect.left + (targetRect.width / 2),
98
102
  y: targetRect.top + (targetRect.height / 2),
99
103
  };
100
- const maxWidth = (opts === null || opts === void 0 ? void 0 : opts.jumbo) === true ? TOOLTIP_DEFAULTS.MAX_WIDTH_JUMBO_PX : TOOLTIP_DEFAULTS.MAX_WIDTH_PX;
101
- const maxHeight = (opts === null || opts === void 0 ? void 0 : opts.jumbo) === true ? TOOLTIP_DEFAULTS.MAX_HEIGHT_JUMBO_PX : TOOLTIP_DEFAULTS.MAX_HEIGHT_PX;
102
- const attachToBody = (_c = (_b = settings.opts) === null || _b === void 0 ? void 0 : _b.attachToBody) !== null && _c !== void 0 ? _c : TOOLTIP_DEFAULTS.ATTACH_TO_BODY;
103
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`display tooltip "${tooltip}" on element ${target.tagName}`);
104
+ const maxWidth = (opts === null || opts === void 0 ? void 0 : opts.jumbo) === true ? tooltip_defaults_1.TOOLTIP_DEFAULTS.MAX_WIDTH_JUMBO_PX : tooltip_defaults_1.TOOLTIP_DEFAULTS.MAX_WIDTH_PX;
105
+ const maxHeight = (opts === null || opts === void 0 ? void 0 : opts.jumbo) === true ? tooltip_defaults_1.TOOLTIP_DEFAULTS.MAX_HEIGHT_JUMBO_PX : tooltip_defaults_1.TOOLTIP_DEFAULTS.MAX_HEIGHT_PX;
106
+ const attachToBody = (_c = (_b = settings.opts) === null || _b === void 0 ? void 0 : _b.attachToBody) !== null && _c !== void 0 ? _c : tooltip_defaults_1.TOOLTIP_DEFAULTS.ATTACH_TO_BODY;
107
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`display tooltip "${tooltip}" on element ${target.tagName}`);
104
108
  const tooltipEl = document.createElement("div");
105
109
  tooltipEl.innerText = tooltip;
106
110
  // tooltipEl.classList.value = "px-2 py-1 text-xs text-dark font-normal rounded border border-primary bg-white fade-in-100 no-select";
107
111
  tooltipEl.classList.add("mico-tooltip-fade-in");
108
- tooltipEl.classList.add(TOOLTIP_DEFAULTS.TOOLTIP_CLASS);
112
+ tooltipEl.classList.add(tooltip_defaults_1.TOOLTIP_DEFAULTS.TOOLTIP_CLASS);
109
113
  tooltipEl.style.position = "fixed";
110
114
  tooltipEl.style.maxWidth = `${maxWidth}px`;
111
115
  tooltipEl.style.maxHeight = `${maxHeight}px`;
@@ -170,11 +174,11 @@ function displayTooltip(settings) {
170
174
  target.addEventListener("mousemove", followFn);
171
175
  target.addEventListener("mouseleave", cleanupFn);
172
176
  }
173
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`displaying tooltip at: ${tooltipEl.style.left}, ${tooltipEl.style.top}`);
177
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`displaying tooltip at: ${tooltipEl.style.left}, ${tooltipEl.style.top}`);
174
178
  const removeFn = () => {
175
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`Removing tooltip ${tooltip} from el ${target.tagName}`);
179
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(`Removing tooltip ${tooltip} from el ${target.tagName}`);
176
180
  tooltipEl.onanimationend = (ev) => {
177
- TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(ev.animationName);
181
+ tooltip_defaults_1.TOOLTIP_DEFAULTS.ENABLE_DEBUG && console.log(ev.animationName);
178
182
  if (attachToBody === true) {
179
183
  document.body.removeChild(tooltipEl);
180
184
  }
@@ -1 +1,2 @@
1
- export {};
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -7,11 +7,11 @@ export declare const Tree: m.Component<{
7
7
  /** The root list of nodes to display in the tree (circular references will crash) */
8
8
  nodes: TreeNode<any>[];
9
9
  /** Enable drag and drop reordering */
10
- enableReordering?: boolean | undefined;
10
+ enableReordering?: boolean;
11
11
  /** Enable expanding/collapsing of nodes with children */
12
- enableToggling?: boolean | undefined;
12
+ enableToggling?: boolean;
13
13
  /** Enable debug logging of certain events */
14
- enableLogging?: boolean | undefined;
14
+ enableLogging?: boolean;
15
15
  /** Function called when a node with children is toggled */
16
16
  ontoggle?: ((toggle: {
17
17
  node: TreeNode<any>;
@@ -30,23 +30,23 @@ export declare const Tree: m.Component<{
30
30
  above: boolean;
31
31
  }) => void) | undefined;
32
32
  /** Optional message to display in defined but empty children lists */
33
- emptyChildrenMessage?: string | undefined;
33
+ emptyChildrenMessage?: string;
34
34
  /** Optionally override the default icon for a collapsed node */
35
- collapsedIcon?: m.Vnode<any, any> | undefined;
35
+ collapsedIcon?: m.Vnode<any, any>;
36
36
  /** Optionally override the default icon for an expanded node */
37
- expandedIcon?: m.Vnode<any, any> | undefined;
37
+ expandedIcon?: m.Vnode<any, any>;
38
38
  /** Optionally override the default toggle icon for a node that cannot toggle */
39
- noToggleIcon?: m.Vnode<any, any> | undefined;
39
+ noToggleIcon?: m.Vnode<any, any>;
40
40
  /** Optionally enable toggling of expansion nodes by clicking their labels */
41
- toggleExpansionWithLabel?: boolean | undefined;
41
+ toggleExpansionWithLabel?: boolean;
42
42
  /** Optionally override the default nesting width */
43
- nestingWidth?: string | undefined;
43
+ nestingWidth?: string;
44
44
  /** Optionally override the default toggle button width */
45
- toggleButtonWidth?: string | undefined;
45
+ toggleButtonWidth?: string;
46
46
  /** Optional CSS classes to apply to the root div */
47
- class?: string | undefined;
47
+ class?: string;
48
48
  /** Optional CSS styles to apply to the root div */
49
- style?: string | undefined;
49
+ style?: string;
50
50
  }, {
51
51
  isReordering: boolean;
52
52
  thisEl: Element;
@@ -62,46 +62,46 @@ export declare function createTree<TNodeData extends object = {}>(): m.Component
62
62
  /** The root list of nodes to display in the tree (circular references will crash) */
63
63
  nodes: TreeNode<TNodeData>[];
64
64
  /** Enable drag and drop reordering */
65
- enableReordering?: boolean | undefined;
65
+ enableReordering?: boolean;
66
66
  /** Enable expanding/collapsing of nodes with children */
67
- enableToggling?: boolean | undefined;
67
+ enableToggling?: boolean;
68
68
  /** Enable debug logging of certain events */
69
- enableLogging?: boolean | undefined;
69
+ enableLogging?: boolean;
70
70
  /** Function called when a node with children is toggled */
71
- ontoggle?: ((toggle: {
71
+ ontoggle?: (toggle: {
72
72
  node: TreeNode<TNodeData>;
73
73
  expanded: boolean;
74
74
  recursive: boolean;
75
- }) => void) | undefined;
75
+ }) => void;
76
76
  /** Function called when a node label is clicked */
77
- onclick?: ((click: {
77
+ onclick?: (click: {
78
78
  ev: MouseEvent;
79
79
  node: TreeNode<TNodeData>;
80
- }) => void) | undefined;
80
+ }) => void;
81
81
  /** Function called when a node has been dragged to a new position in the tree */
82
- onreorder?: ((reorder: {
82
+ onreorder?: (reorder: {
83
83
  moved: TNodeData;
84
84
  target: TNodeData;
85
85
  above: boolean;
86
- }) => void) | undefined;
86
+ }) => void;
87
87
  /** Optional message to display in defined but empty children lists */
88
- emptyChildrenMessage?: string | undefined;
88
+ emptyChildrenMessage?: string;
89
89
  /** Optionally override the default icon for a collapsed node */
90
- collapsedIcon?: m.Vnode<any, any> | undefined;
90
+ collapsedIcon?: m.Vnode<any, any>;
91
91
  /** Optionally override the default icon for an expanded node */
92
- expandedIcon?: m.Vnode<any, any> | undefined;
92
+ expandedIcon?: m.Vnode<any, any>;
93
93
  /** Optionally override the default toggle icon for a node that cannot toggle */
94
- noToggleIcon?: m.Vnode<any, any> | undefined;
94
+ noToggleIcon?: m.Vnode<any, any>;
95
95
  /** Optionally enable toggling of expansion nodes by clicking their labels */
96
- toggleExpansionWithLabel?: boolean | undefined;
96
+ toggleExpansionWithLabel?: boolean;
97
97
  /** Optionally override the default nesting width */
98
- nestingWidth?: string | undefined;
98
+ nestingWidth?: string;
99
99
  /** Optionally override the default toggle button width */
100
- toggleButtonWidth?: string | undefined;
100
+ toggleButtonWidth?: string;
101
101
  /** Optional CSS classes to apply to the root div */
102
- class?: string | undefined;
102
+ class?: string;
103
103
  /** Optional CSS styles to apply to the root div */
104
- style?: string | undefined;
104
+ style?: string;
105
105
  }, {
106
106
  isReordering: boolean;
107
107
  thisEl: Element;
@@ -1,19 +1,26 @@
1
- import { compareObjects } from "@hypericon/utils";
2
- import m from "mithril";
3
- import { Icon } from "../icon";
1
+ "use strict";
2
+ var __importDefault = (this && this.__importDefault) || function (mod) {
3
+ return (mod && mod.__esModule) ? mod : { "default": mod };
4
+ };
5
+ Object.defineProperty(exports, "__esModule", { value: true });
6
+ exports.Tree = void 0;
7
+ exports.createTree = createTree;
8
+ const utils_1 = require("@hypericon/utils");
9
+ const mithril_1 = __importDefault(require("mithril"));
10
+ const icon_1 = require("../icon");
4
11
  const DATA_TRANSFER_TYPE = "application/tree-data";
5
12
  const DEFAULT_NESTING_WIDTH = "1.5rem";
6
13
  const DEFAULT_TOGGLE_WIDTH = "1.5rem";
7
14
  /**
8
15
  * An untyped tree component (see `createTree<T>()`)
9
16
  */
10
- export const Tree = createTree();
17
+ exports.Tree = createTree();
11
18
  /**
12
19
  * Build a component to display nested nodes in a tree.
13
20
  *
14
21
  * Nodes with children are collapsable, and nodes can be arbitrarily reordered.
15
22
  */
16
- export function createTree() {
23
+ function createTree() {
17
24
  // /** Reference to the TreeItem currently being dragged */
18
25
  // let draggedTreeItem: TreeItem<T> | undefined = undefined;
19
26
  const Tree = {
@@ -26,12 +33,12 @@ export function createTree() {
26
33
  view({ attrs }) {
27
34
  var _a, _b;
28
35
  const nodes = attrs.nodes;
29
- return m(".mico-tree", {
36
+ return (0, mithril_1.default)(".mico-tree", {
30
37
  style: `${(_a = attrs.style) !== null && _a !== void 0 ? _a : ""} position: relative;`,
31
38
  class: `${(_b = attrs.class) !== null && _b !== void 0 ? _b : ""}`
32
39
  }, [
33
- m("ul", nodes.map((node, i) => {
34
- return m(TreeNode, {
40
+ (0, mithril_1.default)("ul", nodes.map((node, i) => {
41
+ return (0, mithril_1.default)(TreeNode, {
35
42
  // key: i, // item.key,
36
43
  node,
37
44
  enableReordering: attrs.enableReordering,
@@ -103,7 +110,7 @@ export function createTree() {
103
110
  const movedNodeData = JSON.parse(ev.dataTransfer.getData(DATA_TRANSFER_TYPE));
104
111
  attrs.enableLogging && console.log(`on drop`, movedNodeData, "on", node.data);
105
112
  // attrs.reorderfinish?.();
106
- const droppedOnSelf = compareObjects(movedNodeData, node.data);
113
+ const droppedOnSelf = (0, utils_1.compareObjects)(movedNodeData, node.data);
107
114
  if (!droppedOnSelf) {
108
115
  (_a = attrs.onreorder) === null || _a === void 0 ? void 0 : _a.call(attrs, { moved: movedNodeData, target: node.data, above: this.isTargettingAbove });
109
116
  }
@@ -125,14 +132,14 @@ export function createTree() {
125
132
  const expanded = canHaveChildren && node.expanded;
126
133
  const collapsed = canHaveChildren && !node.expanded;
127
134
  const targettingDragClass = this.isReorderingOver ? (this.isTargettingAbove ? "mico-tree-reorder-above" : "mico-tree-reorder-below") : "";
128
- return m("li.mico-tree-node", {
135
+ return (0, mithril_1.default)("li.mico-tree-node", {
129
136
  // key: item.key,
130
137
  }, [
131
138
  // The items's label (either a string or Vnode) and expand/collapse control (if there are children)
132
- m("", {
139
+ (0, mithril_1.default)("", {
133
140
  style: `display: flex; align-items: stretch; max-width: 100%; overflow-x: hidden; ${(attrs.toggleExpansionWithLabel && enableToggling) ? `cursor: pointer;` : ``}`,
134
141
  }, [
135
- expanded ? m("button.mico-tree-toggle", {
142
+ expanded ? (0, mithril_1.default)("button.mico-tree-toggle", {
136
143
  style: `width: ${attrs.toggleButtonWidth}; flex: none;`,
137
144
  // class: enableToggling ? `hover:text-primary` : `text-view-icon`,
138
145
  disabled: !enableToggling,
@@ -143,8 +150,8 @@ export function createTree() {
143
150
  node.expanded = false;
144
151
  (_a = attrs.ontoggle) === null || _a === void 0 ? void 0 : _a.call(attrs, { node, expanded: false, recursive: ev.altKey });
145
152
  },
146
- }, attrs.expandedIcon || m(Icon, { fas: "chevron-down" })) : undefined,
147
- collapsed ? m("button.mico-tree-toggle", {
153
+ }, attrs.expandedIcon || (0, mithril_1.default)(icon_1.Icon, { fas: "chevron-down" })) : undefined,
154
+ collapsed ? (0, mithril_1.default)("button.mico-tree-toggle", {
148
155
  style: `width: ${attrs.toggleButtonWidth}; flex: none;`,
149
156
  // class: enableToggling ? `hover:text-primary` : `text-view-icon`,
150
157
  disabled: !enableToggling,
@@ -155,13 +162,13 @@ export function createTree() {
155
162
  node.expanded = true;
156
163
  (_a = attrs.ontoggle) === null || _a === void 0 ? void 0 : _a.call(attrs, { node, expanded: true, recursive: ev.altKey });
157
164
  },
158
- }, attrs.collapsedIcon || m(Icon, { fas: "chevron-right" })) : undefined,
159
- (!canHaveChildren) ? m(".mico-tree-toggle", {
165
+ }, attrs.collapsedIcon || (0, mithril_1.default)(icon_1.Icon, { fas: "chevron-right" })) : undefined,
166
+ (!canHaveChildren) ? (0, mithril_1.default)(".mico-tree-toggle", {
160
167
  style: `width: ${attrs.toggleButtonWidth}; flex: none;`,
161
- }, attrs.noToggleIcon || m(Icon, { fas: "caret-right" })) : [],
162
- m(".mico-tree-label", {
168
+ }, attrs.noToggleIcon || (0, mithril_1.default)(icon_1.Icon, { fas: "caret-right" })) : [],
169
+ (0, mithril_1.default)(".mico-tree-label", {
163
170
  class: `${targettingDragClass}`,
164
- style: "position: relative; flex: 1 1 0%; overflow-x: hidden;",
171
+ style: "position: relative; flex: 1 1 0%; overflow-x: hidden;", // width: calc(100% - 1.5rem);
165
172
  draggable: enableReordering && (node.draggable !== false),
166
173
  onclick: (ev) => {
167
174
  var _a;
@@ -180,16 +187,16 @@ export function createTree() {
180
187
  ondragend: (ev) => this.handleDragEnd(ev, node),
181
188
  }, [
182
189
  (typeof node.label === "string")
183
- ? m("span", node.label)
190
+ ? (0, mithril_1.default)("span", node.label)
184
191
  : node.label,
185
192
  ]),
186
193
  ]),
187
194
  // Any nested children within the item
188
- (expanded) ? m("ul", {
195
+ (expanded) ? (0, mithril_1.default)("ul", {
189
196
  style: `margin-left: ${attrs.nestingWidth};`,
190
197
  }, [
191
198
  ...(node.children || []).map((child, i) => {
192
- return m(TreeNode, {
199
+ return (0, mithril_1.default)(TreeNode, {
193
200
  // key: child.key,
194
201
  node: child,
195
202
  enableToggling: attrs.enableToggling,
@@ -211,7 +218,7 @@ export function createTree() {
211
218
  }),
212
219
  ]) : [],
213
220
  (canHaveChildren && !hasChildren && expanded && emptyChildrenMessage !== undefined) ? [
214
- m("span.mico-tree-empty-children", {
221
+ (0, mithril_1.default)("span.mico-tree-empty-children", {
215
222
  style: `margin-left: ${attrs.toggleButtonWidth};`,
216
223
  }, emptyChildrenMessage)
217
224
  ] : [],
@@ -1,3 +1,19 @@
1
- export * from "./Tree";
2
- export * from "./tree-node.interface";
3
- export * from "./tree-utils";
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./Tree"), exports);
18
+ __exportStar(require("./tree-node.interface"), exports);
19
+ __exportStar(require("./tree-utils"), exports);
@@ -1 +1,2 @@
1
- export {};
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -1,3 +1,6 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.allTreeDescendants = allTreeDescendants;
1
4
  /**
2
5
  * Recursively find the list of all descendants of the given node.
3
6
  *
@@ -7,7 +10,7 @@
7
10
  * @param node
8
11
  * @returns
9
12
  */
10
- export function allTreeDescendants(node) {
13
+ function allTreeDescendants(node) {
11
14
  var _a;
12
15
  const descendants = [];
13
16
  for (const child of (_a = node.children) !== null && _a !== void 0 ? _a : []) {
package/dist/esm/index.js CHANGED
@@ -1,2 +1,18 @@
1
- export * from "./components";
2
- export * from "./utils";
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./components"), exports);
18
+ __exportStar(require("./utils"), exports);
@@ -1,4 +1,8 @@
1
- export function dateToHtml(d) {
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.dateToHtml = dateToHtml;
4
+ exports.dateToHtmlUTC = dateToHtmlUTC;
5
+ function dateToHtml(d) {
2
6
  if (d === undefined)
3
7
  return undefined;
4
8
  if (d === null)
@@ -9,7 +13,7 @@ export function dateToHtml(d) {
9
13
  String(d.getDate()).padStart(2, "0"),
10
14
  ].join("-");
11
15
  }
12
- export function dateToHtmlUTC(d) {
16
+ function dateToHtmlUTC(d) {
13
17
  if (d === undefined)
14
18
  return undefined;
15
19
  if (d === null)
@@ -1,3 +1,7 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.coordsWithinElement = coordsWithinElement;
4
+ exports.mouseWithinElement = mouseWithinElement;
1
5
  /**
2
6
  *
3
7
  * @param x
@@ -6,7 +10,7 @@
6
10
  * @param strict
7
11
  * @returns
8
12
  */
9
- export function coordsWithinElement(x, y, element, strict = false) {
13
+ function coordsWithinElement(x, y, element, strict = false) {
10
14
  const rect = element.getBoundingClientRect();
11
15
  return strict
12
16
  ? (rect.left < x && x < rect.right && rect.top < y && y < rect.bottom)
@@ -18,7 +22,7 @@ export function coordsWithinElement(x, y, element, strict = false) {
18
22
  * @param element
19
23
  * @returns
20
24
  */
21
- export function mouseWithinElement(ev, element) {
25
+ function mouseWithinElement(ev, element) {
22
26
  const elementRect = element.getBoundingClientRect();
23
27
  const isWithin = (ev.clientY >= elementRect.top) &&
24
28
  (ev.clientY <= elementRect.bottom) &&
@@ -1,4 +1,7 @@
1
- export function dragEventFiles(ev) {
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.dragEventFiles = dragEventFiles;
4
+ function dragEventFiles(ev) {
2
5
  var _a, _b, _c;
3
6
  const files = [];
4
7
  if ((_a = ev.dataTransfer) === null || _a === void 0 ? void 0 : _a.items) {
@@ -1,3 +1,19 @@
1
- export * from "./date-time";
2
- export * from "./dom";
3
- export * from "./events";
1
+ "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __exportStar = (this && this.__exportStar) || function(m, exports) {
14
+ for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
15
+ };
16
+ Object.defineProperty(exports, "__esModule", { value: true });
17
+ __exportStar(require("./date-time"), exports);
18
+ __exportStar(require("./dom"), exports);
19
+ __exportStar(require("./events"), exports);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hypericon/mico",
3
- "version": "0.4.1",
3
+ "version": "0.5.0",
4
4
  "description": "UI components and utilities with Mithril",
5
5
  "author": "Ed Johnson, Hypericon Ltd",
6
6
  "license": "MIT",