@nypl/design-system-react-components 1.0.2 → 1.0.3-beta

package/src/utils/componentCategories.ts

@@ -1,152 +0,0 @@
-// NYPL Reservoir Design System Component Categories
-
-const categories = {
-  accessibility: {
-    title: "Accessibility Guide",
-    components: ["Skip Navigation"],
-  },
-  basicContent: {
-    title: "Components/Basic Elements",
-    components: ["Card", "Hero", "Promo", "Sponsor"],
-  },
-  chakra: {
-    title: "Components/Chakra Exports/Layout",
-    components: [
-      "Box",
-      "Flex",
-      "Grid",
-      "Center, Circle, Square",
-      "Stack, HStack, VStack",
-    ],
-  },
-  contentDisplay: {
-    title: "Components/Content Display",
-    components: [
-      "AccessibilityDisplayHelper",
-      "AddressDisplayHelper",
-      "DateDisplayHelper",
-      "HelperErrorText",
-      "HoursDisplayHelper",
-      "OverflowMenu",
-      "StatusBadge",
-    ],
-  },
-  deprecated: {
-    title: "Components/Deprecated",
-    components: ["CardEdition", "Input"],
-  },
-  devguide: {
-    title: "Development Guide",
-    components: ["Autosuggest"],
-  },
-  feedback: {
-    title: "Components/Feedback",
-    components: [
-      "Alert",
-      "InlineLoading",
-      "Notification",
-      "ProgressIndicator",
-      "SkeletonLoader",
-    ],
-  },
-  forms: {
-    title: "Components/Form Elements",
-    components: [
-      "Button",
-      "ButtonGroup",
-      "Checkbox",
-      "CheckboxGroup",
-      "DatePicker",
-      "DateRangePicker",
-      "Dropdown",
-      "Fieldset",
-      "FileUploader",
-      "Form",
-      "Label",
-      "NumberInput",
-      "Radio",
-      "RadioGroup",
-      "SearchBar",
-      "Select",
-      "Slider",
-      "Textarea",
-      "TextInput",
-      "Toggle",
-    ],
-  },
-  hooks: {
-    title: "Hooks",
-    components: ["useCarouselStyles", "useNYPLTheme", "useWindowSize"],
-  },
-  layout: {
-    title: "Components/Page Layout",
-    components: [
-      "StructuredContent",
-      "ContentSwitcher",
-      "Footer",
-      "Header",
-      "HorizontalRule",
-      "Section",
-      "SimpleGrid",
-      "Table",
-      "Template",
-    ],
-  },
-  overlayContentSwitcher: {
-    title: "Components/Overlays & Switchers",
-    components: ["Accordion", "Modal", "Tabs", "Tooltip"],
-  },
-  media: {
-    title: "Components/Media & Icons",
-    components: [
-      "AudioPlayer",
-      "Icon",
-      "Image",
-      "Logo",
-      "Slideshow",
-      "VideoPlayer",
-    ],
-  },
-  navigation: {
-    title: "Components/Navigation",
-    components: [
-      "Breadcrumbs",
-      "Link",
-      "Menu",
-      "Pagination",
-      "SkipNavigation",
-      "Subnavigation",
-    ],
-  },
-  styleguide: {
-    title: "Style Guide",
-    components: [
-      "Bidirectionality",
-      "Breakpoints",
-      "Buttons",
-      "Colors",
-      "Design Tokens",
-      "Forms",
-      "Iconography",
-      "Spacing",
-      "Template Bidirectionality",
-      "Typography",
-    ],
-  },
-  typography: {
-    title: "Components/Typography & Styles",
-    components: ["Heading", "List", "Text"],
-  },
-};
-
-export const getCategory = (component: string) => {
-  let catPath = component;
-  Object.keys(categories).forEach((key: string) => {
-    const t = categories[key as keyof typeof categories].title;
-    const c = categories[key as keyof typeof categories].components;
-    if (c.includes(component)) {
-      catPath = `${t}/${component}`;
-    }
-  });
-  return catPath;
-};

package/src/utils/interfaces.ts

@@ -1,5 +0,0 @@
-export interface AriaAttributes {
-  "aria-label"?: string;
-  "aria-describedby"?: string;
-  "aria-labelledby"?: string;
-}

package/src/utils/utils.ts

@@ -1,84 +0,0 @@
-import { HelperErrorTextType } from "../components/HelperErrorText/HelperErrorText";
-import { AriaAttributes } from "./interfaces";
-
-// Utility functions to use throughout the codebase
-
-/**
- * range
- * Get an array of values from `start` to `stop` - 1 with an optional
- * `step` between values.
- */
-export const range = (start: number, stop: number, step = 1): number[] => {
-  if (!start) {
-    return [];
-  }
-
-  return Array(Math.ceil((stop - start) / step))
-    .fill(start)
-    .map((x, y) => x + y * step);
-};
-
-/**
- * Given a pagination's pageCount, this will return (1) a page number,
- * derived from the current URL, and (2) a function that, when passed to
- * Pagination component, makes the URL change and refreshes the page.
- * @NOTE this is only used for Storybook documentation.
- */
-export const getStorybookHrefProps = (pageCount: number) => {
-  // This uses the `addon-queryparams` Storybook addon.
-  const urlParams = new URLSearchParams(document.location.search);
-  const pageParam = urlParams.get("page");
-
-  const getPageNumber = (page: number, pageCount: number) => {
-    return page > 0 && page <= pageCount ? page : 1;
-  };
-  const computedCurrentPage =
-    pageParam &&
-    Number(pageParam) &&
-    getPageNumber(Number(pageParam), pageCount);
-  const location = window.location;
-  // Passing this function into `Pagination` makes the URL to change
-  // and refreshes the page.
-  const getPageHref = (selectedPage: number) => {
-    return `${location.href}&page=${selectedPage}`;
-  };
-
-  return { computedCurrentPage, getPageHref };
-};
-
-interface GetAriaAttrsProps {
-  footnote: HelperErrorTextType;
-  id: string;
-  labelText: HelperErrorTextType;
-  name: string;
-  showLabel: boolean;
-}
-/**
- * Get aria-* attributes for input components. This sets the `aria-label` and
- * `aria-describedby` attributes, based on the label and footnote values.
- */
-export const getAriaAttrs = ({
-  footnote,
-  id,
-  labelText,
-  name,
-  showLabel,
-}: GetAriaAttrsProps): AriaAttributes => {
-  let ariaAttributes: AriaAttributes = {};
-
-  if (!showLabel) {
-    if (typeof labelText !== "string") {
-      console.warn(
-        `NYPL Reservoir ${name}: \`labelText\` must be a string when \`showLabel\` is false.`
-      );
-    }
-    ariaAttributes["aria-label"] =
-      labelText && footnote
-        ? `${labelText} - ${footnote}`
-        : (labelText as string);
-  } else if (footnote) {
-    ariaAttributes["aria-describedby"] = `${id}-helperText`;
-  }
-
-  return ariaAttributes;
-};