@easypost/easy-ui 1.0.0-alpha.5 → 1.0.0-alpha.7

package/CodeSnippet/CodeSnippet.d.ts

@@ -0,0 +1,82 @@
+import React from "react";
+import { SnippetLanguage } from "./SyntaxHighlighter";
+export type CodeSnippetProps = Partial<Omit<HTMLDivElement, "children">> & {
+    /**
+     * `children` is not supported. Use `code` instead.
+     */
+    children?: never;
+    /**
+     * The code snippet to be rendered.
+     */
+    code: string;
+    /**
+     * The language of the code snippet.
+     */
+    language: SnippetLanguage;
+    /**
+     * Constrains the height of code block to a set number of lines.
+     */
+    maxLines?: number;
+    /**
+     * Include line numbers in code block.
+     */
+    showLineNumbers?: boolean;
+};
+/**
+ * A display element for readable blocks of code.
+ *
+ * @remarks
+ * Use a Code Block to improve readability of embedded code samples with
+ * syntax highlighting and automatic line numbering.
+ *
+ * @example
+ * ```tsx
+ * <CodeSnippet
+ *   code={`console.log("Hello world");`}
+ *   language="javascript"
+ * />
+ * ```
+ *
+ * @example
+ * _Line numbers:_
+ * ```tsx
+ * <CodeSnippet
+ *   code={`console.log("Hello world");`}
+ *   language="javascript"
+ *   showLineNumbers
+ * />
+ * ```
+ *
+ * @example
+ * _Max lines:_
+ * ```tsx
+ * <CodeSnippet
+ *   code={`console.log("Hello world");`}
+ *   language="javascript"
+ *   maxLines={8}
+ * />
+ * ```
+ */
+export declare const CodeSnippet: React.ForwardRefExoticComponent<Partial<Omit<HTMLDivElement, "children">> & {
+    /**
+     * `children` is not supported. Use `code` instead.
+     */
+    children?: undefined;
+    /**
+     * The code snippet to be rendered.
+     */
+    code: string;
+    /**
+     * The language of the code snippet.
+     */
+    language: SnippetLanguage;
+    /**
+     * Constrains the height of code block to a set number of lines.
+     */
+    maxLines?: number | undefined;
+    /**
+     * Include line numbers in code block.
+     */
+    showLineNumbers?: boolean | undefined;
+} & React.RefAttributes<HTMLDivElement>>;
+//# sourceMappingURL=CodeSnippet.d.ts.map

package/CodeSnippet/CodeSnippet.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeSnippet.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/CodeSnippet.tsx"],"names":[],"mappings":"AACA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAE9D,OAAO,EAAE,eAAe,EAAqB,MAAM,qBAAqB,CAAC;AAOzE,MAAM,MAAM,gBAAgB,GAAG,OAAO,CAAC,IAAI,CAAC,cAAc,EAAE,UAAU,CAAC,CAAC,GAAG;IACzE;;OAEG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC;IAEjB;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,QAAQ,EAAE,eAAe,CAAC;IAE1B;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,WAAW;IA7DtB;;OAEG;;IAGH;;OAEG;UACG,MAAM;IAEZ;;OAEG;cACO,eAAe;IAEzB;;OAEG;;IAGH;;OAEG;;wCAkEJ,CAAC"}

package/CodeSnippet/CodeSnippet.stories.d.ts

@@ -0,0 +1,14 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { CodeSnippet } from "./CodeSnippet";
+import { SnippetLanguage } from "./SyntaxHighlighter";
+type Story = StoryObj<typeof CodeSnippet>;
+declare const meta: Meta<typeof CodeSnippet>;
+export default meta;
+export declare const Default: Story;
+export declare const LineNumbers: Story;
+export declare const MaxLines: Story;
+export declare function getSnippetEntries(): [SnippetLanguage, string][];
+export declare function getSnippets(): {
+    [x: string]: string;
+};
+//# sourceMappingURL=CodeSnippet.stories.d.ts.map

package/CodeSnippet/CodeSnippet.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeSnippet.stories.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/CodeSnippet.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAC;AAElD,OAAO,EAAE,WAAW,EAAoB,MAAM,eAAe,CAAC;AAC9D,OAAO,EAAoB,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAExE,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,WAAW,CAAC,CAAC;AAM1C,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,WAAW,CASlC,CAAC;AAEF,eAAe,IAAI,CAAC;AAEpB,eAAO,MAAM,OAAO,EAAE,KAErB,CAAC;AAEF,eAAO,MAAM,WAAW,EAAE,KAKzB,CAAC;AAEF,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAC;AAEF,wBAAgB,iBAAiB,gCAEhC;AAED,wBAAgB,WAAW;;EAoN1B"}

package/CodeSnippet/CodeSnippet.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=CodeSnippet.test.d.ts.map

package/CodeSnippet/CodeSnippet.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CodeSnippet.test.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/CodeSnippet.test.tsx"],"names":[],"mappings":""}

package/CodeSnippet/SyntaxHighlighter.d.ts

@@ -0,0 +1,8 @@
+import { PrismLight as SyntaxHighlighter } from "react-syntax-highlighter";
+export type SnippetLanguage = "csharp" | "go" | "java" | "javascript" | "json" | "php" | "python" | "ruby" | "shell";
+declare const SnippetLanguages: Record<string, SnippetLanguage>;
+declare const friendlySnippetLanguageNames: {
+    [x: string]: string;
+};
+export { SyntaxHighlighter, SnippetLanguages, friendlySnippetLanguageNames };
+//# sourceMappingURL=SyntaxHighlighter.d.ts.map

package/CodeSnippet/SyntaxHighlighter.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SyntaxHighlighter.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/SyntaxHighlighter.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,IAAI,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAY3E,MAAM,MAAM,eAAe,GACvB,QAAQ,GACR,IAAI,GACJ,MAAM,GACN,YAAY,GACZ,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,CAAC;AAEZ,QAAA,MAAM,gBAAgB,EAAE,MAAM,CAAC,MAAM,EAAE,eAAe,CAUrD,CAAC;AAEF,QAAA,MAAM,4BAA4B;;CAUjC,CAAC;AAYF,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,EAAE,4BAA4B,EAAE,CAAC"}

package/CodeSnippet/index.d.ts

@@ -0,0 +1,2 @@
+export * from "./CodeSnippet";
+//# sourceMappingURL=index.d.ts.map

package/CodeSnippet/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC"}

package/CodeSnippet/index.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const CodeSnippet_index = require("../__chunks__/index-a7b6b429.js");
+require("../__chunks__/import-a1e0f814.js");
+require("react");
+require("../Card/index.js");
+require("../__chunks__/omit-fca26542.js");
+require("../utilities/css.js");
+require("../__chunks__/tokens-ad06cd2c.js");
+require("../__chunks__/overlayscrollbars-react.es-f2a0bcff.js");
+exports.CodeSnippet = CodeSnippet_index.CodeSnippet;

package/CodeSnippet/index.mjs

@@ -0,0 +1,11 @@
+import { a } from "../__chunks__/index-72137376.mjs";
+import "../__chunks__/import-19bc38ac.mjs";
+import "react";
+import "../Card/index.mjs";
+import "../__chunks__/omit-f17deb8f.mjs";
+import "../utilities/css.mjs";
+import "../__chunks__/tokens-3c27019b.mjs";
+import "../__chunks__/overlayscrollbars-react.es-7f332a3b.mjs";
+export {
+  a as CodeSnippet
+};

package/CodeSnippet/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/theme.ts"],"names":[],"mappings":";AAIA,wBAAgB,+BAA+B,CAAC,QAAQ,CAAC,EAAE,MAAM,iDAqBhE;AAED,MAAM,MAAM,4BAA4B,GAAG;IACzC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,OAAO,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,wBAAgB,UAAU,CACxB,MAAM,EAAE,4BAA4B,GACnC,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,aAAa,CAAC,CAiMrC"}

package/CodeSnippet/useScrollbar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useScrollbar.d.ts","sourceRoot":"","sources":["../../src/CodeSnippet/useScrollbar.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAa,MAAM,OAAO,CAAC;AAEpD;;;;;;;;GAQG;AACH,wBAAgB,YAAY,CAC1B,YAAY,EAAE,gBAAgB,CAAC,cAAc,GAAG,IAAI,CAAC,QA0CtD"}

package/DropdownButton/DropdownButton.d.ts

@@ -12,6 +12,54 @@ export type DropdownButtonProps = AriaButtonProps & {
     /** Content inside button  */
     children?: ReactNode;
 };
+/**
+ * Typically used as a trigger to display a set of options for
+ * the user to choose from.
+ *
+ * @remarks
+ * Can be used alongside Easy UI's `<Menu />` as the trigger element.
+ * Comes pre-styled with separator and right-aligned arrow icon. Supports
+ * multiple colors and an outlined variant. Underlying element is a button.
+ *
+ * @example
+ * _Default:_
+ * ```tsx
+ * import { DropdownButton } from "@easypost/easy-ui/DropdownButton";
+ *
+ * export function Component() {
+ *  return (
+ *   <DropdownButton onPress={() => alert("clicked")}>Button</DropdownButton>
+ *  );
+ * }
+ * ```
+ *
+ * @example
+ * _Outlined variant:_
+ * ```tsx
+ * import { DropdownButton } from "@easypost/easy-ui/DropdownButton";
+ *
+ * export function Component() {
+ *  return (
+ *    <DropdownButton onPress={() => alert("clicked")} variant="outlined">
+ *      Button
+ *    </DropdownButton>
+ *  );
+ * }
+ * ```
+ * @example
+ * _Success color:_
+ * ```tsx
+ * import { DropdownButton } from "@easypost/easy-ui/DropdownButton";
+ *
+ * export function Component() {
+ *  return (
+ *    <DropdownButton onPress={() => alert("clicked")} color="success">
+ *      Button
+ *    </DropdownButton>
+ *  );
+ * }
+ * ```
+ */
 export declare const DropdownButton: React.ForwardRefExoticComponent<AriaButtonProps<"button"> & {
     /** Button color */
     color?: ButtonColor | undefined;

package/DropdownButton/DropdownButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownButton.d.ts","sourceRoot":"","sources":["../../src/DropdownButton/DropdownButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAOxC,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1D,MAAM,MAAM,mBAAmB,GAAG,eAAe,GAAG;IAClD,mBAAmB;IACnB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,qBAAqB;IACrB,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,sBAAsB;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF,eAAO,MAAM,cAAc;IAVzB,mBAAmB;;IAEnB,qBAAqB;;IAErB,sBAAsB;;IAEtB,6BAA6B;eAClB,SAAS;8BAgCrB,CAAC"}
+{"version":3,"file":"DropdownButton.d.ts","sourceRoot":"","sources":["../../src/DropdownButton/DropdownButton.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAc,MAAM,OAAO,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAOxC,MAAM,MAAM,qBAAqB,GAAG,QAAQ,GAAG,UAAU,CAAC;AAE1D,MAAM,MAAM,mBAAmB,GAAG,eAAe,GAAG;IAClD,mBAAmB;IACnB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,qBAAqB;IACrB,OAAO,CAAC,EAAE,qBAAqB,CAAC;IAChC,sBAAsB;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,6BAA6B;IAC7B,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA+CG;AACH,eAAO,MAAM,cAAc;IA1DzB,mBAAmB;;IAEnB,qBAAqB;;IAErB,sBAAsB;;IAEtB,6BAA6B;eAClB,SAAS;8BAgFrB,CAAC"}

package/DropdownButton/index.js

@@ -30,23 +30,23 @@ var __objRest = (source, exclude) => {
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const ExpandMore400 = require("../__chunks__/ExpandMore400-92646971.js");
 const React = require("react");
-const UnstyledButton = require("../__chunks__/UnstyledButton-5bbb3c5e.js");
-const Icon = require("../__chunks__/Icon-1a25dcae.js");
+const UnstyledButton_index = require("../__chunks__/index-5f429325.js");
+const Icon_index = require("../Icon/index.js");
 const utilities_css = require("../utilities/css.js");
 require("../__chunks__/import-a1e0f814.js");
 require("../__chunks__/omit-fca26542.js");
-require("../__chunks__/import-9581a2dc.js");
-const DropdownButton$1 = "_DropdownButton_wpn09_5";
-const colorPrimary = "_colorPrimary_wpn09_26";
-const colorSecondary = "_colorSecondary_wpn09_34";
-const colorSuccess = "_colorSuccess_wpn09_42";
-const colorWarning = "_colorWarning_wpn09_50";
-const colorNeutral = "_colorNeutral_wpn09_58";
-const colorSupport = "_colorSupport_wpn09_66";
-const colorInverse = "_colorInverse_wpn09_72";
-const variantOutlined = "_variantOutlined_wpn09_78";
-const variantFilled = "_variantFilled_wpn09_109";
-const pipeSeparator = "_pipeSeparator_wpn09_136";
+require("../__chunks__/import-26676303.js");
+const DropdownButton$1 = "_DropdownButton_1qxoo_5";
+const colorPrimary = "_colorPrimary_1qxoo_26";
+const colorSecondary = "_colorSecondary_1qxoo_34";
+const colorSuccess = "_colorSuccess_1qxoo_42";
+const colorWarning = "_colorWarning_1qxoo_50";
+const colorNeutral = "_colorNeutral_1qxoo_58";
+const colorSupport = "_colorSupport_1qxoo_66";
+const colorInverse = "_colorInverse_1qxoo_72";
+const variantOutlined = "_variantOutlined_1qxoo_78";
+const variantFilled = "_variantFilled_1qxoo_109";
+const pipeSeparator = "_pipeSeparator_1qxoo_136";
 const styles = {
   DropdownButton: DropdownButton$1,
   colorPrimary,
@@ -62,14 +62,14 @@ const styles = {
 };
 const DropdownButton = React.forwardRef((props, inRef) => {
   const _a = props, { color = "primary", variant = "filled", isDisabled = false, children = "Button" } = _a, restProps = __objRest(_a, ["color", "variant", "isDisabled", "children"]);
-  UnstyledButton.logWarningIfInvalidColorVariantCombination(color, variant);
-  return React.createElement(UnstyledButton.UnstyledButton, __spreadValues({
+  UnstyledButton_index.logWarningIfInvalidColorVariantCombination(color, variant);
+  return React.createElement(UnstyledButton_index.UnstyledButton, __spreadValues({
     isDisabled,
     ref: inRef,
     className: utilities_css.classNames(styles.DropdownButton, styles[utilities_css.variationName("variant", variant)], styles[utilities_css.variationName("color", color)])
   }, restProps), React.createElement("span", null, children), React.createElement("span", {
     className: utilities_css.classNames(styles.pipeSeparator)
-  }), React.createElement(Icon.Icon, {
+  }), React.createElement(Icon_index.Icon, {
     symbol: ExpandMore400.ExpandMore400
   }));
 });

package/DropdownButton/index.mjs

@@ -28,23 +28,23 @@ var __objRest = (source, exclude) => {
 };
 import { E as ExpandMore400 } from "../__chunks__/ExpandMore400-7c5263a4.mjs";
 import React__default, { forwardRef } from "react";
-import { l as logWarningIfInvalidColorVariantCombination, U as UnstyledButton } from "../__chunks__/UnstyledButton-981cd9af.mjs";
-import { I as Icon } from "../__chunks__/Icon-6eb724b4.mjs";
+import { l as logWarningIfInvalidColorVariantCombination, U as UnstyledButton } from "../__chunks__/index-45f05366.mjs";
+import { Icon } from "../Icon/index.mjs";
 import { classNames, variationName } from "../utilities/css.mjs";
-import "../__chunks__/import-fbe7cc7e.mjs";
+import "../__chunks__/import-19bc38ac.mjs";
 import "../__chunks__/omit-f17deb8f.mjs";
-import "../__chunks__/import-a6cadfe8.mjs";
-const DropdownButton$1 = "_DropdownButton_wpn09_5";
-const colorPrimary = "_colorPrimary_wpn09_26";
-const colorSecondary = "_colorSecondary_wpn09_34";
-const colorSuccess = "_colorSuccess_wpn09_42";
-const colorWarning = "_colorWarning_wpn09_50";
-const colorNeutral = "_colorNeutral_wpn09_58";
-const colorSupport = "_colorSupport_wpn09_66";
-const colorInverse = "_colorInverse_wpn09_72";
-const variantOutlined = "_variantOutlined_wpn09_78";
-const variantFilled = "_variantFilled_wpn09_109";
-const pipeSeparator = "_pipeSeparator_wpn09_136";
+import "../__chunks__/import-3faba3a6.mjs";
+const DropdownButton$1 = "_DropdownButton_1qxoo_5";
+const colorPrimary = "_colorPrimary_1qxoo_26";
+const colorSecondary = "_colorSecondary_1qxoo_34";
+const colorSuccess = "_colorSuccess_1qxoo_42";
+const colorWarning = "_colorWarning_1qxoo_50";
+const colorNeutral = "_colorNeutral_1qxoo_58";
+const colorSupport = "_colorSupport_1qxoo_66";
+const colorInverse = "_colorInverse_1qxoo_72";
+const variantOutlined = "_variantOutlined_1qxoo_78";
+const variantFilled = "_variantFilled_1qxoo_109";
+const pipeSeparator = "_pipeSeparator_1qxoo_136";
 const styles = {
   DropdownButton: DropdownButton$1,
   colorPrimary,

package/HorizontalGrid/index.js

@@ -47,7 +47,7 @@ function getColumnValue(columns) {
     }
   }).join(" ");
 }
-const HorizontalGrid$1 = "_HorizontalGrid_fynrb_5";
+const HorizontalGrid$1 = "_HorizontalGrid_unqrd_5";
 const styles = {
   HorizontalGrid: HorizontalGrid$1
 };

package/HorizontalGrid/index.mjs

@@ -45,7 +45,7 @@ function getColumnValue(columns) {
     }
   }).join(" ");
 }
-const HorizontalGrid$1 = "_HorizontalGrid_fynrb_5";
+const HorizontalGrid$1 = "_HorizontalGrid_unqrd_5";
 const styles = {
   HorizontalGrid: HorizontalGrid$1
 };

package/HorizontalStack/index.js

@@ -1,6 +1,50 @@
 "use strict";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const HorizontalStack = require("../__chunks__/HorizontalStack-f331bfc7.js");
-require("react");
-require("../utilities/css.js");
-exports.HorizontalStack = HorizontalStack.HorizontalStack;
+const React = require("react");
+const utilities_css = require("../utilities/css.js");
+const HorizontalStack$1 = "_HorizontalStack_1x1v6_5";
+const styles = {
+  HorizontalStack: HorizontalStack$1
+};
+const HorizontalStack = React.forwardRef((props, ref) => {
+  const _a = props, { as: As = "div", align, blockAlign, gap, wrap = true, children, inline } = _a, restProps = __objRest(_a, ["as", "align", "blockAlign", "gap", "wrap", "children", "inline"]);
+  const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, utilities_css.getResponsiveDesignToken("horizontal-stack", "gap", "space", gap)), utilities_css.getComponentToken("horizontal-stack", "align", align)), utilities_css.getComponentToken("horizontal-stack", "block-align", blockAlign)), utilities_css.getComponentToken("horizontal-stack", "wrap", wrap ? "wrap" : "nowrap")), utilities_css.getComponentToken("horizontal-stack", "display", inline ? "inline-flex" : "flex"));
+  return React.createElement(As, __spreadProps(__spreadValues({}, restProps), {
+    className: styles.HorizontalStack,
+    style,
+    ref
+  }), children);
+});
+HorizontalStack.displayName = "HorizontalStack";
+exports.HorizontalStack = HorizontalStack;

package/HorizontalStack/index.mjs

@@ -1,6 +1,50 @@
-import { H } from "../__chunks__/HorizontalStack-65adb570.mjs";
-import "react";
-import "../utilities/css.mjs";
+var __defProp = Object.defineProperty;
+var __defProps = Object.defineProperties;
+var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
+import React__default, { forwardRef } from "react";
+import { getResponsiveDesignToken, getComponentToken } from "../utilities/css.mjs";
+const HorizontalStack$1 = "_HorizontalStack_1x1v6_5";
+const styles = {
+  HorizontalStack: HorizontalStack$1
+};
+const HorizontalStack = forwardRef((props, ref) => {
+  const _a = props, { as: As = "div", align, blockAlign, gap, wrap = true, children, inline } = _a, restProps = __objRest(_a, ["as", "align", "blockAlign", "gap", "wrap", "children", "inline"]);
+  const style = __spreadValues(__spreadValues(__spreadValues(__spreadValues(__spreadValues({}, getResponsiveDesignToken("horizontal-stack", "gap", "space", gap)), getComponentToken("horizontal-stack", "align", align)), getComponentToken("horizontal-stack", "block-align", blockAlign)), getComponentToken("horizontal-stack", "wrap", wrap ? "wrap" : "nowrap")), getComponentToken("horizontal-stack", "display", inline ? "inline-flex" : "flex"));
+  return React__default.createElement(As, __spreadProps(__spreadValues({}, restProps), {
+    className: styles.HorizontalStack,
+    style,
+    ref
+  }), children);
+});
+HorizontalStack.displayName = "HorizontalStack";
 export {
-  H as HorizontalStack
+  HorizontalStack
 };

package/Icon/Icon.d.ts

@@ -13,5 +13,56 @@ export type IconProps = {
     /** Description of icon for informative symbols */
     accessibilityLabel?: string;
 };
+/**
+ * Icons are helpful and familiar visual symbols used to communicate
+ * ideas and represent objects and actions.
+ *
+ * @remarks
+ * Can accept any Easy UI icon via `symbol` prop. Supports customizable
+ * responsive sizing, theme and design token colors, and an accessibility
+ * label for informative symbols.
+ *
+ * @example
+ * _Default:_
+ * ```tsx
+ * import { Icon } from "@easypost/easy-ui/Icon";
+ * import AddIcon from "@easypost/easy-ui-icons/Add";
+ *
+ * export function Component() {
+ *  return <Icon symbol={AddIcon} />;
+ * }
+ * ```
+ *
+ * @example
+ * _With accessibility label:_
+ * ```tsx
+ * import { Icon } from "@easypost/easy-ui/Icon";
+ * import AddIcon from "@easypost/easy-ui-icons/Add";
+ *
+ * export function Component() {
+ *  return <Icon symbol={AddIcon} accessibilityLabel="Add item" />;
+ * }
+ * ```
+ * @example
+ * _With color and size:_
+ * ```tsx
+ * import { Icon } from "@easypost/easy-ui/Icon";
+ * import AddIcon from "@easypost/easy-ui-icons/Add";
+ *
+ * export function Component() {
+ *  return <Icon symbol={AddIcon} color="success.inverse" size="sm" />;
+ * }
+ * ```
+ * @example
+ * _With responsive sizing:_
+ * ```tsx
+ * import { Icon } from "@easypost/easy-ui/Icon";
+ * import AddIcon from "@easypost/easy-ui-icons/Add";
+ *
+ * export function Component() {
+ *  return <Icon symbol={AddIcon} size={{ sm: "sm", md: "md", lg: "lg" }} />;
+ * }
+ * ```
+ */
 export declare function Icon({ symbol: Symbol, size, color, accessibilityLabel, }: IconProps): React.JSX.Element;
 //# sourceMappingURL=Icon.d.ts.map

package/Icon/Icon.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,UAAU,EACV,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,UAAU,CAAC;AAClB,OAAO,EAGL,cAAc,EACf,MAAM,kBAAkB,CAAC;AAI1B,MAAM,MAAM,QAAQ,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;AACzD,MAAM,MAAM,SAAS,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;AAE1D,MAAM,MAAM,SAAS,GAAG;IACtB,0DAA0D;IAC1D,MAAM,EAAE,UAAU,CAAC;IACnB,uBAAuB;IACvB,IAAI,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAChC,wBAAwB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kDAAkD;IAClD,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF,wBAAgB,IAAI,CAAC,EACnB,MAAM,EAAE,MAAM,EACd,IAAW,EACX,KAAK,EACL,kBAAkB,GACnB,EAAE,SAAS,qBAgBX"}
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../src/Icon/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EACL,UAAU,EACV,mBAAmB,EACnB,oBAAoB,EACrB,MAAM,UAAU,CAAC;AAClB,OAAO,EAGL,cAAc,EACf,MAAM,kBAAkB,CAAC;AAI1B,MAAM,MAAM,QAAQ,GAAG,oBAAoB,CAAC,WAAW,CAAC,CAAC;AACzD,MAAM,MAAM,SAAS,GAAG,mBAAmB,CAAC,YAAY,CAAC,CAAC;AAE1D,MAAM,MAAM,SAAS,GAAG;IACtB,0DAA0D;IAC1D,MAAM,EAAE,UAAU,CAAC;IACnB,uBAAuB;IACvB,IAAI,CAAC,EAAE,cAAc,CAAC,QAAQ,CAAC,CAAC;IAChC,wBAAwB;IACxB,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,kDAAkD;IAClD,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkDG;AACH,wBAAgB,IAAI,CAAC,EACnB,MAAM,EAAE,MAAM,EACd,IAAW,EACX,KAAK,EACL,kBAAkB,GACnB,EAAE,SAAS,qBAgBX"}

package/Icon/index.js

@@ -1,6 +1,40 @@
 "use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const Icon = require("../__chunks__/Icon-1a25dcae.js");
-require("react");
-require("../utilities/css.js");
-exports.Icon = Icon.Icon;
+const React = require("react");
+const utilities_css = require("../utilities/css.js");
+const Icon$1 = "_Icon_1yhzm_5";
+const Svg = "_Svg_1yhzm_54";
+const styles = {
+  Icon: Icon$1,
+  Svg
+};
+function Icon({ symbol: Symbol2, size = "md", color, accessibilityLabel }) {
+  const style = __spreadValues(__spreadValues({}, utilities_css.getComponentThemeToken("icon", "color", "color.text", color)), utilities_css.getResponsiveDesignToken("icon", "size", "size.icon", size));
+  return React.createElement("span", {
+    className: styles.Icon,
+    style
+  }, React.createElement(Symbol2, {
+    className: styles.Svg,
+    focusable: "false",
+    role: "img",
+    title: accessibilityLabel,
+    "aria-hidden": !accessibilityLabel ? "true" : void 0
+  }));
+}
+exports.Icon = Icon;

package/Icon/index.mjs

@@ -1,6 +1,40 @@
-import { I } from "../__chunks__/Icon-6eb724b4.mjs";
-import "react";
-import "../utilities/css.mjs";
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+import React__default from "react";
+import { getComponentThemeToken, getResponsiveDesignToken } from "../utilities/css.mjs";
+const Icon$1 = "_Icon_1yhzm_5";
+const Svg = "_Svg_1yhzm_54";
+const styles = {
+  Icon: Icon$1,
+  Svg
+};
+function Icon({ symbol: Symbol2, size = "md", color, accessibilityLabel }) {
+  const style = __spreadValues(__spreadValues({}, getComponentThemeToken("icon", "color", "color.text", color)), getResponsiveDesignToken("icon", "size", "size.icon", size));
+  return React__default.createElement("span", {
+    className: styles.Icon,
+    style
+  }, React__default.createElement(Symbol2, {
+    className: styles.Svg,
+    focusable: "false",
+    role: "img",
+    title: accessibilityLabel,
+    "aria-hidden": !accessibilityLabel ? "true" : void 0
+  }));
+}
 export {
-  I as Icon
+  Icon
 };