@ilo-org/react 0.0.18 → 0.1.0

package/src/components/index.ts

@@ -0,0 +1,44 @@
+export {
+  Accordion,
+  AccordionButton,
+  AccordionItem,
+  AccordionPanel,
+} from "./Accordion";
+export { Collapse } from "./Collapse";
+export { Empty } from "./Empty";
+export { FormGroup } from "./FormGroup";
+export { Image } from "./Image";
+export { Loading } from "./Loading";
+export { Radio } from "./Radio";
+export { Tag } from "./Tag";
+export { Button } from "./Button";
+export { ContextMenu } from "./ContextMenu";
+export { Fieldset } from "./Fieldset";
+export { GlobalProvider } from "./GlobalProvider";
+export { Input } from "./Input";
+export { Notification } from "./Notification";
+export { ReadMore } from "./ReadMore";
+export { Textarea } from "./Textarea";
+export { Callout } from "./Callout";
+export { Credit } from "./Credit";
+export { FileUpload } from "./FileUpload";
+export { Heading } from "./Heading";
+export { Link } from "./Link";
+export { NumberPicker } from "./NumberPicker";
+export { RichText } from "./RichText";
+export { Tooltip } from "./Tooltip";
+export { Checkbox } from "./Checkbox";
+export { DatePicker } from "./DatePicker";
+export { Form } from "./Form";
+export { Hero } from "./Hero";
+export { LinkList } from "./LinkList";
+export { Pagination } from "./Pagination";
+export { SearchField } from "./SearchField";
+export { Video } from "./Video";
+export { ChoiceGroup } from "./ChoiceGroup";
+export { Dropdown } from "./Dropdown";
+export { FormElement } from "./FormElement";
+export { Icon } from "./Icon";
+export { List } from "./List";
+export { Profile } from "./Profile";
+export { TableOfContents } from "./TableOfContents";

package/src/hooks/index.ts

@@ -0,0 +1,2 @@
+export { default as useGlobalSettings } from "./useGlobalSettings";
+export { default as useVideoPlayer } from "./useVideoPlayer";

package/src/index.ts

@@ -1,19 +1 @@
-import {
-  Accordion,
-  AccordionButton,
-  AccordionItem,
-  AccordionPanel,
-} from "./components/Accordion";
-import { Collapse } from "./components/Collapse";
-import { GlobalProvider } from "./components/GlobalProvider";
-import { Heading } from "./components/Heading";
-
-export {
-  Accordion,
-  AccordionButton,
-  AccordionItem,
-  AccordionPanel,
-  Collapse,
-  GlobalProvider,
-  Heading,
-};
+export * from "./components";

package/src/types/index.ts

@@ -1,8 +1,9 @@
-export type accordionSize = "small" | "large";
-export type buttonFunctions = "button" | "submit" | "reset";
-export type buttonTypes = "primary" | "secondary" | "tertiary" | "alert";
-export type calloutTypes = "info" | "error" | "success" | "warning";
-export type fieldTypes =
+// export type AccordionSize = "small" | "large";
+export type ButtonFunctions = "button" | "submit" | "reset";
+export type ButtonTypes = "primary" | "secondary" | "tertiary" | "alert";
+export type CalloutTypes = "info" | "error" | "success" | "warning";
+export type ChoiceGroupFieldTypes = "checkbox" | "radio";
+export type FieldTypes =
   | "checkbox"
   | "date"
   | "dropdown"
@@ -13,18 +14,18 @@ export type fieldTypes =
   | "textarea"
   | "toggle"
   | "file";
-export type formGroupTypes = "default" | "filter";
-export type headingLevel = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
-export type heroCardAlignment = "left" | "center" | "right";
-export type heroCardTypes =
+export type FormGroupTypes = "default" | "filter";
+export type HeadingLevel = "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+export type HeroCardAlignment = "left" | "center" | "right";
+export type HeroCardTypes =
   | "home"
   | "publication"
   | "graphic"
   | "project"
   | "article"
   | "portal";
-export type heroCardTheme = "dark" | "light";
-export type inputTypes =
+export type HeroCardTheme = "dark" | "light";
+export type InputTypes =
   | "email"
   | "hidden"
   | "password"
@@ -32,18 +33,18 @@ export type inputTypes =
   | "tel"
   | "text"
   | "url";
-export type labelTypes = "default" | "actionable" | "light";
-export type linkTypes = "light" | "dark" | "footer" | "button";
-export type linkListThemes = "light" | "dark";
-export type tooltipThemes = "light" | "dark";
-export type tooltipAlignment = "top" | "right" | "bottom" | "left";
-export type tooltipPlacement = "negative" | "center" | "positive";
-export type listAlignment = "default" | "horizontal";
-export type listOrder = "unordered" | "ordered" | "unstyled";
-export type loadingStatus = "idle" | "loading" | "loaded";
-export type loadingSize = "small" | "large";
-export type notificationPlacement = "dialog" | "inline";
-export type notificationTypes = "error" | "info" | "success" | "warning";
-export type positionTypes = "top" | "bottom" | "left" | "right";
-export type sizeTypes = "small" | "medium" | "large";
-export type tagTypes = "anchor" | "display" | "button";
+export type LabelTypes = "default" | "actionable" | "light";
+export type LinkTypes = "light" | "dark" | "footer" | "button";
+export type LinkListThemes = "light" | "dark";
+export type TooltipThemes = "light" | "dark";
+export type TooltipAlignment = "top" | "right" | "bottom" | "left";
+export type TooltipPlacement = "negative" | "center" | "positive";
+export type ListAlignment = "default" | "horizontal";
+export type ListOrder = "unordered" | "ordered" | "unstyled";
+export type LoadingStatus = "idle" | "loading" | "loaded";
+export type LoadingSize = "small" | "large";
+export type NotificationPlacement = "dialog" | "inline";
+export type NotificationTypes = "error" | "info" | "success" | "warning";
+export type PositionTypes = "top" | "bottom" | "left" | "right";
+export type SizeTypes = "small" | "medium" | "large";
+export type TagTypes = "anchor" | "display" | "button";

package/src/utils/index.ts

@@ -0,0 +1,6 @@
+export { checkArrayDuplicates } from "./checkArrayDuplicates";
+export { default as createChainedFunctions } from "./createChainedFunction";
+export { default as getDefaultDimensionValue } from "./getDefaultDimensionValue";
+export { default as hoursMinutesSeconds } from "./hoursMinutesSeconds";
+export { default as transitionEndListener } from "./transitionEndListener";
+export { default as triggerBrowserReflow } from "./triggerBrowserReflow";

package/tsconfig.build.json

@@ -2,14 +2,18 @@
   "extends": "@ilo-org/typescript-config",
   "include": ["src/**/*"],
   "compilerOptions": {
-    "outDir": "lib",
-    "types": ["node"]
+    "types": ["node"],
+    "declaration": true,
+    "declarationDir": "lib/types"
   },
   "exclude": [
     "node_modules",
     "lib",
     "storybook-static",
     "src/stories",
-    "src/__test__"
+    "src/__tests__",
+    "**/*.args.ts",
+    "src/setup.ts",
+    "scripts"
   ]
 }

package/.eslintrc.js

@@ -1,36 +0,0 @@
-/**
- * Package-level eslint config extends the global config and applies
- * customizations relative to the local project. In this example we
- * are lintinting both js and ts files, so we combine two configs
- * and set the TypeScript settings as an override
- */
-module.exports = {
-  /* =============== */
-  /* Global Settings */
-  /* =============== */
-  root: true,
-  extends: ["@ilo-org/eslint-config"],
-  // Extend the default config and add any specific settings for this project
-  ignorePatterns: [
-    "storybook-static/",
-    "node_modules/",
-    "lib/",
-    "src/stories/",
-  ],
-
-  overrides: [
-    /* =================== */
-    /* TypeScript Settings */
-    /* =================== */
-    {
-      // Which files the override will apply to relative to the package root
-      files: ["**/*.{ts,tsx}"],
-      extends: ["@ilo-org/eslint-config/typescript"],
-      // The typescript parser options for this package, which will be different
-      // from other packages
-      parserOptions: {
-        project: ["./tsconfig.json"],
-      },
-    },
-  ],
-};

package/.storybook/main.js

@@ -1,28 +0,0 @@
-const config = {
-  stories: ["../src/**/*.stories.mdx", "../src/**/*.stories.@(js|jsx|ts|tsx)"],
-  addons: [
-    "@storybook/addon-links",
-    "@storybook/addon-essentials",
-    {
-      name: "@storybook/preset-create-react-app",
-      options: {
-        scriptsPackageName: "react-scripts",
-      },
-    },
-    "@storybook/addon-a11y",
-  ],
-  core: {
-    builder: "webpack5",
-  },
-  typescript: {
-    reactDocgen: "react-docgen-typescript",
-    reactDocgenTypescriptOptions: {
-      compilerOptions: {
-        allowSyntheticDefaultImports: true,
-        esModuleInterop: true,
-      },
-    },
-  },
-};
-
-module.exports = config;

package/.storybook/manager-head.html

@@ -1,2 +0,0 @@
-<!-- .storybook/manager-head.html -->
-<link rel="icon" type="image/x-icon" href="https://www.ilo.org/wcmsp5/ilo/global/images/templates/favicons/favicon.ico"/>

package/.storybook/manager.js

@@ -1,6 +0,0 @@
-import { addons } from "@storybook/addons";
-import theme from "./theme";
-
-addons.setConfig({
-  theme: theme,
-});

package/.storybook/preview.tsx

@@ -1,40 +0,0 @@
-import type { DecoratorFn } from "@storybook/react";
-import { GlobalProvider } from "../src/components/GlobalProvider";
-import { themeprefix } from "@ilo-org/themes/tokens/theme/base.json";
-import "./styles.scss";
-
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    expanded: true,
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-  options: {
-    storySort: {
-      method: "alphabetical",
-      order: ["Welcome", "Intro", "Tokens", ["Colors", "Typography"]],
-      locales: "en-US",
-    },
-  },
-  parameters: {
-    layout: "centered",
-  },
-  previewTabs: {
-    "storybook/docs/panel": { index: -1 },
-    canvas: { title: "Code", hidden: false },
-  },
-  viewMode: "docs",
-};
-
-export const decorators: DecoratorFn[] = [
-  (Story) => (
-    <div>
-      <GlobalProvider prefix={themeprefix.value}>
-        <Story />
-      </GlobalProvider>
-    </div>
-  ),
-];

package/.storybook/styles.scss

@@ -1 +0,0 @@
-@import "@ilo-org/styles/scss/monorepo";

package/.storybook/theme.js

@@ -1,11 +0,0 @@
-// .storybook/YourTheme.js
-
-import { create } from "@storybook/theming";
-
-export default create({
-  base: "light",
-  brandTitle: "ILO UI Kit",
-  brandUrl: "https://www.ilo.org/",
-  brandImage:
-    "https://www.ilo.org/wcmsp5/ilo/global/images/templates/favicons/apple-touch-icon-precomposed.png",
-});