@tonyarbor/components 0.4.0 → 0.7.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 (118) hide show
  1. package/dist/Button.d.mts +1 -1
  2. package/dist/Button.d.ts +1 -1
  3. package/dist/Button.js +56 -0
  4. package/dist/Button.js.map +1 -1
  5. package/dist/Button.mjs +1 -1
  6. package/dist/ButtonSegmented.d.mts +61 -0
  7. package/dist/ButtonSegmented.d.ts +61 -0
  8. package/dist/ButtonSegmented.js +167 -0
  9. package/dist/ButtonSegmented.js.map +1 -0
  10. package/dist/ButtonSegmented.mjs +7 -0
  11. package/dist/ButtonSegmented.mjs.map +1 -0
  12. package/dist/ListRow.d.mts +72 -0
  13. package/dist/ListRow.d.ts +72 -0
  14. package/dist/ListRow.js +194 -0
  15. package/dist/ListRow.js.map +1 -0
  16. package/dist/ListRow.mjs +7 -0
  17. package/dist/ListRow.mjs.map +1 -0
  18. package/dist/ListRowMultiLine.d.mts +56 -0
  19. package/dist/ListRowMultiLine.d.ts +56 -0
  20. package/dist/ListRowMultiLine.js +182 -0
  21. package/dist/ListRowMultiLine.js.map +1 -0
  22. package/dist/ListRowMultiLine.mjs +7 -0
  23. package/dist/ListRowMultiLine.mjs.map +1 -0
  24. package/dist/Logo.d.mts +39 -0
  25. package/dist/Logo.d.ts +39 -0
  26. package/dist/Logo.js +119 -0
  27. package/dist/Logo.js.map +1 -0
  28. package/dist/Logo.mjs +7 -0
  29. package/dist/Logo.mjs.map +1 -0
  30. package/dist/Modal.d.mts +73 -0
  31. package/dist/Modal.d.ts +73 -0
  32. package/dist/Modal.js +114 -0
  33. package/dist/Modal.js.map +1 -0
  34. package/dist/Modal.mjs +9 -0
  35. package/dist/Modal.mjs.map +1 -0
  36. package/dist/ModalFooter.d.mts +40 -0
  37. package/dist/ModalFooter.d.ts +40 -0
  38. package/dist/ModalFooter.js +73 -0
  39. package/dist/ModalFooter.js.map +1 -0
  40. package/dist/ModalFooter.mjs +7 -0
  41. package/dist/ModalFooter.mjs.map +1 -0
  42. package/dist/ModalHeader.d.mts +65 -0
  43. package/dist/ModalHeader.d.ts +65 -0
  44. package/dist/ModalHeader.js +257 -0
  45. package/dist/ModalHeader.js.map +1 -0
  46. package/dist/ModalHeader.mjs +8 -0
  47. package/dist/ModalHeader.mjs.map +1 -0
  48. package/dist/Section.d.mts +57 -0
  49. package/dist/Section.d.ts +57 -0
  50. package/dist/Section.js +72 -0
  51. package/dist/Section.js.map +1 -0
  52. package/dist/Section.mjs +7 -0
  53. package/dist/Section.mjs.map +1 -0
  54. package/dist/SectionHeading.d.mts +111 -0
  55. package/dist/SectionHeading.d.ts +111 -0
  56. package/dist/SectionHeading.js +385 -0
  57. package/dist/SectionHeading.js.map +1 -0
  58. package/dist/SectionHeading.mjs +8 -0
  59. package/dist/SectionHeading.mjs.map +1 -0
  60. package/dist/SectionHeadingInteractive.d.mts +67 -0
  61. package/dist/SectionHeadingInteractive.d.ts +67 -0
  62. package/dist/SectionHeadingInteractive.js +225 -0
  63. package/dist/SectionHeadingInteractive.js.map +1 -0
  64. package/dist/SectionHeadingInteractive.mjs +7 -0
  65. package/dist/SectionHeadingInteractive.mjs.map +1 -0
  66. package/dist/SectionIcon.d.mts +35 -0
  67. package/dist/SectionIcon.d.ts +35 -0
  68. package/dist/SectionIcon.js +142 -0
  69. package/dist/SectionIcon.js.map +1 -0
  70. package/dist/SectionIcon.mjs +7 -0
  71. package/dist/SectionIcon.mjs.map +1 -0
  72. package/dist/SubSectionHeading.d.mts +75 -0
  73. package/dist/SubSectionHeading.d.ts +75 -0
  74. package/dist/SubSectionHeading.js +225 -0
  75. package/dist/SubSectionHeading.js.map +1 -0
  76. package/dist/SubSectionHeading.mjs +7 -0
  77. package/dist/SubSectionHeading.mjs.map +1 -0
  78. package/dist/SubSectionInteractive.d.mts +65 -0
  79. package/dist/SubSectionInteractive.d.ts +65 -0
  80. package/dist/SubSectionInteractive.js +211 -0
  81. package/dist/SubSectionInteractive.js.map +1 -0
  82. package/dist/SubSectionInteractive.mjs +7 -0
  83. package/dist/SubSectionInteractive.mjs.map +1 -0
  84. package/dist/chunk-7JWINM2N.mjs +77 -0
  85. package/dist/chunk-7JWINM2N.mjs.map +1 -0
  86. package/dist/chunk-7NYBJKJS.mjs +106 -0
  87. package/dist/chunk-7NYBJKJS.mjs.map +1 -0
  88. package/dist/chunk-ALLCJATI.mjs +189 -0
  89. package/dist/chunk-ALLCJATI.mjs.map +1 -0
  90. package/dist/chunk-F6JVEIWC.mjs +158 -0
  91. package/dist/chunk-F6JVEIWC.mjs.map +1 -0
  92. package/dist/chunk-GHATS25Y.mjs +249 -0
  93. package/dist/chunk-GHATS25Y.mjs.map +1 -0
  94. package/dist/chunk-GIQDPHZQ.mjs +121 -0
  95. package/dist/chunk-GIQDPHZQ.mjs.map +1 -0
  96. package/dist/chunk-ILLGBZ6R.mjs +131 -0
  97. package/dist/chunk-ILLGBZ6R.mjs.map +1 -0
  98. package/dist/chunk-NNYU4DPD.mjs +83 -0
  99. package/dist/chunk-NNYU4DPD.mjs.map +1 -0
  100. package/dist/{chunk-ALEJXAZY.mjs → chunk-NOUFR6W2.mjs} +57 -1
  101. package/dist/chunk-NOUFR6W2.mjs.map +1 -0
  102. package/dist/chunk-ODKT7LGV.mjs +146 -0
  103. package/dist/chunk-ODKT7LGV.mjs.map +1 -0
  104. package/dist/chunk-P7RKUESQ.mjs +37 -0
  105. package/dist/chunk-P7RKUESQ.mjs.map +1 -0
  106. package/dist/chunk-RL4G7MR3.mjs +189 -0
  107. package/dist/chunk-RL4G7MR3.mjs.map +1 -0
  108. package/dist/chunk-X2CW5GF3.mjs +175 -0
  109. package/dist/chunk-X2CW5GF3.mjs.map +1 -0
  110. package/dist/chunk-YJ36ZZJQ.mjs +36 -0
  111. package/dist/chunk-YJ36ZZJQ.mjs.map +1 -0
  112. package/dist/index.d.mts +14 -1
  113. package/dist/index.d.ts +14 -1
  114. package/dist/index.js +1722 -0
  115. package/dist/index.js.map +1 -1
  116. package/dist/index.mjs +55 -1
  117. package/package.json +66 -1
  118. package/dist/chunk-ALEJXAZY.mjs.map +0 -1
package/dist/Logo.js ADDED
@@ -0,0 +1,119 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+
30
+ // src/Logo/index.ts
31
+ var Logo_exports = {};
32
+ __export(Logo_exports, {
33
+ Logo: () => Logo
34
+ });
35
+ module.exports = __toCommonJS(Logo_exports);
36
+
37
+ // src/Logo/Logo.tsx
38
+ var React = __toESM(require("react"));
39
+ var import_jsx_runtime = require("react/jsx-runtime");
40
+ var Logo = React.forwardRef(
41
+ ({
42
+ withText = true,
43
+ light = false,
44
+ width,
45
+ height,
46
+ className,
47
+ style
48
+ }, ref) => {
49
+ const defaultWidth = withText ? 66 : 25;
50
+ const defaultHeight = withText ? 26 : 25;
51
+ const finalWidth = width ?? defaultWidth;
52
+ const finalHeight = height ?? defaultHeight;
53
+ if (!withText) {
54
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
55
+ "svg",
56
+ {
57
+ ref,
58
+ width: finalWidth,
59
+ height: finalHeight,
60
+ viewBox: "0 0 25 25",
61
+ fill: "none",
62
+ xmlns: "http://www.w3.org/2000/svg",
63
+ className,
64
+ style,
65
+ "aria-label": "Arbor logo",
66
+ children: [
67
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("g", { clipPath: "url(#clip0_logo_icon)", children: [
68
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6821 12.448C12.6821 9.06699 15.4229 6.32623 18.8039 6.32623C18.8039 2.94571 16.0631 0.205391 12.6817 0.205391C9.30163 0.205391 6.56086 2.94571 6.56042 6.32623C9.94138 6.32623 12.6817 9.06699 12.6821 12.448Z", fill: "#F7931E" }),
69
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.4481C12.6826 15.8286 9.9423 18.5694 6.56178 18.5694C6.56178 21.9503 9.3021 24.6902 12.6826 24.6902C16.064 24.6902 18.8043 21.9499 18.8043 18.5694C15.4229 18.5676 12.6822 15.8281 12.6822 12.4472L12.6826 12.4481Z", fill: "#AFD318" }),
70
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18.8043 6.32631C18.8043 9.70727 16.064 12.448 12.6826 12.448C16.0636 12.448 18.8043 15.1888 18.8043 18.5693C22.1853 18.5693 24.9252 15.8286 24.9252 12.448C24.9252 9.06619 22.1844 6.32543 18.8048 6.32543L18.8043 6.32631Z", fill: "#DEEE21" }),
71
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.448C16.064 12.448 18.8043 9.70725 18.8043 6.32673C15.4225 6.32673 12.6822 9.06705 12.6826 12.448Z", fill: "#D58822" }),
72
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6822 12.4481C12.6822 15.8286 15.423 18.5693 18.8039 18.5693C18.8039 15.1875 16.0632 12.4472 12.6818 12.4472L12.6822 12.4481Z", fill: "#96BA0F" }),
73
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.448C9.30204 12.448 6.56128 9.70725 6.56128 6.32673C3.18076 6.32673 0.440002 9.06705 0.440002 12.448C0.440002 15.8285 3.18076 18.5684 6.56128 18.5693C6.56128 15.1874 9.30204 12.4471 12.6826 12.4471V12.448Z", fill: "#7DBA3C" }),
74
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.448C12.6826 9.06705 9.9423 6.32629 6.56178 6.32629L6.56134 6.32673C6.56134 9.70769 9.3021 12.448 12.6826 12.448Z", fill: "#A0861A" }),
75
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.4481C9.3021 12.4481 6.56178 15.1888 6.56134 18.5693C9.94186 18.5676 12.6826 15.8281 12.6826 12.4472V12.4481Z", fill: "#68AA22" })
76
+ ] }),
77
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("defs", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("clipPath", { id: "clip0_logo_icon", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", { width: "25", height: "25", fill: "white" }) }) })
78
+ ]
79
+ }
80
+ );
81
+ }
82
+ const textColor = light ? "#2F2F2F" : "white";
83
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
84
+ "svg",
85
+ {
86
+ ref,
87
+ width: finalWidth,
88
+ height: finalHeight,
89
+ viewBox: "0 0 66 26",
90
+ fill: "none",
91
+ xmlns: "http://www.w3.org/2000/svg",
92
+ className,
93
+ style,
94
+ "aria-label": "Arbor",
95
+ children: [
96
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6822 12.4479C12.6822 9.06698 15.423 6.32622 18.8039 6.32622C18.8039 2.9457 16.0632 0.205383 12.6818 0.205383C9.30169 0.205383 6.56093 2.9457 6.56049 6.32622C9.94145 6.32622 12.6818 9.06698 12.6822 12.4479Z", fill: "#F7931E" }),
97
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.4481C12.6826 15.8286 9.9423 18.5694 6.56178 18.5694C6.56178 21.9503 9.3021 24.6902 12.6826 24.6902C16.064 24.6902 18.8043 21.9499 18.8043 18.5694C15.4229 18.5676 12.6822 15.8281 12.6822 12.4472L12.6826 12.4481Z", fill: "#AFD318" }),
98
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M18.8044 6.3263C18.8044 9.70726 16.0641 12.448 12.6827 12.448C16.0636 12.448 18.8044 15.1888 18.8044 18.5693C22.1854 18.5693 24.9252 15.8285 24.9252 12.448C24.9252 9.06618 22.1845 6.32542 18.8048 6.32542L18.8044 6.3263Z", fill: "#DEEE21" }),
99
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6827 12.448C16.0641 12.448 18.8044 9.70725 18.8044 6.32673C15.4226 6.32673 12.6822 9.06705 12.6827 12.448Z", fill: "#D58822" }),
100
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6823 12.4481C12.6823 15.8286 15.423 18.5693 18.804 18.5693C18.804 15.1875 16.0632 12.4472 12.6818 12.4472L12.6823 12.4481Z", fill: "#96BA0F" }),
101
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.448C9.30204 12.448 6.56128 9.70725 6.56128 6.32673C3.18076 6.32673 0.440002 9.06705 0.440002 12.448C0.440002 15.8285 3.18076 18.5684 6.56128 18.5693C6.56128 15.1875 9.30204 12.4471 12.6826 12.4471V12.448Z", fill: "#7DBA3C" }),
102
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.448C12.6826 9.06705 9.9423 6.32629 6.56178 6.32629L6.56134 6.32673C6.56134 9.70769 9.3021 12.448 12.6826 12.448Z", fill: "#A0861A" }),
103
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M12.6826 12.4481C9.3021 12.4481 6.56178 15.1888 6.56134 18.5693C9.94186 18.5676 12.6826 15.8281 12.6826 12.4472V12.4481Z", fill: "#68AA22" }),
104
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M37.7924 17.8181L36.4913 14.3809H31.9131L30.6604 17.7055H29.1345L33.4716 6.57394H34.9821L39.255 17.4965L37.7924 17.8181ZM34.1936 8.37222L32.4266 13.0459H35.9761L34.195 8.37222H34.1936Z", fill: textColor }),
105
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M41.4713 13.1755V17.7053H40.0417V10.0427H41.1822L41.4229 11.6012C41.9689 10.7335 42.8529 9.94635 44.1056 9.88211L44.3308 11.2479C43.0614 11.3121 41.9843 12.1635 41.4708 13.1751L41.4713 13.1755Z", fill: textColor }),
106
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M48.2659 17.8016C47.1092 17.8016 46.2903 17.6252 45.2779 17.3194V6.33171L46.707 6.10687V10.942C47.2218 10.4118 47.9601 9.88163 49.0047 9.88163C50.6591 9.88163 52.024 11.1026 52.024 13.6564C52.024 16.4513 50.4822 17.8008 48.2659 17.8008V17.8016ZM48.7957 11.1515C47.9931 11.1515 47.2861 11.6817 46.7079 12.4046V16.3241C47.1897 16.5006 47.5439 16.5811 48.2505 16.5811C49.7443 16.5811 50.5795 15.6971 50.5795 13.722C50.5795 12.0522 49.8231 11.1528 48.7957 11.1528V11.1515Z", fill: textColor }),
107
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M56.5064 17.8664C54.467 17.8664 52.9882 16.4042 52.9882 13.8826C52.9882 11.3605 54.467 9.88211 56.5064 9.88211C58.563 9.88211 60.0722 11.3601 60.0722 13.8826C60.0722 16.4038 58.563 17.8664 56.5064 17.8664ZM56.5064 11.0873C55.1248 11.0873 54.4345 12.2762 54.4345 13.8822C54.4345 15.4565 55.1574 16.6775 56.5064 16.6775C57.9202 16.6775 58.6263 15.4886 58.6263 13.8822C58.625 12.3087 57.8845 11.0877 56.5042 11.0877L56.5064 11.0873Z", fill: textColor }),
108
+ /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", { d: "M62.4495 13.1755V17.7053H61.0199V10.0427H62.1613L62.4019 11.6012C62.948 10.7335 63.8315 9.94635 65.0846 9.88211L65.3099 11.2479C64.0423 11.3121 62.9651 12.1635 62.4517 13.1751L62.4495 13.1755Z", fill: textColor })
109
+ ]
110
+ }
111
+ );
112
+ }
113
+ );
114
+ Logo.displayName = "Logo";
115
+ // Annotate the CommonJS export names for ESM import in node:
116
+ 0 && (module.exports = {
117
+ Logo
118
+ });
119
+ //# sourceMappingURL=Logo.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Logo/index.ts","../src/Logo/Logo.tsx"],"sourcesContent":["export { Logo } from './Logo';\nexport type { LogoProps } from './Logo';\n","import * as React from 'react';\n\nexport interface LogoProps {\n /**\n * Whether to show the \"Arbor\" text alongside the logo\n */\n withText?: boolean;\n /**\n * Whether to use light (dark text) or dark (white text) variant\n * Only applies when withText is true\n */\n light?: boolean;\n /**\n * Width of the logo in pixels\n * @default withText ? 66 : 25\n */\n width?: number;\n /**\n * Height of the logo in pixels\n * @default withText ? 26 : 25\n */\n height?: number;\n /**\n * Custom className\n */\n className?: string;\n /**\n * Custom style\n */\n style?: React.CSSProperties;\n}\n\n/**\n * Logo component - Arbor Design System\n *\n * Displays the Arbor logo with optional text in light or dark variants.\n */\nexport const Logo = React.forwardRef<SVGSVGElement, LogoProps>(\n (\n {\n withText = true,\n light = false,\n width,\n height,\n className,\n style,\n },\n ref\n ) => {\n const defaultWidth = withText ? 66 : 25;\n const defaultHeight = withText ? 26 : 25;\n const finalWidth = width ?? defaultWidth;\n const finalHeight = height ?? defaultHeight;\n\n // Icon only (no text)\n if (!withText) {\n return (\n <svg\n ref={ref}\n width={finalWidth}\n height={finalHeight}\n viewBox=\"0 0 25 25\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n style={style}\n aria-label=\"Arbor logo\"\n >\n <g clipPath=\"url(#clip0_logo_icon)\">\n <path d=\"M12.6821 12.448C12.6821 9.06699 15.4229 6.32623 18.8039 6.32623C18.8039 2.94571 16.0631 0.205391 12.6817 0.205391C9.30163 0.205391 6.56086 2.94571 6.56042 6.32623C9.94138 6.32623 12.6817 9.06699 12.6821 12.448Z\" fill=\"#F7931E\"/>\n <path d=\"M12.6826 12.4481C12.6826 15.8286 9.9423 18.5694 6.56178 18.5694C6.56178 21.9503 9.3021 24.6902 12.6826 24.6902C16.064 24.6902 18.8043 21.9499 18.8043 18.5694C15.4229 18.5676 12.6822 15.8281 12.6822 12.4472L12.6826 12.4481Z\" fill=\"#AFD318\"/>\n <path d=\"M18.8043 6.32631C18.8043 9.70727 16.064 12.448 12.6826 12.448C16.0636 12.448 18.8043 15.1888 18.8043 18.5693C22.1853 18.5693 24.9252 15.8286 24.9252 12.448C24.9252 9.06619 22.1844 6.32543 18.8048 6.32543L18.8043 6.32631Z\" fill=\"#DEEE21\"/>\n <path d=\"M12.6826 12.448C16.064 12.448 18.8043 9.70725 18.8043 6.32673C15.4225 6.32673 12.6822 9.06705 12.6826 12.448Z\" fill=\"#D58822\"/>\n <path d=\"M12.6822 12.4481C12.6822 15.8286 15.423 18.5693 18.8039 18.5693C18.8039 15.1875 16.0632 12.4472 12.6818 12.4472L12.6822 12.4481Z\" fill=\"#96BA0F\"/>\n <path d=\"M12.6826 12.448C9.30204 12.448 6.56128 9.70725 6.56128 6.32673C3.18076 6.32673 0.440002 9.06705 0.440002 12.448C0.440002 15.8285 3.18076 18.5684 6.56128 18.5693C6.56128 15.1874 9.30204 12.4471 12.6826 12.4471V12.448Z\" fill=\"#7DBA3C\"/>\n <path d=\"M12.6826 12.448C12.6826 9.06705 9.9423 6.32629 6.56178 6.32629L6.56134 6.32673C6.56134 9.70769 9.3021 12.448 12.6826 12.448Z\" fill=\"#A0861A\"/>\n <path d=\"M12.6826 12.4481C9.3021 12.4481 6.56178 15.1888 6.56134 18.5693C9.94186 18.5676 12.6826 15.8281 12.6826 12.4472V12.4481Z\" fill=\"#68AA22\"/>\n </g>\n <defs>\n <clipPath id=\"clip0_logo_icon\">\n <rect width=\"25\" height=\"25\" fill=\"white\"/>\n </clipPath>\n </defs>\n </svg>\n );\n }\n\n // Logo with text\n const textColor = light ? '#2F2F2F' : 'white';\n\n return (\n <svg\n ref={ref}\n width={finalWidth}\n height={finalHeight}\n viewBox=\"0 0 66 26\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n className={className}\n style={style}\n aria-label=\"Arbor\"\n >\n <path d=\"M12.6822 12.4479C12.6822 9.06698 15.423 6.32622 18.8039 6.32622C18.8039 2.9457 16.0632 0.205383 12.6818 0.205383C9.30169 0.205383 6.56093 2.9457 6.56049 6.32622C9.94145 6.32622 12.6818 9.06698 12.6822 12.4479Z\" fill=\"#F7931E\"/>\n <path d=\"M12.6826 12.4481C12.6826 15.8286 9.9423 18.5694 6.56178 18.5694C6.56178 21.9503 9.3021 24.6902 12.6826 24.6902C16.064 24.6902 18.8043 21.9499 18.8043 18.5694C15.4229 18.5676 12.6822 15.8281 12.6822 12.4472L12.6826 12.4481Z\" fill=\"#AFD318\"/>\n <path d=\"M18.8044 6.3263C18.8044 9.70726 16.0641 12.448 12.6827 12.448C16.0636 12.448 18.8044 15.1888 18.8044 18.5693C22.1854 18.5693 24.9252 15.8285 24.9252 12.448C24.9252 9.06618 22.1845 6.32542 18.8048 6.32542L18.8044 6.3263Z\" fill=\"#DEEE21\"/>\n <path d=\"M12.6827 12.448C16.0641 12.448 18.8044 9.70725 18.8044 6.32673C15.4226 6.32673 12.6822 9.06705 12.6827 12.448Z\" fill=\"#D58822\"/>\n <path d=\"M12.6823 12.4481C12.6823 15.8286 15.423 18.5693 18.804 18.5693C18.804 15.1875 16.0632 12.4472 12.6818 12.4472L12.6823 12.4481Z\" fill=\"#96BA0F\"/>\n <path d=\"M12.6826 12.448C9.30204 12.448 6.56128 9.70725 6.56128 6.32673C3.18076 6.32673 0.440002 9.06705 0.440002 12.448C0.440002 15.8285 3.18076 18.5684 6.56128 18.5693C6.56128 15.1875 9.30204 12.4471 12.6826 12.4471V12.448Z\" fill=\"#7DBA3C\"/>\n <path d=\"M12.6826 12.448C12.6826 9.06705 9.9423 6.32629 6.56178 6.32629L6.56134 6.32673C6.56134 9.70769 9.3021 12.448 12.6826 12.448Z\" fill=\"#A0861A\"/>\n <path d=\"M12.6826 12.4481C9.3021 12.4481 6.56178 15.1888 6.56134 18.5693C9.94186 18.5676 12.6826 15.8281 12.6826 12.4472V12.4481Z\" fill=\"#68AA22\"/>\n <path d=\"M37.7924 17.8181L36.4913 14.3809H31.9131L30.6604 17.7055H29.1345L33.4716 6.57394H34.9821L39.255 17.4965L37.7924 17.8181ZM34.1936 8.37222L32.4266 13.0459H35.9761L34.195 8.37222H34.1936Z\" fill={textColor}/>\n <path d=\"M41.4713 13.1755V17.7053H40.0417V10.0427H41.1822L41.4229 11.6012C41.9689 10.7335 42.8529 9.94635 44.1056 9.88211L44.3308 11.2479C43.0614 11.3121 41.9843 12.1635 41.4708 13.1751L41.4713 13.1755Z\" fill={textColor}/>\n <path d=\"M48.2659 17.8016C47.1092 17.8016 46.2903 17.6252 45.2779 17.3194V6.33171L46.707 6.10687V10.942C47.2218 10.4118 47.9601 9.88163 49.0047 9.88163C50.6591 9.88163 52.024 11.1026 52.024 13.6564C52.024 16.4513 50.4822 17.8008 48.2659 17.8008V17.8016ZM48.7957 11.1515C47.9931 11.1515 47.2861 11.6817 46.7079 12.4046V16.3241C47.1897 16.5006 47.5439 16.5811 48.2505 16.5811C49.7443 16.5811 50.5795 15.6971 50.5795 13.722C50.5795 12.0522 49.8231 11.1528 48.7957 11.1528V11.1515Z\" fill={textColor}/>\n <path d=\"M56.5064 17.8664C54.467 17.8664 52.9882 16.4042 52.9882 13.8826C52.9882 11.3605 54.467 9.88211 56.5064 9.88211C58.563 9.88211 60.0722 11.3601 60.0722 13.8826C60.0722 16.4038 58.563 17.8664 56.5064 17.8664ZM56.5064 11.0873C55.1248 11.0873 54.4345 12.2762 54.4345 13.8822C54.4345 15.4565 55.1574 16.6775 56.5064 16.6775C57.9202 16.6775 58.6263 15.4886 58.6263 13.8822C58.625 12.3087 57.8845 11.0877 56.5042 11.0877L56.5064 11.0873Z\" fill={textColor}/>\n <path d=\"M62.4495 13.1755V17.7053H61.0199V10.0427H62.1613L62.4019 11.6012C62.948 10.7335 63.8315 9.94635 65.0846 9.88211L65.3099 11.2479C64.0423 11.3121 62.9651 12.1635 62.4517 13.1751L62.4495 13.1755Z\" fill={textColor}/>\n </svg>\n );\n }\n);\n\nLogo.displayName = 'Logo';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;AAoEb;AA/BH,IAAM,OAAa;AAAA,EACxB,CACE;AAAA,IACE,WAAW;AAAA,IACX,QAAQ;AAAA,IACR;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,eAAe,WAAW,KAAK;AACrC,UAAM,gBAAgB,WAAW,KAAK;AACtC,UAAM,aAAa,SAAS;AAC5B,UAAM,cAAc,UAAU;AAG9B,QAAI,CAAC,UAAU;AACb,aACE;AAAA,QAAC;AAAA;AAAA,UACC;AAAA,UACA,OAAO;AAAA,UACP,QAAQ;AAAA,UACR,SAAQ;AAAA,UACR,MAAK;AAAA,UACL,OAAM;AAAA,UACN;AAAA,UACA;AAAA,UACA,cAAW;AAAA,UAEX;AAAA,yDAAC,OAAE,UAAS,yBACV;AAAA,0DAAC,UAAK,GAAE,sNAAqN,MAAK,WAAS;AAAA,cAC3O,4CAAC,UAAK,GAAE,kOAAiO,MAAK,WAAS;AAAA,cACvP,4CAAC,UAAK,GAAE,gOAA+N,MAAK,WAAS;AAAA,cACrP,4CAAC,UAAK,GAAE,iHAAgH,MAAK,WAAS;AAAA,cACtI,4CAAC,UAAK,GAAE,oIAAmI,MAAK,WAAS;AAAA,cACzJ,4CAAC,UAAK,GAAE,4NAA2N,MAAK,WAAS;AAAA,cACjP,4CAAC,UAAK,GAAE,gIAA+H,MAAK,WAAS;AAAA,cACrJ,4CAAC,UAAK,GAAE,4HAA2H,MAAK,WAAS;AAAA,eACnJ;AAAA,YACA,4CAAC,UACC,sDAAC,cAAS,IAAG,mBACX,sDAAC,UAAK,OAAM,MAAK,QAAO,MAAK,MAAK,SAAO,GAC3C,GACF;AAAA;AAAA;AAAA,MACF;AAAA,IAEJ;AAGA,UAAM,YAAY,QAAQ,YAAY;AAEtC,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,SAAQ;AAAA,QACR,MAAK;AAAA,QACL,OAAM;AAAA,QACN;AAAA,QACA;AAAA,QACA,cAAW;AAAA,QAEX;AAAA,sDAAC,UAAK,GAAE,qNAAoN,MAAK,WAAS;AAAA,UAC1O,4CAAC,UAAK,GAAE,kOAAiO,MAAK,WAAS;AAAA,UACvP,4CAAC,UAAK,GAAE,+NAA8N,MAAK,WAAS;AAAA,UACpP,4CAAC,UAAK,GAAE,kHAAiH,MAAK,WAAS;AAAA,UACvI,4CAAC,UAAK,GAAE,kIAAiI,MAAK,WAAS;AAAA,UACvJ,4CAAC,UAAK,GAAE,4NAA2N,MAAK,WAAS;AAAA,UACjP,4CAAC,UAAK,GAAE,gIAA+H,MAAK,WAAS;AAAA,UACrJ,4CAAC,UAAK,GAAE,4HAA2H,MAAK,WAAS;AAAA,UACjJ,4CAAC,UAAK,GAAE,4LAA2L,MAAM,WAAU;AAAA,UACnN,4CAAC,UAAK,GAAE,qMAAoM,MAAM,WAAU;AAAA,UAC5N,4CAAC,UAAK,GAAE,wdAAud,MAAM,WAAU;AAAA,UAC/e,4CAAC,UAAK,GAAE,ibAAgb,MAAM,WAAU;AAAA,UACxc,4CAAC,UAAK,GAAE,oMAAmM,MAAM,WAAU;AAAA;AAAA;AAAA,IAC7N;AAAA,EAEJ;AACF;AAEA,KAAK,cAAc;","names":[]}
package/dist/Logo.mjs ADDED
@@ -0,0 +1,7 @@
1
+ import {
2
+ Logo
3
+ } from "./chunk-NNYU4DPD.mjs";
4
+ export {
5
+ Logo
6
+ };
7
+ //# sourceMappingURL=Logo.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -0,0 +1,73 @@
1
+ import * as React from 'react';
2
+
3
+ interface ModalProps {
4
+ /**
5
+ * The content of the modal (typically ModalHeader, content, and ModalFooter)
6
+ */
7
+ children: React.ReactNode;
8
+ /**
9
+ * Width of the modal
10
+ * @default 584
11
+ */
12
+ width?: number | string;
13
+ /**
14
+ * Additional CSS class name
15
+ */
16
+ className?: string;
17
+ /**
18
+ * Additional inline styles
19
+ */
20
+ style?: React.CSSProperties;
21
+ }
22
+ interface ModalContentProps {
23
+ /**
24
+ * The content to display in the modal body
25
+ */
26
+ children: React.ReactNode;
27
+ /**
28
+ * Additional CSS class name
29
+ */
30
+ className?: string;
31
+ /**
32
+ * Additional inline styles
33
+ */
34
+ style?: React.CSSProperties;
35
+ }
36
+ /**
37
+ * Modal component - Arbor Design System
38
+ *
39
+ * A modal dialog container that wraps ModalHeader, content, and ModalFooter.
40
+ *
41
+ * @example
42
+ * ```tsx
43
+ * <Modal width={584}>
44
+ * <ModalHeader
45
+ * title="Delete postal address?"
46
+ * onClose={() => setIsOpen(false)}
47
+ * />
48
+ * <ModalContent>
49
+ * <p>This will delete the postal address. Are you sure?</p>
50
+ * </ModalContent>
51
+ * <ModalFooter>
52
+ * <Button variant="tertiary">Cancel</Button>
53
+ * <Button variant="destructive-secondary">Confirm</Button>
54
+ * </ModalFooter>
55
+ * </Modal>
56
+ * ```
57
+ */
58
+ declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
59
+ /**
60
+ * ModalContent component - Arbor Design System
61
+ *
62
+ * The content/body area of a modal dialog.
63
+ *
64
+ * @example
65
+ * ```tsx
66
+ * <ModalContent>
67
+ * <p>Your content here</p>
68
+ * </ModalContent>
69
+ * ```
70
+ */
71
+ declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps & React.RefAttributes<HTMLDivElement>>;
72
+
73
+ export { Modal, ModalContent, type ModalContentProps, type ModalProps };
@@ -0,0 +1,73 @@
1
+ import * as React from 'react';
2
+
3
+ interface ModalProps {
4
+ /**
5
+ * The content of the modal (typically ModalHeader, content, and ModalFooter)
6
+ */
7
+ children: React.ReactNode;
8
+ /**
9
+ * Width of the modal
10
+ * @default 584
11
+ */
12
+ width?: number | string;
13
+ /**
14
+ * Additional CSS class name
15
+ */
16
+ className?: string;
17
+ /**
18
+ * Additional inline styles
19
+ */
20
+ style?: React.CSSProperties;
21
+ }
22
+ interface ModalContentProps {
23
+ /**
24
+ * The content to display in the modal body
25
+ */
26
+ children: React.ReactNode;
27
+ /**
28
+ * Additional CSS class name
29
+ */
30
+ className?: string;
31
+ /**
32
+ * Additional inline styles
33
+ */
34
+ style?: React.CSSProperties;
35
+ }
36
+ /**
37
+ * Modal component - Arbor Design System
38
+ *
39
+ * A modal dialog container that wraps ModalHeader, content, and ModalFooter.
40
+ *
41
+ * @example
42
+ * ```tsx
43
+ * <Modal width={584}>
44
+ * <ModalHeader
45
+ * title="Delete postal address?"
46
+ * onClose={() => setIsOpen(false)}
47
+ * />
48
+ * <ModalContent>
49
+ * <p>This will delete the postal address. Are you sure?</p>
50
+ * </ModalContent>
51
+ * <ModalFooter>
52
+ * <Button variant="tertiary">Cancel</Button>
53
+ * <Button variant="destructive-secondary">Confirm</Button>
54
+ * </ModalFooter>
55
+ * </Modal>
56
+ * ```
57
+ */
58
+ declare const Modal: React.ForwardRefExoticComponent<ModalProps & React.RefAttributes<HTMLDivElement>>;
59
+ /**
60
+ * ModalContent component - Arbor Design System
61
+ *
62
+ * The content/body area of a modal dialog.
63
+ *
64
+ * @example
65
+ * ```tsx
66
+ * <ModalContent>
67
+ * <p>Your content here</p>
68
+ * </ModalContent>
69
+ * ```
70
+ */
71
+ declare const ModalContent: React.ForwardRefExoticComponent<ModalContentProps & React.RefAttributes<HTMLDivElement>>;
72
+
73
+ export { Modal, ModalContent, type ModalContentProps, type ModalProps };
package/dist/Modal.js ADDED
@@ -0,0 +1,114 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+
30
+ // src/Modal/index.ts
31
+ var Modal_exports = {};
32
+ __export(Modal_exports, {
33
+ Modal: () => Modal,
34
+ ModalContent: () => ModalContent
35
+ });
36
+ module.exports = __toCommonJS(Modal_exports);
37
+
38
+ // src/Modal/Modal.tsx
39
+ var React = __toESM(require("react"));
40
+ var import_clsx = require("clsx");
41
+ var import_jsx_runtime = require("react/jsx-runtime");
42
+ var modalStyles = {
43
+ container: {
44
+ display: "flex",
45
+ flexDirection: "column",
46
+ alignItems: "flex-start",
47
+ backgroundColor: "#f8f8f8",
48
+ // grey-050
49
+ borderRadius: "8px",
50
+ boxShadow: "0px 8px 24px 0px rgba(32, 32, 32, 0.12)",
51
+ overflow: "hidden",
52
+ boxSizing: "border-box",
53
+ fontFamily: "'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif"
54
+ },
55
+ content: {
56
+ display: "flex",
57
+ alignItems: "center",
58
+ justifyContent: "center",
59
+ width: "100%",
60
+ padding: "32px 16px",
61
+ backgroundColor: "#f8f8f8",
62
+ // grey-050
63
+ boxSizing: "border-box"
64
+ },
65
+ contentText: {
66
+ flex: 1,
67
+ fontSize: "13px",
68
+ fontWeight: "400",
69
+ color: "#2f2f2f",
70
+ lineHeight: "1.5"
71
+ }
72
+ };
73
+ var Modal = React.forwardRef(
74
+ ({ children, width = 584, className, style, ...props }, ref) => {
75
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
76
+ "div",
77
+ {
78
+ ref,
79
+ className: (0, import_clsx.clsx)("arbor-modal", className),
80
+ style: {
81
+ ...modalStyles.container,
82
+ width: typeof width === "number" ? `${width}px` : width,
83
+ ...style
84
+ },
85
+ role: "dialog",
86
+ "aria-modal": "true",
87
+ ...props,
88
+ children
89
+ }
90
+ );
91
+ }
92
+ );
93
+ Modal.displayName = "Modal";
94
+ var ModalContent = React.forwardRef(
95
+ ({ children, className, style, ...props }, ref) => {
96
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
97
+ "div",
98
+ {
99
+ ref,
100
+ className: (0, import_clsx.clsx)("arbor-modal-content", className),
101
+ style: { ...modalStyles.content, ...style },
102
+ ...props,
103
+ children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { style: modalStyles.contentText, children })
104
+ }
105
+ );
106
+ }
107
+ );
108
+ ModalContent.displayName = "ModalContent";
109
+ // Annotate the CommonJS export names for ESM import in node:
110
+ 0 && (module.exports = {
111
+ Modal,
112
+ ModalContent
113
+ });
114
+ //# sourceMappingURL=Modal.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/Modal/index.ts","../src/Modal/Modal.tsx"],"sourcesContent":["export { Modal, ModalContent } from './Modal';\nexport type { ModalProps, ModalContentProps } from './Modal';\n","import * as React from 'react';\nimport { clsx } from 'clsx';\n\nexport interface ModalProps {\n /**\n * The content of the modal (typically ModalHeader, content, and ModalFooter)\n */\n children: React.ReactNode;\n /**\n * Width of the modal\n * @default 584\n */\n width?: number | string;\n /**\n * Additional CSS class name\n */\n className?: string;\n /**\n * Additional inline styles\n */\n style?: React.CSSProperties;\n}\n\nexport interface ModalContentProps {\n /**\n * The content to display in the modal body\n */\n children: React.ReactNode;\n /**\n * Additional CSS class name\n */\n className?: string;\n /**\n * Additional inline styles\n */\n style?: React.CSSProperties;\n}\n\n// Arbor Design System modal styles\nconst modalStyles = {\n container: {\n display: 'flex',\n flexDirection: 'column' as const,\n alignItems: 'flex-start',\n backgroundColor: '#f8f8f8', // grey-050\n borderRadius: '8px',\n boxShadow: '0px 8px 24px 0px rgba(32, 32, 32, 0.12)',\n overflow: 'hidden',\n boxSizing: 'border-box' as const,\n fontFamily: \"'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif\",\n },\n content: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '100%',\n padding: '32px 16px',\n backgroundColor: '#f8f8f8', // grey-050\n boxSizing: 'border-box' as const,\n },\n contentText: {\n flex: 1,\n fontSize: '13px',\n fontWeight: '400',\n color: '#2f2f2f',\n lineHeight: '1.5',\n },\n};\n\n/**\n * Modal component - Arbor Design System\n *\n * A modal dialog container that wraps ModalHeader, content, and ModalFooter.\n *\n * @example\n * ```tsx\n * <Modal width={584}>\n * <ModalHeader\n * title=\"Delete postal address?\"\n * onClose={() => setIsOpen(false)}\n * />\n * <ModalContent>\n * <p>This will delete the postal address. Are you sure?</p>\n * </ModalContent>\n * <ModalFooter>\n * <Button variant=\"tertiary\">Cancel</Button>\n * <Button variant=\"destructive-secondary\">Confirm</Button>\n * </ModalFooter>\n * </Modal>\n * ```\n */\nexport const Modal = React.forwardRef<HTMLDivElement, ModalProps>(\n ({ children, width = 584, className, style, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clsx('arbor-modal', className)}\n style={{\n ...modalStyles.container,\n width: typeof width === 'number' ? `${width}px` : width,\n ...style,\n }}\n role=\"dialog\"\n aria-modal=\"true\"\n {...props}\n >\n {children}\n </div>\n );\n }\n);\n\nModal.displayName = 'Modal';\n\n/**\n * ModalContent component - Arbor Design System\n *\n * The content/body area of a modal dialog.\n *\n * @example\n * ```tsx\n * <ModalContent>\n * <p>Your content here</p>\n * </ModalContent>\n * ```\n */\nexport const ModalContent = React.forwardRef<HTMLDivElement, ModalContentProps>(\n ({ children, className, style, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clsx('arbor-modal-content', className)}\n style={{ ...modalStyles.content, ...style }}\n {...props}\n >\n <div style={modalStyles.contentText}>{children}</div>\n </div>\n );\n }\n);\n\nModalContent.displayName = 'ModalContent';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;AACvB,kBAAqB;AA6Ff;AAvDN,IAAM,cAAc;AAAA,EAClB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,eAAe;AAAA,IACf,YAAY;AAAA,IACZ,iBAAiB;AAAA;AAAA,IACjB,cAAc;AAAA,IACd,WAAW;AAAA,IACX,UAAU;AAAA,IACV,WAAW;AAAA,IACX,YAAY;AAAA,EACd;AAAA,EACA,SAAS;AAAA,IACP,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,OAAO;AAAA,IACP,SAAS;AAAA,IACT,iBAAiB;AAAA;AAAA,IACjB,WAAW;AAAA,EACb;AAAA,EACA,aAAa;AAAA,IACX,MAAM;AAAA,IACN,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,OAAO;AAAA,IACP,YAAY;AAAA,EACd;AACF;AAwBO,IAAM,QAAc;AAAA,EACzB,CAAC,EAAE,UAAU,QAAQ,KAAK,WAAW,OAAO,GAAG,MAAM,GAAG,QAAQ;AAC9D,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAK,eAAe,SAAS;AAAA,QACxC,OAAO;AAAA,UACL,GAAG,YAAY;AAAA,UACf,OAAO,OAAO,UAAU,WAAW,GAAG,KAAK,OAAO;AAAA,UAClD,GAAG;AAAA,QACL;AAAA,QACA,MAAK;AAAA,QACL,cAAW;AAAA,QACV,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,MAAM,cAAc;AAcb,IAAM,eAAqB;AAAA,EAChC,CAAC,EAAE,UAAU,WAAW,OAAO,GAAG,MAAM,GAAG,QAAQ;AACjD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAK,uBAAuB,SAAS;AAAA,QAChD,OAAO,EAAE,GAAG,YAAY,SAAS,GAAG,MAAM;AAAA,QACzC,GAAG;AAAA,QAEJ,sDAAC,SAAI,OAAO,YAAY,aAAc,UAAS;AAAA;AAAA,IACjD;AAAA,EAEJ;AACF;AAEA,aAAa,cAAc;","names":[]}
package/dist/Modal.mjs ADDED
@@ -0,0 +1,9 @@
1
+ import {
2
+ Modal,
3
+ ModalContent
4
+ } from "./chunk-7JWINM2N.mjs";
5
+ export {
6
+ Modal,
7
+ ModalContent
8
+ };
9
+ //# sourceMappingURL=Modal.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -0,0 +1,40 @@
1
+ import * as React from 'react';
2
+
3
+ interface ModalFooterProps {
4
+ /**
5
+ * The content of the footer, typically buttons
6
+ */
7
+ children: React.ReactNode;
8
+ /**
9
+ * Additional CSS class name
10
+ */
11
+ className?: string;
12
+ /**
13
+ * Additional inline styles
14
+ */
15
+ style?: React.CSSProperties;
16
+ }
17
+ /**
18
+ * ModalFooter component - Arbor Design System
19
+ *
20
+ * The footer part of a modal dialog, typically containing action buttons.
21
+ * Buttons are right-aligned by default.
22
+ *
23
+ * @example
24
+ * ```tsx
25
+ * // Footer with two buttons
26
+ * <ModalFooter>
27
+ * <Button variant="tertiary">Cancel</Button>
28
+ * <Button variant="primary">Save</Button>
29
+ * </ModalFooter>
30
+ *
31
+ * // Footer with destructive action
32
+ * <ModalFooter>
33
+ * <Button variant="tertiary">Cancel</Button>
34
+ * <Button variant="destructive-secondary">Delete</Button>
35
+ * </ModalFooter>
36
+ * ```
37
+ */
38
+ declare const ModalFooter: React.ForwardRefExoticComponent<ModalFooterProps & React.RefAttributes<HTMLDivElement>>;
39
+
40
+ export { ModalFooter, type ModalFooterProps };
@@ -0,0 +1,40 @@
1
+ import * as React from 'react';
2
+
3
+ interface ModalFooterProps {
4
+ /**
5
+ * The content of the footer, typically buttons
6
+ */
7
+ children: React.ReactNode;
8
+ /**
9
+ * Additional CSS class name
10
+ */
11
+ className?: string;
12
+ /**
13
+ * Additional inline styles
14
+ */
15
+ style?: React.CSSProperties;
16
+ }
17
+ /**
18
+ * ModalFooter component - Arbor Design System
19
+ *
20
+ * The footer part of a modal dialog, typically containing action buttons.
21
+ * Buttons are right-aligned by default.
22
+ *
23
+ * @example
24
+ * ```tsx
25
+ * // Footer with two buttons
26
+ * <ModalFooter>
27
+ * <Button variant="tertiary">Cancel</Button>
28
+ * <Button variant="primary">Save</Button>
29
+ * </ModalFooter>
30
+ *
31
+ * // Footer with destructive action
32
+ * <ModalFooter>
33
+ * <Button variant="tertiary">Cancel</Button>
34
+ * <Button variant="destructive-secondary">Delete</Button>
35
+ * </ModalFooter>
36
+ * ```
37
+ */
38
+ declare const ModalFooter: React.ForwardRefExoticComponent<ModalFooterProps & React.RefAttributes<HTMLDivElement>>;
39
+
40
+ export { ModalFooter, type ModalFooterProps };
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+ var __create = Object.create;
3
+ var __defProp = Object.defineProperty;
4
+ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
+ var __getOwnPropNames = Object.getOwnPropertyNames;
6
+ var __getProtoOf = Object.getPrototypeOf;
7
+ var __hasOwnProp = Object.prototype.hasOwnProperty;
8
+ var __export = (target, all) => {
9
+ for (var name in all)
10
+ __defProp(target, name, { get: all[name], enumerable: true });
11
+ };
12
+ var __copyProps = (to, from, except, desc) => {
13
+ if (from && typeof from === "object" || typeof from === "function") {
14
+ for (let key of __getOwnPropNames(from))
15
+ if (!__hasOwnProp.call(to, key) && key !== except)
16
+ __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
+ }
18
+ return to;
19
+ };
20
+ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
+ // If the importer is in node compatibility mode or this is not an ESM
22
+ // file that has been converted to a CommonJS file using a Babel-
23
+ // compatible transform (i.e. "__esModule" has not been set), then set
24
+ // "default" to the CommonJS "module.exports" for node compatibility.
25
+ isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
+ mod
27
+ ));
28
+ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
+
30
+ // src/ModalFooter/index.ts
31
+ var ModalFooter_exports = {};
32
+ __export(ModalFooter_exports, {
33
+ ModalFooter: () => ModalFooter
34
+ });
35
+ module.exports = __toCommonJS(ModalFooter_exports);
36
+
37
+ // src/ModalFooter/ModalFooter.tsx
38
+ var React = __toESM(require("react"));
39
+ var import_clsx = require("clsx");
40
+ var import_jsx_runtime = require("react/jsx-runtime");
41
+ var modalFooterStyles = {
42
+ container: {
43
+ display: "flex",
44
+ alignItems: "center",
45
+ justifyContent: "flex-end",
46
+ gap: "16px",
47
+ width: "100%",
48
+ padding: "16px",
49
+ backgroundColor: "#ffffff",
50
+ boxSizing: "border-box",
51
+ maxHeight: "56px"
52
+ }
53
+ };
54
+ var ModalFooter = React.forwardRef(
55
+ ({ children, className, style, ...props }, ref) => {
56
+ return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
57
+ "div",
58
+ {
59
+ ref,
60
+ className: (0, import_clsx.clsx)("arbor-modal-footer", className),
61
+ style: { ...modalFooterStyles.container, ...style },
62
+ ...props,
63
+ children
64
+ }
65
+ );
66
+ }
67
+ );
68
+ ModalFooter.displayName = "ModalFooter";
69
+ // Annotate the CommonJS export names for ESM import in node:
70
+ 0 && (module.exports = {
71
+ ModalFooter
72
+ });
73
+ //# sourceMappingURL=ModalFooter.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../src/ModalFooter/index.ts","../src/ModalFooter/ModalFooter.tsx"],"sourcesContent":["export { ModalFooter } from './ModalFooter';\nexport type { ModalFooterProps } from './ModalFooter';\n","import * as React from 'react';\nimport { clsx } from 'clsx';\n\nexport interface ModalFooterProps {\n /**\n * The content of the footer, typically buttons\n */\n children: React.ReactNode;\n /**\n * Additional CSS class name\n */\n className?: string;\n /**\n * Additional inline styles\n */\n style?: React.CSSProperties;\n}\n\n// Arbor Design System modal footer styles\nconst modalFooterStyles = {\n container: {\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'flex-end',\n gap: '16px',\n width: '100%',\n padding: '16px',\n backgroundColor: '#ffffff',\n boxSizing: 'border-box' as const,\n maxHeight: '56px',\n },\n};\n\n/**\n * ModalFooter component - Arbor Design System\n *\n * The footer part of a modal dialog, typically containing action buttons.\n * Buttons are right-aligned by default.\n *\n * @example\n * ```tsx\n * // Footer with two buttons\n * <ModalFooter>\n * <Button variant=\"tertiary\">Cancel</Button>\n * <Button variant=\"primary\">Save</Button>\n * </ModalFooter>\n *\n * // Footer with destructive action\n * <ModalFooter>\n * <Button variant=\"tertiary\">Cancel</Button>\n * <Button variant=\"destructive-secondary\">Delete</Button>\n * </ModalFooter>\n * ```\n */\nexport const ModalFooter = React.forwardRef<HTMLDivElement, ModalFooterProps>(\n ({ children, className, style, ...props }, ref) => {\n return (\n <div\n ref={ref}\n className={clsx('arbor-modal-footer', className)}\n style={{ ...modalFooterStyles.container, ...style }}\n {...props}\n >\n {children}\n </div>\n );\n }\n);\n\nModalFooter.displayName = 'ModalFooter';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,YAAuB;AACvB,kBAAqB;AAwDf;AAtCN,IAAM,oBAAoB;AAAA,EACxB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,KAAK;AAAA,IACL,OAAO;AAAA,IACP,SAAS;AAAA,IACT,iBAAiB;AAAA,IACjB,WAAW;AAAA,IACX,WAAW;AAAA,EACb;AACF;AAuBO,IAAM,cAAoB;AAAA,EAC/B,CAAC,EAAE,UAAU,WAAW,OAAO,GAAG,MAAM,GAAG,QAAQ;AACjD,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,eAAW,kBAAK,sBAAsB,SAAS;AAAA,QAC/C,OAAO,EAAE,GAAG,kBAAkB,WAAW,GAAG,MAAM;AAAA,QACjD,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AACF;AAEA,YAAY,cAAc;","names":[]}
@@ -0,0 +1,7 @@
1
+ import {
2
+ ModalFooter
3
+ } from "./chunk-P7RKUESQ.mjs";
4
+ export {
5
+ ModalFooter
6
+ };
7
+ //# sourceMappingURL=ModalFooter.mjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}