@gobolt/genesis 0.3.11 → 0.3.12

package/dist/components/Button/icon-button-styles.cjs

@@ -1,76 +0,0 @@
-"use strict";
-var styled = require("styled-components");
-const getPadding = (size, sizing) => {
-  if (size === "small") {
-    return `${sizing.Size1}px ${sizing.Size1}px`;
-  }
-  return `${sizing.Size2}px ${sizing.Size2}px`;
-};
-const getVariant = ({ colors, sizing, borderRadius, components }, $themeType, $state, size, $isSelected) => {
-  return `
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      text-align: center;
-      color: ${colors[$themeType][$state].color};
-      font-size: ${sizing.Size4}px;
-      line-height: ${sizing.Size6}px;
-      letter-spacing: 0;
-      font-weight: 400;
-      border-width: 1px;
-      cursor: pointer;
-      width: auto; !important;
-      height: auto; !important;
-
-      background-color:${$isSelected ? colors[$themeType].hover.backgroundColor : colors[$themeType][$state].backgroundColor};
-      padding: ${getPadding(size, sizing)};
-
-      box-shadow: ${$themeType === "utility" ? "0px 1px 2px 0px #00000026" : "none"};
-
-      border-radius: ${borderRadius.BorderRadiusMd}px;
-      gap: ${components.button.gap}px;
-      border-style: solid;
-      border-color: ${colors[$themeType][$state].borderColor};
-      
-      transition: all 0.2s ease-in-out;
-
-      &:hover {
-        color: ${colors[$themeType].hover.color};
-        background-color: ${colors[$themeType].hover.backgroundColor};
-        border-color: ${colors[$themeType].hover.borderColor};
-      }
-
-      &:active {
-        color: ${colors[$themeType].pressed.color};
-        background-color: ${colors[$themeType].pressed.backgroundColor};
-        border-color: ${colors[$themeType].pressed.borderColor};
-      }
-
-      &:focus-visible {
-        outline: none;
-        color: ${colors[$themeType].focussed.color};
-        background-color: ${colors[$themeType].focussed.backgroundColor};
-        box-shadow: 0 0 0 1px #fff, 0 0 0 4px ${colors[$themeType].focussed.ringColor};
-        border-radius: ${borderRadius.BorderRadiusMd}px;
-        border-color: ${colors[$themeType].focussed.borderColor};
-        transition: box-shadow 0.2s ease-in-out;
-      }
-
-      &:disabled {
-        color: ${colors[$themeType].disabled.color};
-        background-color: ${colors[$themeType].disabled.backgroundColor};
-        border-color: ${colors[$themeType].disabled.borderColor};
-        cursor: not-allowed;
-      }
-    `;
-};
-const getGenesisButtonClass = (theme, $themeType, $state, size, $isSelected) => `
-    font-family: 'Inter', sans-serif;
-    ${getVariant(theme, $themeType, $state, size, $isSelected)}
-`;
-const Button = styled.button`
-  ${({ theme, $themeType, $state, size, $isSelected }) => {
-  return getGenesisButtonClass(theme, $themeType, $state, size, $isSelected);
-}}
-`;
-exports.Button = Button;

package/dist/components/Button/icon-button-styles.js

@@ -1,77 +0,0 @@
-import styled from "styled-components";
-const getPadding = (size, sizing) => {
-  if (size === "small") {
-    return `${sizing.Size1}px ${sizing.Size1}px`;
-  }
-  return `${sizing.Size2}px ${sizing.Size2}px`;
-};
-const getVariant = ({ colors, sizing, borderRadius, components }, $themeType, $state, size, $isSelected) => {
-  return `
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      text-align: center;
-      color: ${colors[$themeType][$state].color};
-      font-size: ${sizing.Size4}px;
-      line-height: ${sizing.Size6}px;
-      letter-spacing: 0;
-      font-weight: 400;
-      border-width: 1px;
-      cursor: pointer;
-      width: auto; !important;
-      height: auto; !important;
-
-      background-color:${$isSelected ? colors[$themeType].hover.backgroundColor : colors[$themeType][$state].backgroundColor};
-      padding: ${getPadding(size, sizing)};
-
-      box-shadow: ${$themeType === "utility" ? "0px 1px 2px 0px #00000026" : "none"};
-
-      border-radius: ${borderRadius.BorderRadiusMd}px;
-      gap: ${components.button.gap}px;
-      border-style: solid;
-      border-color: ${colors[$themeType][$state].borderColor};
-      
-      transition: all 0.2s ease-in-out;
-
-      &:hover {
-        color: ${colors[$themeType].hover.color};
-        background-color: ${colors[$themeType].hover.backgroundColor};
-        border-color: ${colors[$themeType].hover.borderColor};
-      }
-
-      &:active {
-        color: ${colors[$themeType].pressed.color};
-        background-color: ${colors[$themeType].pressed.backgroundColor};
-        border-color: ${colors[$themeType].pressed.borderColor};
-      }
-
-      &:focus-visible {
-        outline: none;
-        color: ${colors[$themeType].focussed.color};
-        background-color: ${colors[$themeType].focussed.backgroundColor};
-        box-shadow: 0 0 0 1px #fff, 0 0 0 4px ${colors[$themeType].focussed.ringColor};
-        border-radius: ${borderRadius.BorderRadiusMd}px;
-        border-color: ${colors[$themeType].focussed.borderColor};
-        transition: box-shadow 0.2s ease-in-out;
-      }
-
-      &:disabled {
-        color: ${colors[$themeType].disabled.color};
-        background-color: ${colors[$themeType].disabled.backgroundColor};
-        border-color: ${colors[$themeType].disabled.borderColor};
-        cursor: not-allowed;
-      }
-    `;
-};
-const getGenesisButtonClass = (theme, $themeType, $state, size, $isSelected) => `
-    font-family: 'Inter', sans-serif;
-    ${getVariant(theme, $themeType, $state, size, $isSelected)}
-`;
-const Button = styled.button`
-  ${({ theme, $themeType, $state, size, $isSelected }) => {
-  return getGenesisButtonClass(theme, $themeType, $state, size, $isSelected);
-}}
-`;
-export {
-  Button
-};

package/dist/components/Table/TableControls/PrimaryTableControlsRow.cjs

@@ -1,162 +0,0 @@
-"use strict";
-var jsxRuntime = require("react/jsx-runtime");
-var UtilityButton = require("../../Button/UtilityButton.cjs");
-var IconButton = require("../../Button/IconButton.cjs");
-var index$1 = require("../../../node_modules/react-icons/hi2/index.cjs");
-var index = require("../../../node_modules/react-icons/hi/index.cjs");
-var index$2 = require("../../../node_modules/react-icons/fi/index.cjs");
-var Input = require("../../Input/Input.cjs");
-var Typography = require("../../Typography/Typography.cjs");
-var Select = require("../../Select/Select.cjs");
-const PrimaryTableControlsRow = ({
-  sortOptions,
-  searchByPlaceholder = "",
-  searchField = "address",
-  isSortedAscending = true,
-  searchValue = "",
-  selectedSortOption = "",
-  onChange
-}) => {
-  const onInputChange = (actionEvent) => {
-    onChange?.({
-      event: "inputChange",
-      payload: actionEvent.payload
-    });
-  };
-  const onSortChange = (value) => {
-    const sortActionEvent = {
-      event: "primarySortChange",
-      payload: { value }
-    };
-    onChange?.(sortActionEvent);
-  };
-  const onFilterClick = () => {
-    const filterActionEvent = {
-      event: "filterClick",
-      payload: {}
-    };
-    onChange?.(filterActionEvent);
-  };
-  const onSettingsClick = () => {
-    const settingsActionEvent = {
-      event: "settingsClick",
-      payload: {}
-    };
-    onChange?.(settingsActionEvent);
-  };
-  const onOrderClick = () => {
-    const ascendingActionEvent = {
-      event: "orderClick",
-      payload: {
-        value: isSortedAscending ? "desc" : "asc"
-      }
-    };
-    onChange?.(ascendingActionEvent);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      style: {
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "center",
-        width: "100%",
-        minWidth: 800,
-        marginBottom: 16
-      },
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex" }, children: [
-          /* @__PURE__ */ jsxRuntime.jsx(
-            Input,
-            {
-              size: "normal",
-              placeholder: searchByPlaceholder,
-              prefix: /* @__PURE__ */ jsxRuntime.jsx(index.HiSearch, {}),
-              style: {
-                padding: "5px 8px"
-              },
-              value: searchValue,
-              onChange: onInputChange
-            }
-          ),
-          onFilterClick && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginLeft: 16 }, children: /* @__PURE__ */ jsxRuntime.jsx(
-            UtilityButton,
-            {
-              isIconButton: true,
-              icon: /* @__PURE__ */ jsxRuntime.jsx(index$1.HiMiniAdjustmentsVertical, { color: "#222222" }),
-              onClick: onFilterClick
-            }
-          ) }),
-          onSettingsClick && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginLeft: 16 }, children: /* @__PURE__ */ jsxRuntime.jsx(
-            UtilityButton,
-            {
-              isIconButton: true,
-              icon: /* @__PURE__ */ jsxRuntime.jsx(index$2.FiSettings, { color: "#222222" }),
-              onClick: onSettingsClick
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ jsxRuntime.jsxs(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "center",
-              width: 300,
-              justifyContent: "flex-end",
-              marginLeft: "auto"
-            },
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsx(
-                Typography,
-                {
-                  variant: "body1",
-                  color: "#6C6C6C",
-                  style: {
-                    width: 70,
-                    flexShrink: 0,
-                    textAlign: "right",
-                    paddingRight: 4,
-                    marginRight: 8
-                  },
-                  children: "Sort by"
-                }
-              ),
-              sortOptions && onSortChange ? /* @__PURE__ */ jsxRuntime.jsx(
-                Select,
-                {
-                  options: sortOptions,
-                  defaultValue: sortOptions[0].value,
-                  value: selectedSortOption,
-                  variant: "simple",
-                  onChange: onSortChange,
-                  style: {
-                    width: 180,
-                    flexShrink: 0
-                  }
-                }
-              ) : null,
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  style: {
-                    marginLeft: 8,
-                    flexShrink: 0
-                  },
-                  children: /* @__PURE__ */ jsxRuntime.jsx(
-                    IconButton,
-                    {
-                      icon: isSortedAscending ? /* @__PURE__ */ jsxRuntime.jsx(index.HiOutlineSortDescending, { size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(index.HiOutlineSortAscending, { size: 20 }),
-                      onClick: onOrderClick
-                    }
-                  )
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-module.exports = PrimaryTableControlsRow;

package/dist/components/Table/TableControls/PrimaryTableControlsRow.js

@@ -1,163 +0,0 @@
-import { jsxs, jsx } from "react/jsx-runtime";
-import UtilityButton from "../../Button/UtilityButton.js";
-import IconButton from "../../Button/IconButton.js";
-import { HiMiniAdjustmentsVertical } from "../../../node_modules/react-icons/hi2/index.js";
-import { HiSearch, HiOutlineSortDescending, HiOutlineSortAscending } from "../../../node_modules/react-icons/hi/index.js";
-import { FiSettings } from "../../../node_modules/react-icons/fi/index.js";
-import Input from "../../Input/Input.js";
-import Typography from "../../Typography/Typography.js";
-import Select from "../../Select/Select.js";
-const PrimaryTableControlsRow = ({
-  sortOptions,
-  searchByPlaceholder = "",
-  searchField = "address",
-  isSortedAscending = true,
-  searchValue = "",
-  selectedSortOption = "",
-  onChange
-}) => {
-  const onInputChange = (actionEvent) => {
-    onChange?.({
-      event: "inputChange",
-      payload: actionEvent.payload
-    });
-  };
-  const onSortChange = (value) => {
-    const sortActionEvent = {
-      event: "primarySortChange",
-      payload: { value }
-    };
-    onChange?.(sortActionEvent);
-  };
-  const onFilterClick = () => {
-    const filterActionEvent = {
-      event: "filterClick",
-      payload: {}
-    };
-    onChange?.(filterActionEvent);
-  };
-  const onSettingsClick = () => {
-    const settingsActionEvent = {
-      event: "settingsClick",
-      payload: {}
-    };
-    onChange?.(settingsActionEvent);
-  };
-  const onOrderClick = () => {
-    const ascendingActionEvent = {
-      event: "orderClick",
-      payload: {
-        value: isSortedAscending ? "desc" : "asc"
-      }
-    };
-    onChange?.(ascendingActionEvent);
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      style: {
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "center",
-        width: "100%",
-        minWidth: 800,
-        marginBottom: 16
-      },
-      children: [
-        /* @__PURE__ */ jsxs("div", { style: { display: "flex" }, children: [
-          /* @__PURE__ */ jsx(
-            Input,
-            {
-              size: "normal",
-              placeholder: searchByPlaceholder,
-              prefix: /* @__PURE__ */ jsx(HiSearch, {}),
-              style: {
-                padding: "5px 8px"
-              },
-              value: searchValue,
-              onChange: onInputChange
-            }
-          ),
-          onFilterClick && /* @__PURE__ */ jsx("div", { style: { marginLeft: 16 }, children: /* @__PURE__ */ jsx(
-            UtilityButton,
-            {
-              isIconButton: true,
-              icon: /* @__PURE__ */ jsx(HiMiniAdjustmentsVertical, { color: "#222222" }),
-              onClick: onFilterClick
-            }
-          ) }),
-          onSettingsClick && /* @__PURE__ */ jsx("div", { style: { marginLeft: 16 }, children: /* @__PURE__ */ jsx(
-            UtilityButton,
-            {
-              isIconButton: true,
-              icon: /* @__PURE__ */ jsx(FiSettings, { color: "#222222" }),
-              onClick: onSettingsClick
-            }
-          ) })
-        ] }),
-        /* @__PURE__ */ jsxs(
-          "div",
-          {
-            style: {
-              display: "flex",
-              alignItems: "center",
-              width: 300,
-              justifyContent: "flex-end",
-              marginLeft: "auto"
-            },
-            children: [
-              /* @__PURE__ */ jsx(
-                Typography,
-                {
-                  variant: "body1",
-                  color: "#6C6C6C",
-                  style: {
-                    width: 70,
-                    flexShrink: 0,
-                    textAlign: "right",
-                    paddingRight: 4,
-                    marginRight: 8
-                  },
-                  children: "Sort by"
-                }
-              ),
-              sortOptions && onSortChange ? /* @__PURE__ */ jsx(
-                Select,
-                {
-                  options: sortOptions,
-                  defaultValue: sortOptions[0].value,
-                  value: selectedSortOption,
-                  variant: "simple",
-                  onChange: onSortChange,
-                  style: {
-                    width: 180,
-                    flexShrink: 0
-                  }
-                }
-              ) : null,
-              /* @__PURE__ */ jsx(
-                "div",
-                {
-                  style: {
-                    marginLeft: 8,
-                    flexShrink: 0
-                  },
-                  children: /* @__PURE__ */ jsx(
-                    IconButton,
-                    {
-                      icon: isSortedAscending ? /* @__PURE__ */ jsx(HiOutlineSortDescending, { size: 20 }) : /* @__PURE__ */ jsx(HiOutlineSortAscending, { size: 20 }),
-                      onClick: onOrderClick
-                    }
-                  )
-                }
-              )
-            ]
-          }
-        )
-      ]
-    }
-  );
-};
-export {
-  PrimaryTableControlsRow as default
-};

package/dist/components/Table/TableControls/SecondaryTableControlsRow.cjs

@@ -1,80 +0,0 @@
-"use strict";
-var jsxRuntime = require("react/jsx-runtime");
-var iconUtil = require("../../../utils/icon-util.cjs");
-var Typography = require("../../Typography/Typography.cjs");
-var Tooltip = require("../../Tooltip/Tooltip.cjs");
-var Badge = require("../../Badge/Badge.cjs");
-const GroupItem = ({ title, items, onGroupItemClick }) => {
-  if (items.length === 0) return null;
-  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-    /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { tip: title, children: /* @__PURE__ */ jsxRuntime.jsx(
-      "div",
-      {
-        style: {
-          display: "flex",
-          justifyContent: "center",
-          alignItems: "center",
-          width: 24,
-          height: 24
-        },
-        children: iconUtil.getIcon(title)
-      }
-    ) }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 4 }, children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
-      Badge,
-      {
-        label: item,
-        hasClose: true,
-        state: "generic",
-        size: "small",
-        onClick: () => onGroupItemClick(title, item)
-      },
-      item.toString()
-    )) })
-  ] });
-};
-const GroupsRow = ({ groups, onGroupItemClick }) => {
-  if (!groups) return null;
-  const groupArray = Object.entries(groups).map(([title, items]) => ({
-    title,
-    items
-  }));
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: 4 }, children: groupArray.length > 0 ? groupArray.map((group) => /* @__PURE__ */ jsxRuntime.jsx(
-    GroupItem,
-    {
-      title: group.title,
-      items: group.items,
-      onGroupItemClick
-    },
-    group.title
-  )) : null });
-};
-const SecondaryTableControlsRow = ({
-  groups,
-  totalRecords,
-  onChange
-}) => {
-  const onGroupItemClick = (title, item) => {
-    const groupItemClickEvent = {
-      event: "groupItemClick",
-      payload: { title, item }
-    };
-    onChange?.(groupItemClickEvent);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    "div",
-    {
-      style: {
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "flex-end",
-        marginTop: 8
-      },
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx(GroupsRow, { groups, onGroupItemClick }),
-        totalRecords > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Typography, { variant: "body2", color: "#6C6C6C", children: `${totalRecords} results` }) : null
-      ]
-    }
-  );
-};
-module.exports = SecondaryTableControlsRow;

package/dist/components/Table/TableControls/SecondaryTableControlsRow.js

@@ -1,81 +0,0 @@
-import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { getIcon } from "../../../utils/icon-util.js";
-import Typography from "../../Typography/Typography.js";
-import Tooltip from "../../Tooltip/Tooltip.js";
-import Badge from "../../Badge/Badge.js";
-const GroupItem = ({ title, items, onGroupItemClick }) => {
-  if (items.length === 0) return null;
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(Tooltip, { tip: title, children: /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          display: "flex",
-          justifyContent: "center",
-          alignItems: "center",
-          width: 24,
-          height: 24
-        },
-        children: getIcon(title)
-      }
-    ) }),
-    /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 4 }, children: items.map((item) => /* @__PURE__ */ jsx(
-      Badge,
-      {
-        label: item,
-        hasClose: true,
-        state: "generic",
-        size: "small",
-        onClick: () => onGroupItemClick(title, item)
-      },
-      item.toString()
-    )) })
-  ] });
-};
-const GroupsRow = ({ groups, onGroupItemClick }) => {
-  if (!groups) return null;
-  const groupArray = Object.entries(groups).map(([title, items]) => ({
-    title,
-    items
-  }));
-  return /* @__PURE__ */ jsx("div", { style: { display: "flex", gap: 4 }, children: groupArray.length > 0 ? groupArray.map((group) => /* @__PURE__ */ jsx(
-    GroupItem,
-    {
-      title: group.title,
-      items: group.items,
-      onGroupItemClick
-    },
-    group.title
-  )) : null });
-};
-const SecondaryTableControlsRow = ({
-  groups,
-  totalRecords,
-  onChange
-}) => {
-  const onGroupItemClick = (title, item) => {
-    const groupItemClickEvent = {
-      event: "groupItemClick",
-      payload: { title, item }
-    };
-    onChange?.(groupItemClickEvent);
-  };
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      style: {
-        display: "flex",
-        justifyContent: "space-between",
-        alignItems: "flex-end",
-        marginTop: 8
-      },
-      children: [
-        /* @__PURE__ */ jsx(GroupsRow, { groups, onGroupItemClick }),
-        totalRecords > 0 ? /* @__PURE__ */ jsx(Typography, { variant: "body2", color: "#6C6C6C", children: `${totalRecords} results` }) : null
-      ]
-    }
-  );
-};
-export {
-  SecondaryTableControlsRow as default
-};

package/dist/components/Table/TableControls/TableControls.cjs

@@ -1,38 +0,0 @@
-"use strict";
-var jsxRuntime = require("react/jsx-runtime");
-var PrimaryTableControlsRow = require("./PrimaryTableControlsRow.cjs");
-var SecondaryTableControlsRow = require("./SecondaryTableControlsRow.cjs");
-const TableControls = ({
-  primaryTableRowData,
-  secondaryTableRowData,
-  onChange
-}) => {
-  const onPrimaryChange = (actionEvent) => {
-    onChange(actionEvent);
-  };
-  const onSecondaryChange = (actionEvent) => {
-    onChange(actionEvent);
-  };
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { "data-testid": "TableControls", style: { margin: "16px 0px" }, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      PrimaryTableControlsRow,
-      {
-        sortOptions: primaryTableRowData.sortOptions,
-        searchByPlaceholder: primaryTableRowData.searchByPlaceholder,
-        isSortedAscending: primaryTableRowData.isSortedAscending,
-        onChange: onPrimaryChange,
-        searchValue: primaryTableRowData.searchValue,
-        selectedSortOption: primaryTableRowData.selectedSortOption
-      }
-    ),
-    secondaryTableRowData ? /* @__PURE__ */ jsxRuntime.jsx(
-      SecondaryTableControlsRow,
-      {
-        groups: secondaryTableRowData.groups,
-        totalRecords: secondaryTableRowData.totalRecords,
-        onChange: onSecondaryChange
-      }
-    ) : null
-  ] });
-};
-module.exports = TableControls;