@jirawatpyk/aura-react 4.5.0 → 4.6.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.
@@ -5,82 +5,71 @@ import { createPortal } from "react-dom";
5
5
  import { cx, uid, useMergedRef } from "./internal.js";
6
6
  import { IconButton } from "./IconButton.js";
7
7
  import { useModal } from "./overlay.js";
8
- const h = React.createElement;
9
8
  const Dialog = React.forwardRef(function Dialog2(props, ref) {
10
- var t = useStrings();
11
- var own = React.useRef(null), merged = useMergedRef(ref, own), titleId = uid(), descId = uid();
9
+ const t = useStrings();
10
+ const own = React.useRef(null), merged = useMergedRef(ref, own), titleId = uid(), descId = uid();
12
11
  function close() {
13
12
  if (props.dismissible !== false && props.onClose) props.onClose();
14
13
  }
15
- var modal = useModal(props.open, own, { autoFocus: props.autoFocus, onEscape: close, bodySelector: ".aura-dialog__body", footSelector: ".aura-dialog__foot" });
14
+ const modal = useModal(props.open, own, {
15
+ autoFocus: props.autoFocus,
16
+ onEscape: close,
17
+ bodySelector: ".aura-dialog__body",
18
+ footSelector: ".aura-dialog__foot"
19
+ });
16
20
  if (!modal.ready) return null;
17
21
  return createPortal(
18
- h(
22
+ /* @__PURE__ */ React.createElement("div", { className: "aura-dialog-layer", onKeyDown: modal.onKeyDown }, /* @__PURE__ */ React.createElement("div", { className: "aura-scrim", onClick: close, "aria-hidden": true }), /* @__PURE__ */ React.createElement(
19
23
  "div",
20
- { className: "aura-dialog-layer", onKeyDown: modal.onKeyDown },
21
- h("div", { className: "aura-scrim", onClick: close, "aria-hidden": true }),
22
- h(
23
- "div",
24
- {
25
- ref: merged,
26
- role: props.role || "dialog",
27
- "aria-modal": true,
28
- "aria-labelledby": titleId,
29
- "aria-describedby": props.description ? descId : void 0,
30
- tabIndex: -1,
31
- className: cx("aura-dialog", "aura-dialog--" + (props.size || "md"), props.className)
32
- },
33
- h(
34
- "div",
35
- { className: "aura-dialog__head" },
36
- h("h2", { className: "aura-dialog__title", id: titleId }, props.title),
37
- props.dismissible !== false ? h(IconButton, { icon: "x", label: t.close, className: "aura-dialog__close", onClick: close }) : null
38
- ),
39
- props.description ? h("p", { className: "aura-dialog__desc", id: descId }, props.description) : null,
40
- props.children ? h("div", { className: "aura-dialog__body" }, props.children) : null,
41
- props.footer ? h("div", { className: "aura-dialog__foot" }, props.footer) : null
42
- )
43
- ),
24
+ {
25
+ ref: merged,
26
+ role: props.role || "dialog",
27
+ "aria-modal": true,
28
+ "aria-labelledby": titleId,
29
+ "aria-describedby": props.description ? descId : void 0,
30
+ tabIndex: -1,
31
+ className: cx("aura-dialog", "aura-dialog--" + (props.size || "md"), props.className)
32
+ },
33
+ /* @__PURE__ */ React.createElement("div", { className: "aura-dialog__head" }, /* @__PURE__ */ React.createElement("h2", { className: "aura-dialog__title", id: titleId }, props.title), props.dismissible !== false ? /* @__PURE__ */ React.createElement(IconButton, { icon: "x", label: t.close, className: "aura-dialog__close", onClick: close }) : null),
34
+ props.description ? /* @__PURE__ */ React.createElement("p", { className: "aura-dialog__desc", id: descId }, props.description) : null,
35
+ props.children ? /* @__PURE__ */ React.createElement("div", { className: "aura-dialog__body" }, props.children) : null,
36
+ props.footer ? /* @__PURE__ */ React.createElement("div", { className: "aura-dialog__foot" }, props.footer) : null
37
+ )),
44
38
  document.body
45
39
  );
46
40
  });
47
41
  const Drawer = React.forwardRef(function Drawer2(props, ref) {
48
- var t = useStrings();
49
- var own = React.useRef(null), merged = useMergedRef(ref, own), titleId = uid(), descId = uid();
42
+ const t = useStrings();
43
+ const own = React.useRef(null), merged = useMergedRef(ref, own), titleId = uid(), descId = uid();
50
44
  function close() {
51
45
  if (props.dismissible !== false && props.onClose) props.onClose();
52
46
  }
53
- var modal = useModal(props.open, own, { autoFocus: props.autoFocus, onEscape: close, bodySelector: ".aura-drawer__body", footSelector: ".aura-drawer__foot" });
47
+ const modal = useModal(props.open, own, {
48
+ autoFocus: props.autoFocus,
49
+ onEscape: close,
50
+ bodySelector: ".aura-drawer__body",
51
+ footSelector: ".aura-drawer__foot"
52
+ });
54
53
  if (!modal.ready) return null;
55
- var side = props.side === "left" ? "left" : "right";
54
+ const side = props.side === "left" ? "left" : "right";
56
55
  return createPortal(
57
- h(
56
+ /* @__PURE__ */ React.createElement("div", { className: "aura-dialog-layer aura-drawer-layer", onKeyDown: modal.onKeyDown }, /* @__PURE__ */ React.createElement("div", { className: "aura-scrim", onClick: close, "aria-hidden": true }), /* @__PURE__ */ React.createElement(
58
57
  "div",
59
- { className: "aura-dialog-layer aura-drawer-layer", onKeyDown: modal.onKeyDown },
60
- h("div", { className: "aura-scrim", onClick: close, "aria-hidden": true }),
61
- h(
62
- "div",
63
- {
64
- ref: merged,
65
- role: "dialog",
66
- "aria-modal": true,
67
- "aria-labelledby": props.title ? titleId : void 0,
68
- "aria-label": props.title ? void 0 : props["aria-label"],
69
- "aria-describedby": props.description ? descId : void 0,
70
- tabIndex: -1,
71
- className: cx("aura-drawer", "aura-drawer--" + side, "aura-drawer--" + (props.size || "md"), props.className)
72
- },
73
- props.title || props.dismissible !== false ? h(
74
- "div",
75
- { className: "aura-drawer__head" },
76
- props.title ? h("h2", { className: "aura-drawer__title", id: titleId }, props.title) : h("span", { style: { flex: 1 } }),
77
- props.dismissible !== false ? h(IconButton, { icon: "x", label: t.close, onClick: close }) : null
78
- ) : null,
79
- props.description ? h("p", { className: "aura-drawer__desc", id: descId }, props.description) : null,
80
- h("div", { className: "aura-drawer__body" }, props.children),
81
- props.footer ? h("div", { className: "aura-drawer__foot" }, props.footer) : null
82
- )
83
- ),
58
+ {
59
+ ref: merged,
60
+ role: "dialog",
61
+ "aria-modal": true,
62
+ "aria-labelledby": props.title ? titleId : void 0,
63
+ "aria-label": props.title ? void 0 : props["aria-label"],
64
+ "aria-describedby": props.description ? descId : void 0,
65
+ tabIndex: -1,
66
+ className: cx("aura-drawer", "aura-drawer--" + side, "aura-drawer--" + (props.size || "md"), props.className)
67
+ },
68
+ props.title || props.dismissible !== false ? /* @__PURE__ */ React.createElement("div", { className: "aura-drawer__head" }, props.title ? /* @__PURE__ */ React.createElement("h2", { className: "aura-drawer__title", id: titleId }, props.title) : /* @__PURE__ */ React.createElement("span", { style: { flex: 1 } }), props.dismissible !== false ? /* @__PURE__ */ React.createElement(IconButton, { icon: "x", label: t.close, onClick: close }) : null) : null,
69
+ props.description ? /* @__PURE__ */ React.createElement("p", { className: "aura-drawer__desc", id: descId }, props.description) : null,
70
+ /* @__PURE__ */ React.createElement("div", { className: "aura-drawer__body" }, props.children),
71
+ props.footer ? /* @__PURE__ */ React.createElement("div", { className: "aura-drawer__foot" }, props.footer) : null
72
+ )),
84
73
  document.body
85
74
  );
86
75
  });
@@ -2,14 +2,13 @@
2
2
  import * as React from "react";
3
3
  import { Menu } from "./Menu.js";
4
4
  import { useMergedRef } from "./internal.js";
5
- const h = React.createElement;
6
5
  const DropdownMenu = React.forwardRef(function DropdownMenu2(props, ref) {
7
- var st = React.useState(null), anchor = st[0], setAnchor = st[1];
8
- var wrap = React.useRef(null), wrapMerged = useMergedRef(ref, wrap);
9
- var child = React.Children.only(props.trigger);
6
+ const st = React.useState(null), anchor = st[0], setAnchor = st[1];
7
+ const wrap = React.useRef(null), wrapMerged = useMergedRef(ref, wrap);
8
+ const child = React.Children.only(props.trigger);
10
9
  function toggle(e) {
11
10
  if (child.props.onClick) child.props.onClick(e);
12
- var el = wrap.current && (wrap.current.querySelector('button, [role="button"], a') || wrap.current);
11
+ const el = wrap.current && (wrap.current.querySelector('button, [role="button"], a') || wrap.current);
13
12
  setAnchor(anchor ? null : el);
14
13
  }
15
14
  function onKeyDown(e) {
@@ -18,11 +17,9 @@ const DropdownMenu = React.forwardRef(function DropdownMenu2(props, ref) {
18
17
  setAnchor(wrap.current.querySelector('button, [role="button"], a') || wrap.current);
19
18
  }
20
19
  }
21
- return h(
22
- "span",
23
- { ref: wrapMerged, className: "aura-dropdown", onKeyDown },
24
- React.cloneElement(child, { onClick: toggle, "aria-haspopup": "menu", "aria-expanded": anchor ? true : false }),
25
- anchor ? h(Menu, {
20
+ return /* @__PURE__ */ React.createElement("span", { ref: wrapMerged, className: "aura-dropdown", onKeyDown }, React.cloneElement(child, { onClick: toggle, "aria-haspopup": "menu", "aria-expanded": anchor ? true : false }), anchor ? /* @__PURE__ */ React.createElement(
21
+ Menu,
22
+ {
26
23
  anchor,
27
24
  label: props.label,
28
25
  items: props.items,
@@ -30,8 +27,8 @@ const DropdownMenu = React.forwardRef(function DropdownMenu2(props, ref) {
30
27
  setAnchor(null);
31
28
  if (restore && typeof anchor.focus === "function") anchor.focus();
32
29
  }
33
- }) : null
34
- );
30
+ }
31
+ ) : null);
35
32
  });
36
33
  export {
37
34
  DropdownMenu
@@ -5,11 +5,10 @@ import { useStrings } from "./locale.js";
5
5
  import { Icon } from "./Icon.js";
6
6
  import { IconButton } from "./IconButton.js";
7
7
  import { Field } from "./forms.js";
8
- const h = React.createElement;
9
8
  function formatBytes(n) {
10
9
  if (n == null) return "";
11
10
  if (n < 1024) return n + " B";
12
- var u = ["KB", "MB", "GB"], i = -1;
11
+ let u = ["KB", "MB", "GB"], i = -1;
13
12
  do {
14
13
  n /= 1024;
15
14
  i++;
@@ -18,7 +17,7 @@ function formatBytes(n) {
18
17
  }
19
18
  function matches(file, accept) {
20
19
  if (!accept) return true;
21
- var name = (file.name || "").toLowerCase(), type = (file.type || "").toLowerCase();
20
+ const name = (file.name || "").toLowerCase(), type = (file.type || "").toLowerCase();
22
21
  return accept.split(",").some(function(a) {
23
22
  a = a.trim().toLowerCase();
24
23
  if (!a) return false;
@@ -38,17 +37,17 @@ function describeAccept(accept, t) {
38
37
  return arr.indexOf(x) === i;
39
38
  }).join(", ");
40
39
  }
41
- var seq = 0;
40
+ let seq = 0;
42
41
  const FileUpload = React.forwardRef(function FileUpload2(props, ref) {
43
- var t = useStrings();
44
- var auto = uid(), id = props.id || auto;
45
- var st = useMaybeControlled(props.value, props.defaultValue || [], props.onChange);
46
- var items = st[0] || [];
47
- var dragState = React.useState(false), over = dragState[0];
48
- var inputRef = React.useRef(null), inputMerged = useMergedRef(ref, inputRef);
49
- var urls = React.useRef({});
50
- var maxFiles = props.multiple ? props.maxFiles : 1;
51
- var note = t.accepts(describeAccept(props.accept, t), props.maxSize ? formatBytes(props.maxSize) : "");
42
+ const t = useStrings();
43
+ const auto = uid(), id = props.id || auto;
44
+ const st = useMaybeControlled(props.value, props.defaultValue || [], props.onChange);
45
+ const items = st[0] || [];
46
+ const dragState = React.useState(false), over = dragState[0];
47
+ const inputRef = React.useRef(null), inputMerged = useMergedRef(ref, inputRef);
48
+ const urls = React.useRef({});
49
+ const maxFiles = props.multiple ? props.maxFiles : 1;
50
+ const note = t.accepts(describeAccept(props.accept, t), props.maxSize ? formatBytes(props.maxSize) : "");
52
51
  React.useEffect(function() {
53
52
  return function() {
54
53
  Object.keys(urls.current).forEach(function(k) {
@@ -62,19 +61,27 @@ const FileUpload = React.forwardRef(function FileUpload2(props, ref) {
62
61
  return urls.current[it.id];
63
62
  }
64
63
  function add(list) {
65
- var files = Array.prototype.slice.call(list || []);
64
+ const files = Array.prototype.slice.call(list || []);
66
65
  if (!files.length || props.disabled) return;
67
- var keep = props.multiple ? items.slice() : [];
68
- var room = maxFiles ? maxFiles - keep.filter(function(i) {
66
+ const keep = props.multiple ? items.slice() : [];
67
+ let room = maxFiles ? maxFiles - keep.filter(function(i) {
69
68
  return !i.error;
70
69
  }).length : Infinity;
71
70
  files.forEach(function(f) {
72
- var err = null;
71
+ let err = null;
73
72
  if (!matches(f, props.accept)) err = t.fileWrongType;
74
73
  else if (props.maxSize && f.size > props.maxSize) err = t.fileTooBig(formatBytes(props.maxSize));
75
74
  else if (room <= 0) err = t.tooManyFiles(maxFiles);
76
75
  else room--;
77
- keep.push({ id: "f" + ++seq, file: f, name: f.name, size: f.size, type: f.type, status: err ? "error" : "ready", error: err || void 0 });
76
+ keep.push({
77
+ id: "f" + ++seq,
78
+ file: f,
79
+ name: f.name,
80
+ size: f.size,
81
+ type: f.type,
82
+ status: err ? "error" : "ready",
83
+ error: err || void 0
84
+ });
78
85
  });
79
86
  st[1](keep);
80
87
  }
@@ -83,17 +90,28 @@ const FileUpload = React.forwardRef(function FileUpload2(props, ref) {
83
90
  URL.revokeObjectURL(urls.current[it.id]);
84
91
  delete urls.current[it.id];
85
92
  }
86
- st[1](items.filter(function(x) {
87
- return x.id !== it.id;
88
- }));
93
+ st[1](
94
+ items.filter(function(x) {
95
+ return x.id !== it.id;
96
+ })
97
+ );
89
98
  if (props.onRemove) props.onRemove(it);
90
99
  if (inputRef.current) inputRef.current.focus();
91
100
  }
92
- var error = props.error;
93
- return h(
101
+ const error = props.error;
102
+ return /* @__PURE__ */ React.createElement(
94
103
  Field,
95
- { id, label: props.label, hint: props.hint, error, required: props.required, optional: props.optional, disabled: props.disabled, className: props.className },
96
- h(
104
+ {
105
+ id,
106
+ label: props.label,
107
+ hint: props.hint,
108
+ error,
109
+ required: props.required,
110
+ optional: props.optional,
111
+ disabled: props.disabled,
112
+ className: props.className
113
+ },
114
+ /* @__PURE__ */ React.createElement(
97
115
  "div",
98
116
  {
99
117
  className: cx("aura-upload", over && "is-over", props.disabled && "is-disabled", error && "is-invalid"),
@@ -114,56 +132,56 @@ const FileUpload = React.forwardRef(function FileUpload2(props, ref) {
114
132
  add(e.dataTransfer && e.dataTransfer.files);
115
133
  }
116
134
  },
117
- h(Icon, { name: "cloud-upload", size: "lg", className: "aura-upload__icon" }),
118
- h("span", { className: "aura-upload__text" }, t.dropFiles, " "),
119
- /* The real input: visually hidden, still the labelled, focusable control (keyboard and screen readers use it). */
120
- h("input", {
121
- ref: inputMerged,
122
- id,
123
- type: "file",
124
- className: "aura-upload__input",
125
- accept: props.accept,
126
- multiple: !!props.multiple,
127
- disabled: props.disabled,
128
- name: props.name,
129
- required: props.required && !items.some(function(i) {
130
- return !i.error;
131
- }),
132
- "aria-invalid": error ? true : void 0,
133
- "aria-describedby": [error ? id + "-error" : props.hint ? id + "-hint" : null, note ? id + "-note" : null].filter(Boolean).join(" ") || void 0,
134
- onChange: function(e) {
135
- add(e.target.files);
136
- e.target.value = "";
135
+ /* @__PURE__ */ React.createElement(Icon, { name: "cloud-upload", size: "lg", className: "aura-upload__icon" }),
136
+ /* @__PURE__ */ React.createElement("span", { className: "aura-upload__text" }, t.dropFiles, " "),
137
+ /* @__PURE__ */ React.createElement(
138
+ "input",
139
+ {
140
+ ref: inputMerged,
141
+ id,
142
+ type: "file",
143
+ className: "aura-upload__input",
144
+ accept: props.accept,
145
+ multiple: !!props.multiple,
146
+ disabled: props.disabled,
147
+ name: props.name,
148
+ required: props.required && !items.some(function(i) {
149
+ return !i.error;
150
+ }),
151
+ "aria-invalid": error ? true : void 0,
152
+ "aria-describedby": [error ? id + "-error" : props.hint ? id + "-hint" : null, note ? id + "-note" : null].filter(Boolean).join(" ") || void 0,
153
+ onChange: function(e) {
154
+ add(e.target.files);
155
+ e.target.value = "";
156
+ }
137
157
  }
138
- }),
139
- h("span", { className: "aura-upload__browse", "aria-hidden": true }, props.multiple ? t.browse : t.browseOne),
140
- note ? h("span", { className: "aura-upload__note", id: id + "-note" }, note) : null
158
+ ),
159
+ /* @__PURE__ */ React.createElement("span", { className: "aura-upload__browse", "aria-hidden": true }, props.multiple ? t.browse : t.browseOne),
160
+ note ? /* @__PURE__ */ React.createElement("span", { className: "aura-upload__note", id: id + "-note" }, note) : null
141
161
  ),
142
- items.length ? h("ul", { className: "aura-upload__list", "aria-live": "polite" }, items.map(function(it) {
143
- var src = thumb(it);
144
- return h(
145
- "li",
146
- { key: it.id, className: cx("aura-upload__item", it.error && "is-error") },
147
- src ? h("img", { className: "aura-upload__thumb", src, alt: "" }) : h("span", { className: "aura-upload__thumb is-icon", "aria-hidden": true }, h(Icon, { name: /^image\//.test(it.type || "") ? "image" : "file", size: "md" })),
148
- h(
149
- "span",
150
- { className: "aura-upload__meta" },
151
- h("span", { className: "aura-upload__name" }, it.name),
152
- h(
153
- "span",
154
- { className: "aura-upload__sub" },
155
- it.error ? h(React.Fragment, null, h(Icon, { name: "circle-alert", size: 12 }), it.error) : it.status === "uploading" ? t.uploading + (it.progress != null ? " " + Math.round(it.progress) + "%" : "") : it.status === "done" ? h(React.Fragment, null, h(Icon, { name: "circle-check", size: 12 }), formatBytes(it.size)) : formatBytes(it.size)
156
- ),
157
- it.status === "uploading" ? h(
158
- "span",
159
- { className: "aura-upload__bar", role: "progressbar", "aria-label": it.name, "aria-valuemin": 0, "aria-valuemax": 100, "aria-valuenow": it.progress != null ? Math.round(it.progress) : void 0 },
160
- h("span", { style: { width: (it.progress || 0) + "%" } })
161
- ) : null
162
- ),
163
- h(IconButton, { icon: "x", label: t.remove(it.name), onClick: function() {
164
- remove(it);
165
- } })
166
- );
162
+ items.length ? /* @__PURE__ */ React.createElement("ul", { className: "aura-upload__list", "aria-live": "polite" }, items.map(function(it) {
163
+ const src = thumb(it);
164
+ return /* @__PURE__ */ React.createElement("li", { key: it.id, className: cx("aura-upload__item", it.error && "is-error") }, src ? /* @__PURE__ */ React.createElement("img", { className: "aura-upload__thumb", src, alt: "" }) : /* @__PURE__ */ React.createElement("span", { className: "aura-upload__thumb is-icon", "aria-hidden": true }, /* @__PURE__ */ React.createElement(Icon, { name: /^image\//.test(it.type || "") ? "image" : "file", size: "md" })), /* @__PURE__ */ React.createElement("span", { className: "aura-upload__meta" }, /* @__PURE__ */ React.createElement("span", { className: "aura-upload__name" }, it.name), /* @__PURE__ */ React.createElement("span", { className: "aura-upload__sub" }, it.error ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Icon, { name: "circle-alert", size: 12 }), it.error) : it.status === "uploading" ? t.uploading + (it.progress != null ? " " + Math.round(it.progress) + "%" : "") : it.status === "done" ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Icon, { name: "circle-check", size: 12 }), formatBytes(it.size)) : formatBytes(it.size)), it.status === "uploading" ? /* @__PURE__ */ React.createElement(
165
+ "span",
166
+ {
167
+ className: "aura-upload__bar",
168
+ role: "progressbar",
169
+ "aria-label": it.name,
170
+ "aria-valuemin": 0,
171
+ "aria-valuemax": 100,
172
+ "aria-valuenow": it.progress != null ? Math.round(it.progress) : void 0
173
+ },
174
+ /* @__PURE__ */ React.createElement("span", { style: { width: (it.progress || 0) + "%" } })
175
+ ) : null), /* @__PURE__ */ React.createElement(
176
+ IconButton,
177
+ {
178
+ icon: "x",
179
+ label: t.remove(it.name),
180
+ onClick: function() {
181
+ remove(it);
182
+ }
183
+ }
184
+ ));
167
185
  })) : null
168
186
  );
169
187
  });
package/dist/esm/Icon.js CHANGED
@@ -2,30 +2,35 @@
2
2
  import * as React from "react";
3
3
  import { cx } from "./internal.js";
4
4
  const h = React.createElement;
5
- var ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]] };
6
- var SIZES = { sm: 16, md: 20, lg: 24 };
5
+ const ICONS = { "check": [["path", { "d": "M20 6 9 17l-5-5" }]], "x": [["path", { "d": "M18 6 6 18" }], ["path", { "d": "m6 6 12 12" }]], "plus": [["path", { "d": "M5 12h14" }], ["path", { "d": "M12 5v14" }]], "minus": [["path", { "d": "M5 12h14" }]], "search": [["path", { "d": "m21 21-4.34-4.34" }], ["circle", { "cx": "11", "cy": "11", "r": "8" }]], "chevron-down": [["path", { "d": "m6 9 6 6 6-6" }]], "chevron-up": [["path", { "d": "m18 15-6-6-6 6" }]], "chevron-left": [["path", { "d": "m15 18-6-6 6-6" }]], "chevron-right": [["path", { "d": "m9 18 6-6-6-6" }]], "arrow-right": [["path", { "d": "M5 12h14" }], ["path", { "d": "m12 5 7 7-7 7" }]], "arrow-up-right": [["path", { "d": "M7 7h10v10" }], ["path", { "d": "M7 17 17 7" }]], "arrow-up-down": [["path", { "d": "m21 16-4 4-4-4" }], ["path", { "d": "M17 20V4" }], ["path", { "d": "m3 8 4-4 4 4" }], ["path", { "d": "M7 4v16" }]], "loader-circle": [["path", { "d": "M21 12a9 9 0 1 1-6.219-8.56" }]], "circle-alert": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["line", { "x1": "12", "x2": "12", "y1": "8", "y2": "12" }], ["line", { "x1": "12", "x2": "12.01", "y1": "16", "y2": "16" }]], "circle-check": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "m16 9-5.5 5.5L8 12" }]], "info": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 16v-4" }], ["path", { "d": "M12 8h.01" }]], "triangle-alert": [["path", { "d": "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }], ["path", { "d": "M12 9v4" }], ["path", { "d": "M12 17h.01" }]], "settings": [["path", { "d": "M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "user": [["path", { "d": "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2" }], ["circle", { "cx": "12", "cy": "7", "r": "4" }]], "users": [["path", { "d": "M16 21v-2a4 4 0 0 0-4-4H6a4 4 0 0 0-4 4v2" }], ["path", { "d": "M16 3.128a4 4 0 0 1 0 7.744" }], ["path", { "d": "M22 21v-2a4 4 0 0 0-3-3.87" }], ["circle", { "cx": "9", "cy": "7", "r": "4" }]], "filter": [["path", { "d": "M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z" }]], "ellipsis": [["circle", { "cx": "12", "cy": "12", "r": "1" }], ["circle", { "cx": "19", "cy": "12", "r": "1" }], ["circle", { "cx": "5", "cy": "12", "r": "1" }]], "external-link": [["path", { "d": "M15 3h6v6" }], ["path", { "d": "M10 14 21 3" }], ["path", { "d": "M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6" }]], "copy": [["rect", { "width": "14", "height": "14", "x": "8", "y": "8", "rx": "2", "ry": "2" }], ["path", { "d": "M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2" }]], "trash-2": [["path", { "d": "M10 11v6" }], ["path", { "d": "M14 11v6" }], ["path", { "d": "M19 6v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6" }], ["path", { "d": "M3 6h18" }], ["path", { "d": "M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2" }]], "pencil": [["path", { "d": "M21.174 6.812a1 1 0 0 0-3.986-3.987L3.842 16.174a2 2 0 0 0-.5.83l-1.321 4.352a.5.5 0 0 0 .623.622l4.353-1.32a2 2 0 0 0 .83-.497z" }], ["path", { "d": "m15 5 4 4" }]], "download": [["path", { "d": "M12 15V3" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }], ["path", { "d": "m7 10 5 5 5-5" }]], "upload": [["path", { "d": "M12 3v12" }], ["path", { "d": "m17 8-5-5-5 5" }], ["path", { "d": "M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" }]], "calendar": [["path", { "d": "M8 2v3" }], ["path", { "d": "M16 2v3" }], ["rect", { "x": "3", "y": "3", "width": "18", "height": "18", "rx": "2" }], ["path", { "d": "M3 9h18" }]], "bell": [["path", { "d": "M10.268 21a2 2 0 0 0 3.464 0" }], ["path", { "d": "M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326" }]], "menu": [["path", { "d": "M4 5h16" }], ["path", { "d": "M4 12h16" }], ["path", { "d": "M4 19h16" }]], "eye": [["path", { "d": "M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0" }], ["circle", { "cx": "12", "cy": "12", "r": "3" }]], "log-out": [["path", { "d": "m16 17 5-5-5-5" }], ["path", { "d": "M21 12H9" }], ["path", { "d": "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" }]], "circle": [["circle", { "cx": "12", "cy": "12", "r": "10" }]], "circle-dot-dashed": [["path", { "d": "M10.1 2.18a9.93 9.93 0 0 1 3.8 0" }], ["path", { "d": "M17.6 3.71a9.95 9.95 0 0 1 2.69 2.7" }], ["path", { "d": "M21.82 10.1a9.93 9.93 0 0 1 0 3.8" }], ["path", { "d": "M20.29 17.6a9.95 9.95 0 0 1-2.7 2.69" }], ["path", { "d": "M13.9 21.82a9.94 9.94 0 0 1-3.8 0" }], ["path", { "d": "M6.4 20.29a9.95 9.95 0 0 1-2.69-2.7" }], ["path", { "d": "M2.18 13.9a9.93 9.93 0 0 1 0-3.8" }], ["path", { "d": "M3.71 6.4a9.95 9.95 0 0 1 2.7-2.69" }], ["circle", { "cx": "12", "cy": "12", "r": "1" }]], "ban": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M4.929 4.929 19.07 19.071" }]], "arrow-up": [["path", { "d": "m5 12 7-7 7 7" }], ["path", { "d": "M12 19V5" }]], "arrow-down": [["path", { "d": "M12 5v14" }], ["path", { "d": "m19 12-7 7-7-7" }]], "inbox": [["polyline", { "points": "22 12 16 12 14 15 10 15 8 12 2 12" }], ["path", { "d": "M5.45 5.11 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.45-6.89A2 2 0 0 0 16.76 4H7.24a2 2 0 0 0-1.79 1.11z" }]], "pin": [["path", { "d": "M12 17v5" }], ["path", { "d": "M9 10.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-.76a2 2 0 0 0-1.11-1.79l-1.78-.9A2 2 0 0 1 15 10.76V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H8a2 2 0 0 0 0 4 1 1 0 0 1 1 1z" }]], "pin-off": [["path", { "d": "M12 17v5" }], ["path", { "d": "M15 9.34V7a1 1 0 0 1 1-1 2 2 0 0 0 0-4H7.89" }], ["path", { "d": "m2 2 20 20" }], ["path", { "d": "M9 9v1.76a2 2 0 0 1-1.11 1.79l-1.78.9A2 2 0 0 0 5 15.24V16a1 1 0 0 0 1 1h11" }]], "eye-off": [["path", { "d": "M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49" }], ["path", { "d": "M14.084 14.158a3 3 0 0 1-4.242-4.242" }], ["path", { "d": "M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143" }], ["path", { "d": "m2 2 20 20" }]], "columns-3": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2" }], ["path", { "d": "M9 3v18" }], ["path", { "d": "M15 3v18" }]], "arrow-left": [["path", { "d": "m12 19-7-7 7-7" }], ["path", { "d": "M19 12H5" }]], "rotate-ccw": [["path", { "d": "M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8" }], ["path", { "d": "M3 3v5h5" }]], "house": [["path", { "d": "M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8" }], ["path", { "d": "M3 10a2 2 0 0 1 .709-1.528l7-6a2 2 0 0 1 2.582 0l7 6A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" }]], "layout-dashboard": [["rect", { "width": "7", "height": "9", "x": "3", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "14", "y": "3", "rx": "1" }], ["rect", { "width": "7", "height": "9", "x": "14", "y": "12", "rx": "1" }], ["rect", { "width": "7", "height": "5", "x": "3", "y": "16", "rx": "1" }]], "folder": [["path", { "d": "M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2Z" }]], "chart-column": [["path", { "d": "M3 3v16a2 2 0 0 0 2 2h16" }], ["path", { "d": "M18 17V9" }], ["path", { "d": "M13 17V5" }], ["path", { "d": "M8 17v-3" }]], "file-text": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }], ["path", { "d": "M10 9H8" }], ["path", { "d": "M16 13H8" }], ["path", { "d": "M16 17H8" }]], "mail": [["path", { "d": "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7" }], ["rect", { "x": "2", "y": "4", "width": "20", "height": "16", "rx": "2" }]], "lock": [["rect", { "width": "18", "height": "11", "x": "3", "y": "11", "rx": "2", "ry": "2" }], ["path", { "d": "M7 11V7a5 5 0 0 1 10 0v4" }]], "clock": [["circle", { "cx": "12", "cy": "12", "r": "10" }], ["path", { "d": "M12 6v6l4 2" }]], "trending-up": [["path", { "d": "M16 7h6v6" }], ["path", { "d": "m22 7-8.5 8.5-5-5L2 17" }]], "trending-down": [["path", { "d": "M16 17h6v-6" }], ["path", { "d": "m22 17-8.5-8.5-5 5L2 7" }]], "image": [["rect", { "width": "18", "height": "18", "x": "3", "y": "3", "rx": "2", "ry": "2" }], ["circle", { "cx": "9", "cy": "9", "r": "2" }], ["path", { "d": "m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21" }]], "paperclip": [["path", { "d": "m16 6-8.414 8.586a2 2 0 0 0 2.829 2.829l8.414-8.586a4 4 0 1 0-5.657-5.657l-8.379 8.551a6 6 0 1 0 8.485 8.485l8.379-8.551" }]], "cloud-upload": [["path", { "d": "M12 13v8" }], ["path", { "d": "M4 14.899A7 7 0 1 1 15.71 8h1.79a4.5 4.5 0 0 1 2.5 8.242" }], ["path", { "d": "m8 17 4-4 4 4" }]], "file": [["path", { "d": "M6 22a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h8a2.4 2.4 0 0 1 1.704.706l3.588 3.588A2.4 2.4 0 0 1 20 8v12a2 2 0 0 1-2 2z" }], ["path", { "d": "M14 2v5a1 1 0 0 0 1 1h5" }]], "sun": [["circle", { "cx": "12", "cy": "12", "r": "4" }], ["path", { "d": "M12 2v2" }], ["path", { "d": "M12 20v2" }], ["path", { "d": "m4.93 4.93 1.41 1.41" }], ["path", { "d": "m17.66 17.66 1.41 1.41" }], ["path", { "d": "M2 12h2" }], ["path", { "d": "M20 12h2" }], ["path", { "d": "m6.34 17.66-1.41 1.41" }], ["path", { "d": "m19.07 4.93-1.41 1.41" }]], "moon": [["path", { "d": "M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401" }]], "monitor": [["rect", { "width": "20", "height": "14", "x": "2", "y": "3", "rx": "2" }], ["line", { "x1": "8", "x2": "16", "y1": "21", "y2": "21" }], ["line", { "x1": "12", "x2": "12", "y1": "17", "y2": "21" }]] };
6
+ const SIZES = { sm: 16, md: 20, lg: 24 };
7
7
  const Icon = React.forwardRef(function Icon2(props, ref) {
8
- var shapes = ICONS[props.name];
8
+ const shapes = ICONS[props.name];
9
9
  if (!shapes) return null;
10
- var size = SIZES[props.size] || props.size || 16;
11
- var a11y = props.label ? { role: "img", "aria-label": props.label } : { "aria-hidden": true, focusable: "false" };
12
- return h("svg", Object.assign({
13
- ref,
14
- xmlns: "http://www.w3.org/2000/svg",
15
- width: size,
16
- height: size,
17
- viewBox: "0 0 24 24",
18
- fill: "none",
19
- stroke: "currentColor",
20
- strokeWidth: props.strokeWidth || 2,
21
- strokeLinecap: "round",
22
- strokeLinejoin: "round",
23
- className: cx("aura-icon", props.className)
24
- }, a11y), shapes.map(function(s, i) {
25
- var attrs = { key: i };
26
- for (var k in s[1]) attrs[k === "stroke-width" ? "strokeWidth" : k] = s[1][k];
27
- return h(s[0], attrs);
28
- }));
10
+ const size = SIZES[props.size] || props.size || 16;
11
+ const a11y = props.label ? { role: "img", "aria-label": props.label } : { "aria-hidden": true, focusable: "false" };
12
+ return /* @__PURE__ */ React.createElement(
13
+ "svg",
14
+ {
15
+ ref,
16
+ xmlns: "http://www.w3.org/2000/svg",
17
+ width: size,
18
+ height: size,
19
+ viewBox: "0 0 24 24",
20
+ fill: "none",
21
+ stroke: "currentColor",
22
+ strokeWidth: props.strokeWidth || 2,
23
+ strokeLinecap: "round",
24
+ strokeLinejoin: "round",
25
+ className: cx("aura-icon", props.className),
26
+ ...a11y
27
+ },
28
+ shapes.map(function(s, i) {
29
+ const attrs = { key: i };
30
+ for (const k in s[1]) attrs[k === "stroke-width" ? "strokeWidth" : k] = s[1][k];
31
+ return h(s[0], attrs);
32
+ })
33
+ );
29
34
  });
30
35
  const iconNames = Object.keys(ICONS);
31
36
  export {
@@ -2,16 +2,20 @@
2
2
  import * as React from "react";
3
3
  import { cx, omit } from "./internal.js";
4
4
  import { Icon } from "./Icon.js";
5
- const h = React.createElement;
6
5
  const IconButton = React.forwardRef(function IconButton2(props, ref) {
7
- var rest = omit(props, ["icon", "label", "className", "size"]);
8
- return h("button", Object.assign({}, rest, {
9
- ref,
10
- type: props.type || "button",
11
- "aria-label": props.label,
12
- title: props.label,
13
- className: cx("aura-icon-btn", props.className)
14
- }), h(Icon, { name: props.icon, size: props.size || "sm" }));
6
+ const rest = omit(props, ["icon", "label", "className", "size"]);
7
+ return /* @__PURE__ */ React.createElement(
8
+ "button",
9
+ {
10
+ ...rest,
11
+ ref,
12
+ type: props.type || "button",
13
+ "aria-label": props.label,
14
+ title: props.label,
15
+ className: cx("aura-icon-btn", props.className)
16
+ },
17
+ /* @__PURE__ */ React.createElement(Icon, { name: props.icon, size: props.size || "sm" })
18
+ );
15
19
  });
16
20
  export {
17
21
  IconButton