@gobolt/genesis 0.3.21 → 0.3.23

package/dist/components/TableWithControls/useTableWithControls.tsx

@@ -1,161 +0,0 @@
-import { useState } from "react";
-
-import { useTable, type UseTableConfig } from "../Table/useTable";
-import { mockColumns, mockDataSource } from "../Table/__mocks__/table-mocks";
-import { ActionEvent, TableEventPayload } from "../../types/events";
-
-//import
-
-const tableControlsData = {
-  primaryTableRowData: {
-    sortOptions: [
-      { value: "status", label: <span>Status</span> },
-      { value: "address", label: <span>Address</span> },
-      { value: "job_subtype", label: <span>Type</span> },
-    ],
-    searchByPlaceholder: "Search by Address",
-    isSortedAscending: true,
-  },
-  secondaryTableRowData: {
-    groups: {
-      orders: ["Cancelled", "Paused"],
-      warehouse: ["D2C"],
-      availability: ["Out of Stock"],
-    },
-    totalRecords: mockDataSource.appointments.length,
-  },
-};
-
-const startingUseTableConfig: UseTableConfig = {
-  columns: mockColumns,
-  filters: {
-    order: "asc",
-  },
-  // Disable auto-fetch to allow external data management
-  disableAutoFetch: true,
-  dataSource: [],
-};
-
-export const useTableWithControls = (tableConfig: UseTableConfig) => {
-  const [useTableConfig, setUseTableConfig] = useState<UseTableConfig>(
-    startingUseTableConfig
-  );
-
-  const [groups, setGroups] = useState(
-    tableControlsData.secondaryTableRowData.groups
-  );
-
-  const [primaryTableRowData, setPrimaryTableRowData] = useState(
-    tableControlsData.primaryTableRowData
-  );
-
-  const { secondaryTableRowData } = tableControlsData;
-
-  const newSecondaryTableRowData = {
-    ...secondaryTableRowData,
-    groups,
-    totalRecords: safeDataSource.length,
-  };
-
-  const { dataSource, columns, rowSelection, updateDataSource } =
-    useTable(useTableConfig);
-
-  // Ensure we always return a valid object, even if dataSource is empty
-  const safeDataSource = dataSource || [];
-
-  const onGroupItemClick = (title: string, item: string) => {
-    const newGroups = { ...groups };
-    newGroups[title] = newGroups[title].filter((group) => group !== item);
-    setGroups(newGroups);
-  };
-
-  const onChange = (actionEvent: ActionEvent<TableEventPayload>) => {
-    if (actionEvent.event === "inputChange") {
-      const { value } = actionEvent.payload;
-      if (typeof value === "string") {
-        setUseTableConfig((previous) => ({
-          ...previous,
-          filters: {
-            ...previous.filters,
-            search: value,
-          },
-          fetchOptions: {
-            ...previous.fetchOptions,
-            body: JSON.stringify({
-              filters: {
-                ...previous.filters,
-                search: value,
-              },
-            }),
-          },
-        }));
-      }
-    }
-
-    if (actionEvent.event === "primaryChange") {
-      const { value } = actionEvent.payload;
-      if (typeof value === "string") {
-        setUseTableConfig((previous) => ({
-          ...previous,
-          filters: {
-            ...previous.filters,
-            sort: value,
-          },
-          fetchOptions: {
-            ...previous.fetchOptions,
-            body: JSON.stringify({
-              filters: {
-                ...previous.filters,
-                sort: value,
-              },
-            }),
-          },
-        }));
-      }
-    }
-
-    if (actionEvent.event === "groupItemClick") {
-      const { title, item } = actionEvent.payload;
-      if (typeof title === "string" && typeof item === "string") {
-        onGroupItemClick(title, item);
-      }
-    }
-
-    if (actionEvent.event === "orderClick") {
-      setPrimaryTableRowData((previous) => ({
-        ...previous,
-        isSortedAscending: !previous.isSortedAscending,
-      }));
-
-      const { value } = actionEvent.payload;
-      if (typeof value === "string") {
-        setUseTableConfig((previous) => ({
-          ...previous,
-          filters: {
-            ...previous.filters,
-            order: value,
-          },
-          fetchOptions: {
-            ...previous.fetchOptions,
-            body: JSON.stringify({
-              filters: {
-                ...previous.filters,
-                order: value,
-              },
-            }),
-          },
-        }));
-      }
-    }
-  };
-
-  return {
-    onChange,
-    primaryTableRowData,
-    secondaryTableRowData: newSecondaryTableRowData,
-    dataSource: safeDataSource,
-    columns,
-    rowSelection,
-    updateDataSource,
-  };
-};

package/dist/components/UtilityButton/UtilityButton.tsx

@@ -1,36 +0,0 @@
-// a convenience component for utility buttons where we hardcode the themeType to "utility"
-
-import React from "react";
-import Button from "../Button";
-import type { ButtonProps } from "../Button";
-import { TYPE } from "../../constants";
-
-export interface UtilityButtonProps extends Omit<ButtonProps, "themeType"> {}
-
-const UtilityButton = ({
-  children,
-  onClick,
-  state = "active",
-  isIconButton = false,
-  size = "normal",
-  ...rest
-}: UtilityButtonProps) => {
-  const buttonState =
-    state === "active" || state === "disabled" ? state : "active";
-  const themeType = TYPE.utility as keyof typeof TYPE;
-  return (
-    <Button
-      onClick={onClick}
-      themeType={themeType}
-      state={buttonState}
-      disabled={state === "disabled" || rest.disabled}
-      isIconButton={isIconButton}
-      size={size}
-      {...rest}
-    >
-      {children}
-    </Button>
-  );
-};
-
-export default UtilityButton;

package/dist/constants/index.ts

@@ -1,98 +0,0 @@
-import Icon from "@ant-design/icons";
-
-export const TYPE = {
-  primary: "primary",
-  secondary: "secondary",
-  tertiary: "tertiary",
-  destructive: "destructive",
-  utility: "utility",
-  icon: "icon",
-};
-
-export const BREAKPOINTS = {
-  wide: "wide",
-  medium: "medium",
-  narrow: "narrow",
-};
-
-export const STATE = {
-  active: "active",
-  hover: "hover",
-  pressed: "pressed",
-  focussed: "focus",
-  disabled: "disabled",
-  error: "error",
-  success: "success",
-  warning: "warning",
-  progress: "progress",
-  info: "info",
-  filled: "filled",
-  generic: "generic",
-  removed: "removed",
-  hollow: "hollow",
-};
-
-export const TYPOGRAPHY_VARIANT = {
-  display1: "display1",
-  display2: "display2",
-  display3: "display3",
-  heading1: "heading1",
-  heading2: "heading2",
-  heading3: "heading3",
-  subHeading1: "subHeading1",
-  subHeading2: "subHeading2",
-  subHeading3: "subHeading3",
-  body1: "body1",
-  body2: "body2",
-  body3: "body3",
-  body4: "body4",
-  body5: "body5",
-  message: "message",
-  overline1: "overline1",
-  overline2: "overline2",
-  overline3: "overline3",
-  label1: "label1",
-  label2: "label2",
-  label3: "label3",
-  link1: "link1",
-  link2: "link2",
-  link3: "link3",
-  digits1: "digits1",
-  digits2: "digits2",
-  digits3: "digits3",
-};
-
-export const BUTTON_VARIANT = {
-  primary: "primary",
-  secondary: "secondary",
-  tertiary: "tertiary",
-};
-
-export const SIZE = {
-  small: "small",
-  medium: "medium",
-  large: "large",
-  standard: "standard",
-};
-
-export const BADGE = {
-  appointment: "appointment",
-  asn: "asn",
-  inventory: "inventory",
-  parcel: "parcel",
-  product: "product",
-  route: "route",
-  shipment: "shipment",
-  shoppingCart: "shopping cart",
-  system: "system",
-};
-
-export default {
-  TYPE,
-  BREAKPOINTS,
-  STATE,
-  TYPOGRAPHY_VARIANT,
-  BUTTON_VARIANT,
-  SIZE,
-  BADGE,
-};

package/dist/styles/theme/genesis-theme.types.ts

@@ -1,297 +0,0 @@
-export enum BreakpointLabel {
-  Narrow = "narrow",
-  Medium = "medium",
-  Wide = "wide",
-}
-
-export type Breakpoints = {
-  [key in BreakpointLabel]: number;
-};
-
-export type Sizing = {
-  Size1: number;
-  Size2: number;
-  Size3: number;
-  Size4: number;
-  Size5: number;
-  Size6: number;
-  Size7: number;
-  Size8: number;
-  Size10: number;
-  Size12: number;
-  Size13: number;
-  Size14: number;
-  Size16: number;
-  Size18: number;
-  Size20: number;
-  Size24: number;
-  Size27: number;
-  Size28: number;
-  Size30: number;
-  Size32: number;
-  Size34: number;
-  Size35: number;
-  Size39: number;
-  Size43: number;
-  Size50: number;
-  Size64: number;
-  Size05: number;
-  Size15: number;
-  Size025: number;
-  Size25: number;
-};
-
-type BorderRadius = {
-  BorderRadiusNone: number;
-  BorderRadiusXs: number;
-  BorderRadiusSm: number;
-  BorderRadiusMd: number;
-  BorderRadiusLg: number;
-  BorderRadiusXl: number;
-  BorderRadiusXxl: number;
-  BorderRadiusXxxl: number;
-  BorderRadiusRounded: number;
-};
-
-type FontStyle = {
-  fontSize: string;
-  lineHeight: string;
-  fontWeight: number;
-};
-
-export type TypographySize = {
-  display1: FontStyle;
-  display2: FontStyle;
-  display3: FontStyle;
-  heading1: FontStyle;
-  heading2: FontStyle;
-  heading3: FontStyle;
-  subHeading1: FontStyle;
-  subHeading2: FontStyle;
-  subHeading3: FontStyle;
-  body1: FontStyle;
-  body2: FontStyle;
-  body3: FontStyle;
-  body4: FontStyle;
-  body5: FontStyle;
-  message: FontStyle;
-  overline: FontStyle;
-  label: FontStyle;
-  link1: FontStyle;
-  link2: FontStyle;
-  link3: FontStyle;
-  digits1: FontStyle;
-  digits2: FontStyle;
-  digits3: FontStyle;
-};
-
-export type Typography = {
-  wide: TypographySize;
-  medium: TypographySize;
-  narrow: TypographySize;
-  fontFamily: string;
-  lineHeight: string;
-  body1: FontStyle;
-  body2: FontStyle;
-};
-
-export type ColorShades = {
-  100?: string;
-  200?: string;
-  300?: string;
-  400?: string;
-  500?: string;
-  600?: string;
-  700?: string;
-  800?: string;
-  900?: string;
-  black?: string;
-  white?: string;
-};
-
-type ColorLayer = {
-  textColor: string;
-  backgroundColor: string;
-  borderColor: string;
-  ringColor?: string;
-  active: ColorShades;
-  checked?: string;
-  default?: string;
-  border?: string;
-  onsurface: string;
-  generic?: string;
-  disabled?: string;
-  surface?: string;
-  hover?: string;
-  pressed?: string;
-  focus?: string;
-  info?: string;
-  success?: string;
-  error?: string;
-  empty?: string;
-};
-
-type ColorState = {
-  active: ColorLayer;
-  hover: ColorLayer;
-  pressed: ColorLayer;
-  focussed: ColorLayer;
-  disabled: ColorLayer;
-  link: ColorLayer;
-  surface: ColorLayer;
-  success: ColorLayer;
-  error: ColorLayer;
-  onsurface: ColorLayer;
-  warning: ColorLayer;
-  generic?: ColorLayer;
-  hollow?: ColorLayer;
-  info?: ColorLayer;
-  utility?: ColorLayer;
-  icon?: ColorLayer;
-  default?: ColorLayer;
-  selected?: ColorLayer;
-  border?: ColorLayer;
-  tertiary?: string;
-  copy?: string;
-  "copy-dark"?: string;
-  "border-light"?: string;
-  primary?: string;
-  progress?: ColorLayer;
-};
-
-export type ColorMode = {
-  primary: ColorState;
-  secondary: ColorState;
-  tertiary: ColorState;
-  destructive: ColorState;
-  success: ColorState;
-  warning: ColorState;
-  danger: ColorState;
-  info: ColorState;
-  onsurface: ColorState;
-  surface: ColorState;
-  inputs: ColorState;
-  interactive: ColorState;
-  status: ColorState;
-  brandon: ColorState;
-};
-
-export type ColorModes = {
-  light: ColorMode;
-  dark: ColorMode;
-};
-
-export type ColorGroup =
-  | "red"
-  | "orange"
-  | "yellow"
-  | "green"
-  | "blue"
-  | "purple"
-  | "sky"
-  | "gray";
-
-type AllColors = {
-  red: ColorShades;
-  orange: ColorShades;
-  yellow: ColorShades;
-  green: ColorShades;
-  blue: ColorShades;
-  purple: ColorShades;
-  sky: ColorShades;
-  gray: ColorShades;
-};
-
-type Mode = "light" | "dark";
-
-type Button = {
-  padding: {
-    verPadding: number;
-    horPadding: number;
-  };
-  gap: number;
-  radius: number;
-};
-
-type Input = {
-  suffixPrefixHorPadding: number;
-  suffixPrefixVerPadding: number;
-};
-
-type Badge = {
-  "ver-padding": number;
-  "left-padding": number;
-  "right-padding": number;
-  radius: number;
-};
-
-type CommonContainer = {
-  "ver-padding": number;
-  "hor-padding": number;
-  radius: number;
-  gap: number;
-};
-
-type Popover = CommonContainer;
-
-type Row = CommonContainer;
-
-type TableCell = {
-  surface: string;
-  hover: string;
-  pressed: string;
-};
-
-export type Components = {
-  button: Button;
-  utilityButton: Button;
-  iconButton: Button;
-  input: Input;
-  row: Row;
-  badge: Badge;
-  popover: Popover;
-  tableCell: TableCell;
-};
-
-type Motion = {
-  instant: string;
-  veryfast: string;
-  fast: string;
-  medium: string;
-  slow: string;
-};
-
-type Shadows = {
-  general: {
-    "1": string;
-    "2": string;
-    "3": string;
-  };
-  actions: {
-    "1": string;
-    "2": string;
-  };
-  inputs: {
-    "1": string;
-  };
-};
-
-interface ConvenienceFunctions {
-  getStatusColor: (colors: ColorMode, status: string) => string;
-}
-
-export interface BaseTokens extends ConvenienceFunctions {
-  breakpoints: Breakpoints;
-  sizing: Sizing;
-  borderRadius: BorderRadius;
-  typography: Typography;
-  allColors: AllColors;
-  components: Components;
-  motion: Motion;
-  shadows: Shadows;
-}
-
-export interface GenesisTheme extends BaseTokens {
-  colors: ColorMode;
-  mode: Mode;
-}

package/dist/utils/styled.ts

@@ -1,52 +0,0 @@
-/*
-Warning: this was a failed attempt to create a universal styled-components library.
-When importing styled-components into a non React Native app, it will throw an error!
-
-Even when React Native was setup as an optional peer dependency; it's not actually working.
-Now it's seems like a better idea to create a separate Genesis package for React Native styled-components which is basically only the theme provider.
-*/
-
-/*
-import * as styledComponents from "styled-components";
-
-// Platform detection
-const isReactNative =
-  typeof navigator !== "undefined" && navigator.product === "ReactNative";
-
-// Set up platform-specific styled
-let platformStyled;
-if (isReactNative) {
-  try {
-    platformStyled = require("styled-components/native");
-  } catch (e) {
-    console.warn(
-      "Failed to load styled-components/native, falling back to web"
-    );
-    platformStyled = styledComponents;
-  }
-} else {
-  platformStyled = styledComponents;
-}
-
-// Export named exports
-export const styled = platformStyled.default;
-export const ThemeProvider = platformStyled.ThemeProvider;
-export const useTheme = platformStyled.useTheme;
-export const css = platformStyled.css;
-
-// Add createGlobalStyle (web only)
-export const createGlobalStyle = isReactNative
-  ? () => null
-  : styledComponents.createGlobalStyle;
-
-// Export default too for backwards compatibility
-export default styled;
-*/
-
-export {
-  default,
-  createGlobalStyle,
-  useTheme,
-  ThemeProvider,
-  css,
-} from "styled-components";