@usefragments/ui 1.1.1 → 1.2.0

package/dist/components/DataTable/DataTable.module.scss.js

@@ -1,37 +1,38 @@
-const wrapper = "_wrapper_pscwk_1";
-const table = "_table_pscwk_8";
-const caption = "_caption_pscwk_16";
-const captionHidden = "_captionHidden_pscwk_25";
-const sm = "_sm_pscwk_37";
-const th = "_th_pscwk_37";
-const td = "_td_pscwk_38";
-const md = "_md_pscwk_43";
-const thead = "_thead_pscwk_49";
-const headerRow = "_headerRow_pscwk_55";
-const headerContent = "_headerContent_pscwk_75";
-const thSortable = "_thSortable_pscwk_81";
-const sortButton = "_sortButton_pscwk_85";
-const sortIndicator = "_sortIndicator_pscwk_124";
-const row = "_row_pscwk_151";
-const clickable = "_clickable_pscwk_162";
-const selected = "_selected_pscwk_176";
-const striped = "_striped_pscwk_190";
-const bordered = "_bordered_pscwk_206";
-const fixedLayout = "_fixedLayout_pscwk_213";
-const densityCondensed = "_densityCondensed_pscwk_217";
-const densityRegular = "_densityRegular_pscwk_221";
-const densityRelaxed = "_densityRelaxed_pscwk_225";
-const truncate = "_truncate_pscwk_249";
-const skeletonBar = "_skeletonBar_pscwk_255";
-const dataTableShimmer = "_dataTableShimmer_pscwk_1";
-const checkboxCell = "_checkboxCell_pscwk_280";
-const expandCell = "_expandCell_pscwk_286";
-const expandButton = "_expandButton_pscwk_292";
-const expandIcon = "_expandIcon_pscwk_325";
-const expandIconOpen = "_expandIconOpen_pscwk_331";
-const subRow = "_subRow_pscwk_335";
-const emptyState = "_emptyState_pscwk_342";
-const emptyMessage = "_emptyMessage_pscwk_349";
+const wrapper = "_wrapper_1nxxb_1";
+const table = "_table_1nxxb_11";
+const caption = "_caption_1nxxb_19";
+const captionHidden = "_captionHidden_1nxxb_28";
+const sm = "_sm_1nxxb_40";
+const th = "_th_1nxxb_40";
+const td = "_td_1nxxb_41";
+const md = "_md_1nxxb_46";
+const thead = "_thead_1nxxb_52";
+const headerRow = "_headerRow_1nxxb_58";
+const headerContent = "_headerContent_1nxxb_78";
+const thSortable = "_thSortable_1nxxb_84";
+const sortButton = "_sortButton_1nxxb_88";
+const sortIndicator = "_sortIndicator_1nxxb_127";
+const tbody = "_tbody_1nxxb_154";
+const row = "_row_1nxxb_159";
+const clickable = "_clickable_1nxxb_170";
+const selected = "_selected_1nxxb_184";
+const striped = "_striped_1nxxb_198";
+const bordered = "_bordered_1nxxb_214";
+const fixedLayout = "_fixedLayout_1nxxb_221";
+const densityCondensed = "_densityCondensed_1nxxb_225";
+const densityRegular = "_densityRegular_1nxxb_229";
+const densityRelaxed = "_densityRelaxed_1nxxb_233";
+const truncate = "_truncate_1nxxb_257";
+const skeletonBar = "_skeletonBar_1nxxb_263";
+const dataTableShimmer = "_dataTableShimmer_1nxxb_1";
+const checkboxCell = "_checkboxCell_1nxxb_288";
+const expandCell = "_expandCell_1nxxb_294";
+const expandButton = "_expandButton_1nxxb_300";
+const expandIcon = "_expandIcon_1nxxb_333";
+const expandIconOpen = "_expandIconOpen_1nxxb_339";
+const subRow = "_subRow_1nxxb_343";
+const emptyState = "_emptyState_1nxxb_350";
+const emptyMessage = "_emptyMessage_1nxxb_357";
 const styles = {
   wrapper,
   table,
@@ -47,6 +48,7 @@ const styles = {
   thSortable,
   sortButton,
   sortIndicator,
+  tbody,
   row,
   clickable,
   selected,
@@ -98,6 +100,7 @@ export {
   striped,
   subRow,
   table,
+  tbody,
   td,
   th,
   thSortable,

package/dist/components/Main/Main.module.scss.cjs

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const root = "_root_1wv9j_1";
+const full = "_full_1wv9j_10";
+const narrow = "_narrow_1wv9j_14";
+const header = "_header_1wv9j_18";
+const description = "_description_1wv9j_19";
+const content = "_content_1wv9j_20";
+const footer = "_footer_1wv9j_21";
+const styles = {
+  root,
+  full,
+  narrow,
+  header,
+  description,
+  content,
+  footer
+};
+exports.content = content;
+exports.default = styles;
+exports.description = description;
+exports.footer = footer;
+exports.full = full;
+exports.header = header;
+exports.narrow = narrow;
+exports.root = root;

package/dist/components/Main/Main.module.scss.js

@@ -0,0 +1,26 @@
+const root = "_root_1wv9j_1";
+const full = "_full_1wv9j_10";
+const narrow = "_narrow_1wv9j_14";
+const header = "_header_1wv9j_18";
+const description = "_description_1wv9j_19";
+const content = "_content_1wv9j_20";
+const footer = "_footer_1wv9j_21";
+const styles = {
+  root,
+  full,
+  narrow,
+  header,
+  description,
+  content,
+  footer
+};
+export {
+  content,
+  styles as default,
+  description,
+  footer,
+  full,
+  header,
+  narrow,
+  root
+};

package/dist/components/Main/index.cjs

@@ -0,0 +1,128 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const index = require("../Stack/index.cjs");
+const Main_module = require("./Main.module.scss.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+function joinClasses(...classes) {
+  return classes.filter(Boolean).join(" ");
+}
+const MainRoot = React__namespace.forwardRef(function MainRoot2({ as = "main", children, className, measure = "full", ...htmlProps }, ref) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.Stack,
+    {
+      ...htmlProps,
+      ref,
+      as,
+      direction: "column",
+      gap: "lg",
+      className: joinClasses(
+        Main_module.default.root,
+        measure === "narrow" ? Main_module.default.narrow : Main_module.default.full,
+        className
+      ),
+      "data-main-measure": measure,
+      children
+    }
+  );
+});
+function MainHeader({
+  as = "header",
+  direction = "column",
+  gap = "sm",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(Main_module.default.header, className)
+    }
+  );
+}
+function MainDescription({
+  as = "div",
+  direction = "column",
+  gap = "xs",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(Main_module.default.description, className)
+    }
+  );
+}
+function MainContent({
+  as = "div",
+  direction = "column",
+  gap = "lg",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(Main_module.default.content, className)
+    }
+  );
+}
+function MainFooter({
+  as = "footer",
+  direction = "row",
+  gap = "sm",
+  justify = "end",
+  wrap = true,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    index.Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      justify,
+      wrap,
+      className: joinClasses(Main_module.default.footer, className)
+    }
+  );
+}
+const Main = Object.assign(MainRoot, {
+  Header: MainHeader,
+  Description: MainDescription,
+  Content: MainContent,
+  Footer: MainFooter
+});
+exports.Main = Main;

package/dist/components/Main/index.d.ts

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { type StackProps } from "../Stack";
+export type MainMeasure = "full" | "narrow";
+export interface MainProps extends Omit<StackProps, "as" | "children" | "direction" | "gap"> {
+    as?: StackProps["as"];
+    children: React.ReactNode;
+    /** Maximum readable width for the page content. */
+    measure?: MainMeasure;
+}
+export type MainRegionProps = StackProps;
+declare function MainHeader({ as, direction, gap, className, ...props }: MainRegionProps): import("react/jsx-runtime").JSX.Element;
+declare function MainDescription({ as, direction, gap, className, ...props }: MainRegionProps): import("react/jsx-runtime").JSX.Element;
+declare function MainContent({ as, direction, gap, className, ...props }: MainRegionProps): import("react/jsx-runtime").JSX.Element;
+declare function MainFooter({ as, direction, gap, justify, wrap, className, ...props }: MainRegionProps): import("react/jsx-runtime").JSX.Element;
+export declare const Main: React.ForwardRefExoticComponent<MainProps & React.RefAttributes<HTMLElement>> & {
+    Header: typeof MainHeader;
+    Description: typeof MainDescription;
+    Content: typeof MainContent;
+    Footer: typeof MainFooter;
+};
+export {};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Main/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Main/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,UAAU,CAAC;AAGlD,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAC;AAE5C,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,UAAU,EAAE,IAAI,GAAG,UAAU,GAAG,WAAW,GAAG,KAAK,CAAC;IAC1F,EAAE,CAAC,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;IACtB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,mDAAmD;IACnD,OAAO,CAAC,EAAE,WAAW,CAAC;CACvB;AAED,MAAM,MAAM,eAAe,GAAG,UAAU,CAAC;AA6BzC,iBAAS,UAAU,CAAC,EAClB,EAAa,EACb,SAAoB,EACpB,GAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,2CAUjB;AAED,iBAAS,eAAe,CAAC,EACvB,EAAU,EACV,SAAoB,EACpB,GAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,2CAUjB;AAED,iBAAS,WAAW,CAAC,EACnB,EAAU,EACV,SAAoB,EACpB,GAAU,EACV,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,2CAUjB;AAED,iBAAS,UAAU,CAAC,EAClB,EAAa,EACb,SAAiB,EACjB,GAAU,EACV,OAAe,EACf,IAAW,EACX,SAAS,EACT,GAAG,KAAK,EACT,EAAE,eAAe,2CAYjB;AAED,eAAO,MAAM,IAAI;;;;;CAKf,CAAC"}

package/dist/components/Main/index.js

@@ -0,0 +1,111 @@
+import { jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Stack } from "../Stack/index.js";
+import styles from "./Main.module.scss.js";
+function joinClasses(...classes) {
+  return classes.filter(Boolean).join(" ");
+}
+const MainRoot = React.forwardRef(function MainRoot2({ as = "main", children, className, measure = "full", ...htmlProps }, ref) {
+  return /* @__PURE__ */ jsx(
+    Stack,
+    {
+      ...htmlProps,
+      ref,
+      as,
+      direction: "column",
+      gap: "lg",
+      className: joinClasses(
+        styles.root,
+        measure === "narrow" ? styles.narrow : styles.full,
+        className
+      ),
+      "data-main-measure": measure,
+      children
+    }
+  );
+});
+function MainHeader({
+  as = "header",
+  direction = "column",
+  gap = "sm",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(styles.header, className)
+    }
+  );
+}
+function MainDescription({
+  as = "div",
+  direction = "column",
+  gap = "xs",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(styles.description, className)
+    }
+  );
+}
+function MainContent({
+  as = "div",
+  direction = "column",
+  gap = "lg",
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      className: joinClasses(styles.content, className)
+    }
+  );
+}
+function MainFooter({
+  as = "footer",
+  direction = "row",
+  gap = "sm",
+  justify = "end",
+  wrap = true,
+  className,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    Stack,
+    {
+      ...props,
+      as,
+      direction,
+      gap,
+      justify,
+      wrap,
+      className: joinClasses(styles.footer, className)
+    }
+  );
+}
+const Main = Object.assign(MainRoot, {
+  Header: MainHeader,
+  Description: MainDescription,
+  Content: MainContent,
+  Footer: MainFooter
+});
+export {
+  Main
+};

package/dist/components/Table/Table.module.scss.cjs

@@ -1,23 +1,23 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const wrapper = "_wrapper_kwz0l_1";
-const table = "_table_kwz0l_6";
-const caption = "_caption_kwz0l_14";
-const captionHidden = "_captionHidden_kwz0l_23";
-const sm = "_sm_kwz0l_35";
-const th = "_th_kwz0l_35";
-const td = "_td_kwz0l_36";
-const md = "_md_kwz0l_41";
-const compact = "_compact_kwz0l_47";
-const tabular = "_tabular_kwz0l_62";
-const thead = "_thead_kwz0l_66";
-const headerContent = "_headerContent_kwz0l_89";
-const row = "_row_kwz0l_95";
-const selected = "_selected_kwz0l_109";
-const tfoot = "_tfoot_kwz0l_123";
-const striped = "_striped_kwz0l_131";
-const tbody = "_tbody_kwz0l_131";
-const bordered = "_bordered_kwz0l_139";
+const wrapper = "_wrapper_1talf_1";
+const table = "_table_1talf_6";
+const caption = "_caption_1talf_14";
+const captionHidden = "_captionHidden_1talf_23";
+const sm = "_sm_1talf_35";
+const th = "_th_1talf_35";
+const td = "_td_1talf_36";
+const md = "_md_1talf_41";
+const compact = "_compact_1talf_47";
+const tabular = "_tabular_1talf_62";
+const thead = "_thead_1talf_66";
+const headerContent = "_headerContent_1talf_89";
+const tbody = "_tbody_1talf_95";
+const row = "_row_1talf_100";
+const selected = "_selected_1talf_117";
+const tfoot = "_tfoot_1talf_137";
+const striped = "_striped_1talf_145";
+const bordered = "_bordered_1talf_153";
 const styles = {
   wrapper,
   table,
@@ -31,11 +31,11 @@ const styles = {
   tabular,
   thead,
   headerContent,
+  tbody,
   row,
   selected,
   tfoot,
   striped,
-  tbody,
   bordered
 };
 exports.bordered = bordered;

package/dist/components/Table/Table.module.scss.js

@@ -1,21 +1,21 @@
-const wrapper = "_wrapper_kwz0l_1";
-const table = "_table_kwz0l_6";
-const caption = "_caption_kwz0l_14";
-const captionHidden = "_captionHidden_kwz0l_23";
-const sm = "_sm_kwz0l_35";
-const th = "_th_kwz0l_35";
-const td = "_td_kwz0l_36";
-const md = "_md_kwz0l_41";
-const compact = "_compact_kwz0l_47";
-const tabular = "_tabular_kwz0l_62";
-const thead = "_thead_kwz0l_66";
-const headerContent = "_headerContent_kwz0l_89";
-const row = "_row_kwz0l_95";
-const selected = "_selected_kwz0l_109";
-const tfoot = "_tfoot_kwz0l_123";
-const striped = "_striped_kwz0l_131";
-const tbody = "_tbody_kwz0l_131";
-const bordered = "_bordered_kwz0l_139";
+const wrapper = "_wrapper_1talf_1";
+const table = "_table_1talf_6";
+const caption = "_caption_1talf_14";
+const captionHidden = "_captionHidden_1talf_23";
+const sm = "_sm_1talf_35";
+const th = "_th_1talf_35";
+const td = "_td_1talf_36";
+const md = "_md_1talf_41";
+const compact = "_compact_1talf_47";
+const tabular = "_tabular_1talf_62";
+const thead = "_thead_1talf_66";
+const headerContent = "_headerContent_1talf_89";
+const tbody = "_tbody_1talf_95";
+const row = "_row_1talf_100";
+const selected = "_selected_1talf_117";
+const tfoot = "_tfoot_1talf_137";
+const striped = "_striped_1talf_145";
+const bordered = "_bordered_1talf_153";
 const styles = {
   wrapper,
   table,
@@ -29,11 +29,11 @@ const styles = {
   tabular,
   thead,
   headerContent,
+  tbody,
   row,
   selected,
   tfoot,
   striped,
-  tbody,
   bordered
 };
 export {

package/dist/components/TableOfContents/TableOfContents.module.scss.cjs

@@ -1,20 +1,20 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const root = "_root_jqtij_1";
-const title = "_title_jqtij_13";
-const list = "_list_jqtij_18";
-const item = "_item_jqtij_29";
-const groupHeaderRow = "_groupHeaderRow_jqtij_30";
-const link = "_link_jqtij_123";
-const linkLabel = "_linkLabel_jqtij_150";
-const leading = "_leading_jqtij_158";
-const trailing = "_trailing_jqtij_159";
-const active = "_active_jqtij_171";
-const groupHeader = "_groupHeader_jqtij_30";
-const groupHeaderInteractive = "_groupHeaderInteractive_jqtij_196";
-const groupHeaderActive = "_groupHeaderActive_jqtij_209";
-const groupChevron = "_groupChevron_jqtij_213";
-const groupLabel = "_groupLabel_jqtij_231";
+const root = "_root_1bf9l_1";
+const title = "_title_1bf9l_13";
+const list = "_list_1bf9l_18";
+const item = "_item_1bf9l_28";
+const groupHeaderRow = "_groupHeaderRow_1bf9l_29";
+const link = "_link_1bf9l_122";
+const linkLabel = "_linkLabel_1bf9l_149";
+const leading = "_leading_1bf9l_157";
+const trailing = "_trailing_1bf9l_158";
+const active = "_active_1bf9l_170";
+const groupHeader = "_groupHeader_1bf9l_29";
+const groupHeaderInteractive = "_groupHeaderInteractive_1bf9l_195";
+const groupHeaderActive = "_groupHeaderActive_1bf9l_208";
+const groupChevron = "_groupChevron_1bf9l_212";
+const groupLabel = "_groupLabel_1bf9l_230";
 const styles = {
   root,
   title,

package/dist/components/TableOfContents/TableOfContents.module.scss.js

@@ -1,18 +1,18 @@
-const root = "_root_jqtij_1";
-const title = "_title_jqtij_13";
-const list = "_list_jqtij_18";
-const item = "_item_jqtij_29";
-const groupHeaderRow = "_groupHeaderRow_jqtij_30";
-const link = "_link_jqtij_123";
-const linkLabel = "_linkLabel_jqtij_150";
-const leading = "_leading_jqtij_158";
-const trailing = "_trailing_jqtij_159";
-const active = "_active_jqtij_171";
-const groupHeader = "_groupHeader_jqtij_30";
-const groupHeaderInteractive = "_groupHeaderInteractive_jqtij_196";
-const groupHeaderActive = "_groupHeaderActive_jqtij_209";
-const groupChevron = "_groupChevron_jqtij_213";
-const groupLabel = "_groupLabel_jqtij_231";
+const root = "_root_1bf9l_1";
+const title = "_title_1bf9l_13";
+const list = "_list_1bf9l_18";
+const item = "_item_1bf9l_28";
+const groupHeaderRow = "_groupHeaderRow_1bf9l_29";
+const link = "_link_1bf9l_122";
+const linkLabel = "_linkLabel_1bf9l_149";
+const leading = "_leading_1bf9l_157";
+const trailing = "_trailing_1bf9l_158";
+const active = "_active_1bf9l_170";
+const groupHeader = "_groupHeader_1bf9l_29";
+const groupHeaderInteractive = "_groupHeaderInteractive_1bf9l_195";
+const groupHeaderActive = "_groupHeaderActive_1bf9l_208";
+const groupChevron = "_groupChevron_1bf9l_212";
+const groupLabel = "_groupLabel_1bf9l_230";
 const styles = {
   root,
   title,