@ilo-org/react 0.14.0 → 0.15.0

package/.storybook/manager-head.html

@@ -1,92 +0,0 @@
-<!-- .storybook/manager-head.html -->
-<style>
-  @import url("/fonts/fonts-google.css");
-  @import url("https://fonts.googleapis.com/css2?family=Fira+Code&display=swap");
-</style>
-
-<!-- Canonical URL -->
-
-<link href="https://react.ui.ilo.org" rel="canonical" />
-
-<!-- Favicon -->
-<link rel="icon" href="/favicon.ico" type="image/x-icon" />
-
-<style>
-  :root {
-    --ilo-white: #fff;
-    --ilo-dark-blue: #230050;
-    --ilo-light-blue: #ffcd2d;
-    --ilo-turquoise: #05d2d2;
-    --ilo-purple: #960a55;
-    --ilo-light-blue: rgba(235, 245, 253, 1);
-  }
-
-  body {
-    font-family: "Noto Sans", sans-serif;
-  }
-
-  a[id*="overview"] > svg {
-    color: var(--ilo-purple);
-    font-family: "Overpass", sans-serif;
-  }
-
-  a:not[id*="overview"] > svg {
-    color: var(--ilo-turquoise);
-  }
-
-  /* Remount component */
-  button[title="Remount component"]:hover,
-  button[title="Zoom in"]:hover,
-  button[title="Zoom out"]:hover,
-  button[title="Reset zoom"]:hover,
-  button[title="Change the background of the preview"]:hover,
-  button[title="Apply a grid to the preview"]:hover,
-  button[title="Change the size of the preview"]:hover,
-  button[title="Enable measure"]:hover,
-  button[title="Apply outlines to the preview"]:hover,
-  button[title="Vision simulator"]:hover,
-  button[title="Go full screen [F]"]:hover,
-  a[title="Open canvas in new tab"]:hover,
-  button[title="Copy canvas link"]:hover {
-    color: var(--ilo-dark-blue);
-    background-color: var(--ilo-light-blue);
-  }
-
-  button.sto-1qova3h,
-  button.sto-4f61h0,
-  button[title="Rotate viewport"]:hover {
-    color: var(--ilo-light-blue);
-  }
-
-  button.tabbutton:active,
-  button.tabbutton:focus {
-    border-bottom-color: var(--ilo-light-blue);
-  }
-
-  .realm {
-    width: 100%;
-    background: transparent;
-    box-sizing: border-box;
-    text-align: left;
-    font-size: 0.8rem;
-    border-top: 1px solid #d3dce3;
-    padding-top: 15px;
-    color: #1e2dbe;
-    font-weight: 600;
-    font-family: "Nunito Sans", sans-serif;
-    margin-top: -10px;
-  }
-</style>
-
-<script>
-  window.addEventListener("load", function () {
-    const sidebar = document.querySelector(".sidebar-header");
-    const customLabel = document.createElement("div");
-    customLabel.classList.add("realm");
-    customLabel.textContent = "React Components";
-
-    if (sidebar) {
-      sidebar.insertAdjacentElement("afterend", customLabel);
-    }
-  });
-</script>

package/.storybook/manager.ts

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

package/.storybook/preview-head.html

@@ -1,5 +0,0 @@
-<style>
-  .story-decorator {
-    padding-top: 2rem;
-  }
-</style>

package/.storybook/preview.tsx

@@ -1,81 +0,0 @@
-import { GlobalProvider } from "../src/components/GlobalProvider";
-import { themeprefix } from "@ilo-org/themes/tokens/theme/base.json";
-import { Decorator } from "@storybook/react";
-import { theme } from "./theme";
-import "./styles.scss";
-import { brand } from "@ilo-org/themes/tokens/brand/base.json";
-
-export const parameters = {
-  actions: { argTypesRegex: "^on[A-Z].*" },
-  controls: {
-    expanded: true,
-    matchers: {
-      color: /(background|color)$/i,
-      date: /Date$/,
-    },
-  },
-  options: {
-    storySort: {
-      method: "alphabetical",
-      order: ["Welcome", "GettingStarted"],
-      locales: "en-US",
-    },
-  },
-  backgrounds: {
-    values: [
-      { name: "light", value: "white" },
-      { name: "dark", value: brand["ilo-dark-blue"].value },
-    ],
-  },
-  previewTabs: {
-    "storybook/docs/panel": { index: -1 },
-    canvas: { title: "Code", hidden: false },
-  },
-  viewMode: "docs",
-  layout: "padded",
-  docs: {
-    theme: theme,
-    source: {
-      excludeDecorators: true,
-    },
-  },
-};
-
-export const decorators: Decorator[] = [
-  // Providces the GlobalProvider context to all stories
-  (Story) => (
-    <GlobalProvider prefix={themeprefix.value}>
-      <Story />
-    </GlobalProvider>
-  ),
-  // Wraps components in story mode
-  (Story, ctx) => {
-    // Should this story be rendered in full width?
-    const fullWidthStories = ["footer", "localnav", "navigation", "hero"];
-    const isFullWidth = fullWidthStories.some((story) =>
-      ctx.title.toLocaleLowerCase().includes(story)
-    );
-
-    if (ctx.viewMode === "story") {
-      if (isFullWidth) {
-        return <Story />;
-      }
-
-      return (
-        <div className="story-decorator-wrapper ">
-          <div className="story-decorator">
-            <Story />
-          </div>
-        </div>
-      );
-    }
-    return <Story />;
-  },
-];
-
-export const globalTypes = {
-  rtlDirection: {
-    description: "HTML dir attribute",
-    defaultValue: false,
-  },
-};

package/.storybook/styles.scss

@@ -1,25 +0,0 @@
-@import "@ilo-org/themes/build/scss/tokens";
-@import "@ilo-org/styles/scss/monorepo";
-
-h1,
-h2,
-h3,
-h4,
-h5 {
-  font-family: "Overpass", sans-serif !important;
-}
-
-button[title="Zoom in"]:hover,
-button[title="Zoom out"]:hover,
-button[title="Reset zoom"]:hover {
-  color: $brand-ilo-dark-blue;
-  background-color: $brand-ilo-light-blue;
-}
-
-a[class*="ilo--button"] {
-  color: $brand-ilo-dark-blue;
-
-  &:hover {
-    color: $brand-ilo-blue;
-  }
-}

package/.storybook/theme.ts

@@ -1,46 +0,0 @@
-// .storybook/YourTheme.js
-
-import { create } from "@storybook/theming/create";
-import ilo_logo from "@ilo-org/brand-assets/logo_en_horizontal_blue.svg";
-import brandColors from "@ilo-org/themes/tokens/brand/base.json";
-
-const { brand } = brandColors;
-
-export const theme = create({
-  base: "light",
-  brandTitle: "ILO Design System for React",
-  brandUrl: "https://www.ilo.org/",
-  brandImage: ilo_logo,
-  brandTarget: "_self",
-
-  colorPrimary: brand["ilo-dark-blue"].value,
-  colorSecondary: brand["ilo-blue"].value,
-
-  // UI
-  appBg: brand["ilo-light-blue"].value,
-  appContentBg: brand["ilo-white"].value,
-  appBorderColor: brand["ilo-grey-ui"].value,
-  appBorderRadius: 0,
-
-  fontBase: "'Noto Sans', sans-serif",
-  fontCode: "'Fira Code', monospace",
-
-  // Text colors
-  textColor: brand["ilo-dark-blue"].value,
-  textInverseColor: brand["ilo-white"].value,
-  textMutedColor: brand["ilo-grey-accessible"].value,
-
-  // Toolbar default and active colors
-  barTextColor: brand["ilo-white"].value,
-  barSelectedColor: brand["ilo-yellow"].value,
-  barBg: brand["ilo-dark-blue"].value,
-
-  buttonBg: brand["ilo-white"].value,
-  buttonBorder: brand["ilo-grey-ui"].value,
-  booleanBg: brand["ilo-light-blue"].value,
-  booleanSelectedBg: brand["ilo-white"].value,
-  inputBg: brand["ilo-light-blue"].value,
-  inputBorder: brand["ilo-grey-ui"].value,
-  inputTextColor: brand["ilo-dark-blue"].value,
-  inputBorderRadius: 3,
-});

package/.turbo/turbo-build:lib.log

@@ -1,15 +0,0 @@
-
-> @ilo-org/react@0.14.0 build:lib /home/runner/work/designsystem/designsystem/packages/react
-> rollup -c
-
-
-src/index.ts, src/components/**/index.ts, src/components/**/*.tsx, src/hooks/*.ts, src/utils/*.ts → lib/esm, lib/cjs...
-(!) Mixing named and default exports
-https://rollupjs.org/configuration-options/#output-exports
-The following entry modules are using named and default exports together:
-src/components/Fieldset/Fieldset.tsx
-src/components/FormControl/FormControl.tsx
-src/hooks/usePrevious.ts
-
-Consumers of your bundle will have to use chunk.default to access their default export, which may not be what you want. Use `output.exports: "named"` to disable this warning.
-created lib/esm, lib/cjs in 16s