@arc-ui/components 10.7.0 → 10.8.1

package/dist/Columns/Columns.esm.d.ts

@@ -0,0 +1,76 @@
+import { FC, ReactNode } from "react";
+/**
+ * Use `Columns` to compose layouts on a 12-column grid.
+ */
+declare const Columns: FC<ColumnsProps> & {
+    Col: typeof Col;
+};
+declare const Col: FC<ColProps>;
+type Span = 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12;
+type Offset = "0" | "24" | "48" | "72" | "96" | "120" | "144" | "168" | "192" | "216" | "240" | "264" | "288" | "312" | "336" | "360" | "384";
+interface ColProps {
+    /**
+     * Vertically align the Column.
+     */
+    align?: "top" | "center" | "bottom";
+    /**
+     * Content to display in the Column.
+     */
+    children?: ReactNode;
+    /**
+     * Should the Column be visible for debugging and documentation
+     * purposes?
+     */
+    isDebugVisible?: boolean;
+    /**
+     * Overlay the column over the previous content on the default breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
+     */
+    offset?: Offset;
+    /**
+     * Overlay the column over the previous content on the S breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
+     */
+    offsetS?: Offset;
+    /**
+     * Overlay the column over the previous content on the M breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
+     */
+    offsetM?: Offset;
+    /**
+     * Overlay the column over the previous content on the L breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
+     */
+    offsetL?: Offset;
+    /**
+     * Overlay the column over the previous content on the XL breakpoint and above. Multiples of 24 up to 384. Use with caution, and ensure to check responsive behaviour.
+     */
+    offsetXL?: Offset;
+    /**
+     * The number of columns to span on the default breakpoint and above, from 1 to 12.
+     */
+    span?: Span;
+    /**
+     * The number of columns to span on the S breakpoint and above, from 1 to 12.
+     */
+    spanS?: Span;
+    /**
+     * The number of columns to span on the M breakpoint and above, from 1 to 12.
+     */
+    spanM?: Span;
+    /**
+     * The number of columns to span on the L breakpoint and above, from 1 to 12.
+     */
+    spanL?: Span;
+    /**
+     * The number of columns to span on the XL breakpoint and above, from 1 to 12.
+     */
+    spanXL?: Span;
+}
+interface ColumnsProps {
+    /**
+     * Contents of the Columns. Should only contain `Columns.Col`.
+     */
+    children: ReactNode;
+    /**
+     * Should the Columns be gutterless?
+     */
+    isGutterless?: boolean;
+}
+export { Columns };

package/dist/Columns/{index.js → Columns.esm.js}

@@ -1,7 +1,7 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/index-e3c83626.js';
-import { c as classNames } from '../_shared/index-56d9df62.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React, { useEffect } from 'react';
-import { s as suffixModifier } from '../_shared/suffix-modifier-2a93822c.js';
+import { s as suffixModifier } from '../_shared/esm/suffix-modifier-f5e28822.js';
 
 /**
  * Use `Columns` to compose layouts on a 12-column grid.

package/dist/Columns/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/columns",
+  "types": "./Columns.esm.d.ts",
+  "main": "./Columns.cjs.js",
+  "module": "./Columns.esm.js",
+  "private": true
+}

package/dist/Curve/Curve.cjs.d.ts

@@ -0,0 +1 @@
+export { Curve } from "../_shared/cjs/Curve-e72ce25b";

package/dist/Curve/Curve.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Curve = require('../_shared/cjs/Curve-e72ce25b.js');
+require('../_shared/cjs/index-78b35bc1.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+
+
+
+exports.Curve = Curve.Curve;

package/dist/Curve/Curve.esm.d.ts

@@ -0,0 +1 @@
+export { Curve } from "../_shared/esm/Curve-cfdca379";

package/dist/Curve/Curve.esm.js

@@ -0,0 +1,5 @@
+export { C as Curve } from '../_shared/esm/Curve-cfdca379.js';
+import '../_shared/esm/index-229fc864.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/suffix-modifier-f5e28822.js';

package/dist/Curve/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/curve",
+  "types": "./Curve.esm.d.ts",
+  "main": "./Curve.cjs.js",
+  "module": "./Curve.esm.js",
+  "private": true
+}

package/dist/Disclosure/{index.d.ts → Disclosure.cjs.d.ts}

@@ -1,5 +1,5 @@
 import { FC, ReactNode } from "react";
-import { HeadingLevel } from "../_shared/Heading-8c640dd1";
+import { HeadingLevel } from "../_shared/cjs/Heading-cc38c3ec";
 /**
  * Use `Disclosure` to display content that is only visible when toggled into
  * an "open" state.

package/dist/Disclosure/Disclosure.cjs.js

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../_shared/cjs/index-78b35bc1.js');
+var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var React = require('react');
+var Heading = require('../_shared/cjs/Heading-cc38c3ec.js');
+var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Use `Disclosure` to display content that is only visible when toggled into
+ * an "open" state.
+ */
+var Disclosure = function (_a) {
+    var children = _a.children, headingLevel = _a.headingLevel, _b = _a.indentDetails, indentDetails = _b === void 0 ? false : _b, _c = _a.isOpen, isOpen = _c === void 0 ? false : _c, summary = _a.summary, props = index.__rest(_a, ["children", "headingLevel", "indentDetails", "isOpen", "summary"]);
+    var surface = React.useContext(Surface.Context).surface;
+    return (React__default["default"].createElement("details", index.__assign({ className: index$1.classNames({
+            "arc-Disclosure": true,
+            "arc-Disclosure--indentDetails": indentDetails,
+            "arc-Disclosure--onDarkSurface": surface === "dark"
+        }), open: isOpen }, index.filterDataAttrs(props)),
+        React__default["default"].createElement("summary", { className: "arc-Disclosure-summary" },
+            React__default["default"].createElement(Heading.Heading, { level: headingLevel, size: "s" }, summary)),
+        React__default["default"].createElement("div", { className: "arc-Disclosure-details" }, children)));
+};
+
+exports.Disclosure = Disclosure;

package/dist/Disclosure/Disclosure.esm.d.ts

@@ -0,0 +1,31 @@
+import { FC, ReactNode } from "react";
+import { HeadingLevel } from "../_shared/esm/Heading-183be76c";
+/**
+ * Use `Disclosure` to display content that is only visible when toggled into
+ * an "open" state.
+ */
+declare const Disclosure: FC<DisclosureProps>;
+interface DisclosureProps {
+    /**
+     * Content to display in the Disclosure.
+     */
+    children: ReactNode;
+    /**
+     * HTML section heading level of the Disclosure summary. If not provided, will
+     * render as a span.
+     */
+    headingLevel?: HeadingLevel;
+    /**
+     * Should Disclosure details be indented to line-up with summary text?
+     */
+    indentDetails?: boolean;
+    /**
+     * Should the Disclosure content be open by default?
+     */
+    isOpen?: boolean;
+    /**
+     * The Disclosure summary text.
+     */
+    summary: string;
+}
+export { Disclosure };

package/dist/Disclosure/{index.js → Disclosure.esm.js}

@@ -1,9 +1,9 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/index-e3c83626.js';
-import { c as classNames } from '../_shared/index-56d9df62.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React, { useContext } from 'react';
-import { H as Heading } from '../_shared/Heading-8c640dd1.js';
-import { C as Context } from '../_shared/Surface-3fe44a2a.js';
-import '../_shared/suffix-modifier-2a93822c.js';
+import { H as Heading } from '../_shared/esm/Heading-183be76c.js';
+import { C as Context } from '../_shared/esm/Surface-d515d212.js';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
 
 /**
  * Use `Disclosure` to display content that is only visible when toggled into

package/dist/Disclosure/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/disclosure",
+  "types": "./Disclosure.esm.d.ts",
+  "main": "./Disclosure.cjs.js",
+  "module": "./Disclosure.esm.js",
+  "private": true
+}

package/dist/Elevation/Elevation.cjs.js

@@ -0,0 +1,25 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../_shared/cjs/index-78b35bc1.js');
+var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Use `Elevation` to elevate what matters.
+ */
+var Elevation = function (_a) {
+    var _b;
+    var children = _a.children, _c = _a.isFullWidth, isFullWidth = _c === void 0 ? false : _c, props = index.__rest(_a, ["children", "isFullWidth"]);
+    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {},
+            _b["arc-Elevation"] = true,
+            _b["arc-Elevation--fullWidth"] = isFullWidth,
+            _b)) }, index.filterDataAttrs(props)), children));
+};
+
+exports.Elevation = Elevation;

package/dist/Elevation/Elevation.esm.d.ts

@@ -0,0 +1,16 @@
+import { FC, ReactNode } from "react";
+/**
+ * Use `Elevation` to elevate what matters.
+ */
+declare const Elevation: FC<ElevationProps>;
+interface ElevationProps {
+    /**
+     * Contents to Elevate.
+     */
+    children: ReactNode;
+    /**
+     * Should the Elevation be full width?
+     */
+    isFullWidth?: boolean;
+}
+export { Elevation };

package/dist/Elevation/{index.js → Elevation.esm.js}

@@ -1,5 +1,5 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/index-e3c83626.js';
-import { c as classNames } from '../_shared/index-56d9df62.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React from 'react';
 
 /**

package/dist/Elevation/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/elevation",
+  "types": "./Elevation.esm.d.ts",
+  "main": "./Elevation.cjs.js",
+  "module": "./Elevation.esm.js",
+  "private": true
+}

package/dist/FormControl/FormControl.cjs.d.ts

@@ -0,0 +1 @@
+export { FormControl, FormControlContext } from "../_shared/cjs/FormControl-7d8e10fa";

package/dist/FormControl/FormControl.cjs.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var FormControl = require('../_shared/cjs/FormControl-7d8e10fa.js');
+require('../_shared/cjs/index-78b35bc1.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/Surface-d6b8010e.js');
+
+
+
+exports.FormControl = FormControl.FormControl;
+exports.FormControlContext = FormControl.Context;

package/dist/FormControl/FormControl.esm.d.ts

@@ -0,0 +1 @@
+export { FormControl, FormControlContext } from "../_shared/esm/FormControl-33194106";

package/dist/FormControl/FormControl.esm.js

@@ -0,0 +1,5 @@
+export { F as FormControl, C as FormControlContext } from '../_shared/esm/FormControl-33194106.js';
+import '../_shared/esm/index-229fc864.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/Surface-d515d212.js';

package/dist/FormControl/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/formcontrol",
+  "types": "./FormControl.esm.d.ts",
+  "main": "./FormControl.cjs.js",
+  "module": "./FormControl.esm.js",
+  "private": true
+}

package/dist/Group/Group.cjs.js

@@ -0,0 +1,50 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../_shared/cjs/index-78b35bc1.js');
+var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var React = require('react');
+var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Use `Group` to arrange flexible items in a row.
+ */
+var Group = function (_a) {
+    var _b;
+    var children = _a.children, _c = _a.grow, grow = _c === void 0 ? false : _c, _d = _a.growEqual, growEqual = _d === void 0 ? false : _d, _e = _a.gutterBorder, gutterBorder = _e === void 0 ? false : _e, _f = _a.noWrap, noWrap = _f === void 0 ? false : _f, props = index.__rest(_a, ["children", "grow", "growEqual", "gutterBorder", "noWrap"]);
+    var surface = React.useContext(Surface.Context).surface;
+    React.useEffect(function () {
+        React__default["default"].Children.map(children, function (item) {
+            if (item && item.type !== GroupItem) {
+                throw new Error("Illegal child passed to <Group />. Ensure to only use <Group.Item />.");
+            }
+        });
+    }, [children]);
+    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {},
+            _b["arc-Group"] = true,
+            _b["arc-Group--grow"] = grow,
+            _b["arc-Group--growEqual"] = growEqual,
+            _b["arc-Group--gutterBorder"] = gutterBorder,
+            _b["arc-Group--noWrap"] = noWrap,
+            _b["arc-Group--onDarkSurface"] = surface === "dark",
+            _b)) }, index.filterDataAttrs(props)),
+        React__default["default"].createElement("div", { className: "arc-Group-inner" }, children)));
+};
+var GroupItem = function (_a) {
+    var _b;
+    var children = _a.children, _c = _a.grow, grow = _c === void 0 ? false : _c, _d = _a.isDebugVisible, isDebugVisible = _d === void 0 ? false : _d, props = index.__rest(_a, ["children", "grow", "isDebugVisible"]);
+    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames((_b = {},
+            _b["arc-Group-item"] = true,
+            _b["arc-Group-item--grow"] = grow,
+            _b["arc-Group-item--debugVisible"] = isDebugVisible,
+            _b)) }, index.filterDataAttrs(props)), children));
+};
+GroupItem.displayName = "Group.Item";
+Group.Item = GroupItem;
+
+exports.Group = Group;

package/dist/Group/Group.esm.d.ts

@@ -0,0 +1,46 @@
+import { FC, ReactNode } from "react";
+/**
+ * Use `Group` to arrange flexible items in a row.
+ */
+declare const Group: FC<GroupProps> & {
+    Item: typeof GroupItem;
+};
+declare const GroupItem: FC<ItemProps>;
+interface ItemProps {
+    /**
+     * Content to display in the Group.Item.
+     */
+    children?: ReactNode;
+    /**
+     * Should the Group.Item be visible for debugging and documentation
+     * purposes?
+     */
+    isDebugVisible?: boolean;
+    /**
+     * Should the Group.Item stretch to fill the available space?
+     */
+    grow?: boolean;
+}
+interface GroupProps {
+    /**
+     * Contents of the Group. Should only contain `Group.Item`.
+     */
+    children: ReactNode;
+    /**
+     * Should all Group.Items in the Group stretch to fill the available space?
+     */
+    grow?: boolean;
+    /**
+     * Should all Group.Items in the Group stretch to fill the available space with equal widths?
+     */
+    growEqual?: boolean;
+    /**
+     * Should a border be shown between Group.Items? **Warning: Sets CSS property `overflow:hidden`.**
+     */
+    gutterBorder?: boolean;
+    /**
+     * Should wrapping of Group.Items in the Group be disabled?
+     */
+    noWrap?: boolean;
+}
+export { Group };

package/dist/Group/{index.js → Group.esm.js}

@@ -1,7 +1,7 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/index-e3c83626.js';
-import { c as classNames } from '../_shared/index-56d9df62.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React, { useContext, useEffect } from 'react';
-import { C as Context } from '../_shared/Surface-3fe44a2a.js';
+import { C as Context } from '../_shared/esm/Surface-d515d212.js';
 
 /**
  * Use `Group` to arrange flexible items in a row.

package/dist/Group/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/group",
+  "types": "./Group.esm.d.ts",
+  "main": "./Group.cjs.js",
+  "module": "./Group.esm.js",
+  "private": true
+}

package/dist/Heading/Heading.cjs.d.ts

@@ -0,0 +1 @@
+export { Heading } from "../_shared/cjs/Heading-cc38c3ec";

package/dist/Heading/Heading.cjs.js

@@ -0,0 +1,14 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Heading = require('../_shared/cjs/Heading-cc38c3ec.js');
+require('../_shared/cjs/index-78b35bc1.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/Surface-d6b8010e.js');
+
+
+
+exports.Heading = Heading.Heading;

package/dist/Heading/Heading.esm.d.ts

@@ -0,0 +1 @@
+export { Heading } from "../_shared/esm/Heading-183be76c";

package/dist/Heading/Heading.esm.js

@@ -0,0 +1,6 @@
+export { H as Heading } from '../_shared/esm/Heading-183be76c.js';
+import '../_shared/esm/index-229fc864.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/Surface-d515d212.js';

package/dist/Heading/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/heading",
+  "types": "./Heading.esm.d.ts",
+  "main": "./Heading.cjs.js",
+  "module": "./Heading.esm.js",
+  "private": true
+}

package/dist/Icon/Icon.cjs.d.ts

@@ -0,0 +1 @@
+export { Icon } from "../_shared/cjs/Icon-bb5a5fd1";

package/dist/Icon/Icon.cjs.js

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Icon = require('../_shared/cjs/Icon-bb5a5fd1.js');
+require('../_shared/cjs/index-78b35bc1.js');
+require('../_shared/cjs/index.es-f590caaf.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+require('../_shared/cjs/Surface-d6b8010e.js');
+
+
+
+exports.Icon = Icon.Icon;

package/dist/Icon/Icon.esm.d.ts

@@ -0,0 +1 @@
+export { Icon } from "../_shared/esm/Icon-2fd92daa";

package/dist/Icon/Icon.esm.js

@@ -0,0 +1,7 @@
+export { I as Icon } from '../_shared/esm/Icon-2fd92daa.js';
+import '../_shared/esm/index-229fc864.js';
+import '../_shared/esm/index.es-42f84e2d.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/suffix-modifier-f5e28822.js';
+import '../_shared/esm/Surface-d515d212.js';

package/dist/Icon/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/icon",
+  "types": "./Icon.esm.d.ts",
+  "main": "./Icon.cjs.js",
+  "module": "./Icon.esm.js",
+  "private": true
+}

package/dist/Image/Image.cjs.d.ts

@@ -0,0 +1 @@
+export { Image } from "../_shared/cjs/Image-fe760a06";

package/dist/Image/Image.cjs.js

@@ -0,0 +1,13 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var Image = require('../_shared/cjs/Image-fe760a06.js');
+require('../_shared/cjs/index-78b35bc1.js');
+require('../_shared/cjs/index-45bfb67b.js');
+require('react');
+require('../_shared/cjs/suffix-modifier-edf7851e.js');
+
+
+
+exports.Image = Image.Image;

package/dist/Image/Image.esm.d.ts

@@ -0,0 +1 @@
+export { Image } from "../_shared/esm/Image-7e4948f6";

package/dist/Image/Image.esm.js

@@ -0,0 +1,5 @@
+export { I as Image } from '../_shared/esm/Image-7e4948f6.js';
+import '../_shared/esm/index-229fc864.js';
+import '../_shared/esm/index-2ae58626.js';
+import 'react';
+import '../_shared/esm/suffix-modifier-f5e28822.js';

package/dist/Image/package.json

@@ -0,0 +1,7 @@
+{
+  "name": "@arc-ui/image",
+  "types": "./Image.esm.d.ts",
+  "main": "./Image.cjs.js",
+  "module": "./Image.esm.js",
+  "private": true
+}

package/dist/Markup/Markup.cjs.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var index = require('../_shared/cjs/index-78b35bc1.js');
+var index$1 = require('../_shared/cjs/index-45bfb67b.js');
+var React = require('react');
+var Surface = require('../_shared/cjs/Surface-d6b8010e.js');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
+
+/**
+ * Use `Markup` to display HTML-formatted text.
+ */
+var Markup = function (_a) {
+    var children = _a.children, _b = _a.isMeasured, isMeasured = _b === void 0 ? false : _b, props = index.__rest(_a, ["children", "isMeasured"]);
+    var surface = React.useContext(Surface.Context).surface;
+    return (React__default["default"].createElement("div", index.__assign({ className: index$1.classNames({
+            "arc-Markup": true,
+            "arc-Markup--measured": isMeasured,
+            "arc-Markup--onDarkSurface": surface === "dark"
+        }) }, index.filterDataAttrs(props)), children));
+};
+
+exports.Markup = Markup;

package/dist/Markup/Markup.esm.d.ts

@@ -0,0 +1,16 @@
+import { FC, ReactNode } from "react";
+/**
+ * Use `Markup` to display HTML-formatted text.
+ */
+declare const Markup: FC<MarkupProps>;
+interface MarkupProps {
+    /**
+     * HTML-formatted text to display in Markup.
+     */
+    children: ReactNode;
+    /**
+     * Should the Markup width be constrained to a typographic measure?
+     */
+    isMeasured?: boolean;
+}
+export { Markup };

package/dist/Markup/{index.js → Markup.esm.js}

@@ -1,7 +1,7 @@
-import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/index-e3c83626.js';
-import { c as classNames } from '../_shared/index-56d9df62.js';
+import { _ as __rest, a as __assign, f as filterDataAttrs } from '../_shared/esm/index-229fc864.js';
+import { c as classNames } from '../_shared/esm/index-2ae58626.js';
 import React, { useContext } from 'react';
-import { C as Context } from '../_shared/Surface-3fe44a2a.js';
+import { C as Context } from '../_shared/esm/Surface-d515d212.js';
 
 /**
  * Use `Markup` to display HTML-formatted text.