@cgi-learning-hub/ui 0.0.1-dev.1706567478 → 0.0.1-dev.1706796454

package/dist/components/SearchField/index.d.ts

@@ -0,0 +1,2 @@
+export { default as SearchField } from "./SearchField";
+export * from './SearchField';

package/dist/components/SearchField/index.js

@@ -0,0 +1,4 @@
+import { default as r } from "./SearchField.js";
+export {
+  r as SearchField
+};

package/dist/components/index.d.ts

@@ -1,2 +1,2 @@
-export * from "./BasicButtons";
-export * from "./AnotherComponent";
+export * from "./Button";
+export * from "./SearchField";

package/dist/components/index.js

@@ -1,6 +1,6 @@
-import { default as e } from "./BasicButtons/BasicButtons.js";
-import { default as r } from "./AnotherComponent/AnotherComponent.js";
+import { default as a } from "./Button/Button.js";
+import { default as r } from "./SearchField/SearchField.js";
 export {
-  r as AnotherComponent,
-  e as BasicButtons
+  a as Button,
+  r as SearchField
 };

package/dist/createSvgIcon-3ijLxpup.js

@@ -0,0 +1,182 @@
+import { g as b, a as I, s as w, c as g, u as C, _ as T, b as S, d as N, P as o, e as R } from "./TransitionGroupContext-SCyurvOT.js";
+import * as v from "react";
+import { jsxs as O, jsx as _ } from "react/jsx-runtime";
+function B(e) {
+  return b("MuiSvgIcon", e);
+}
+I("MuiSvgIcon", ["root", "colorPrimary", "colorSecondary", "colorAction", "colorError", "colorDisabled", "fontSizeInherit", "fontSizeSmall", "fontSizeMedium", "fontSizeLarge"]);
+const j = ["children", "className", "color", "component", "fontSize", "htmlColor", "inheritViewBox", "titleAccess", "viewBox"], A = (e) => {
+  const {
+    color: n,
+    fontSize: t,
+    classes: r
+  } = e, i = {
+    root: ["root", n !== "inherit" && `color${g(n)}`, `fontSize${g(t)}`]
+  };
+  return R(i, B, r);
+}, E = w("svg", {
+  name: "MuiSvgIcon",
+  slot: "Root",
+  overridesResolver: (e, n) => {
+    const {
+      ownerState: t
+    } = e;
+    return [n.root, t.color !== "inherit" && n[`color${g(t.color)}`], n[`fontSize${g(t.fontSize)}`]];
+  }
+})(({
+  theme: e,
+  ownerState: n
+}) => {
+  var t, r, i, d, f, c, h, u, m, s, a, p, l;
+  return {
+    userSelect: "none",
+    width: "1em",
+    height: "1em",
+    display: "inline-block",
+    // the <svg> will define the property that has `currentColor`
+    // e.g. heroicons uses fill="none" and stroke="currentColor"
+    fill: n.hasSvgAsChild ? void 0 : "currentColor",
+    flexShrink: 0,
+    transition: (t = e.transitions) == null || (r = t.create) == null ? void 0 : r.call(t, "fill", {
+      duration: (i = e.transitions) == null || (i = i.duration) == null ? void 0 : i.shorter
+    }),
+    fontSize: {
+      inherit: "inherit",
+      small: ((d = e.typography) == null || (f = d.pxToRem) == null ? void 0 : f.call(d, 20)) || "1.25rem",
+      medium: ((c = e.typography) == null || (h = c.pxToRem) == null ? void 0 : h.call(c, 24)) || "1.5rem",
+      large: ((u = e.typography) == null || (m = u.pxToRem) == null ? void 0 : m.call(u, 35)) || "2.1875rem"
+    }[n.fontSize],
+    // TODO v5 deprecate, v6 remove for sx
+    color: (s = (a = (e.vars || e).palette) == null || (a = a[n.color]) == null ? void 0 : a.main) != null ? s : {
+      action: (p = (e.vars || e).palette) == null || (p = p.action) == null ? void 0 : p.active,
+      disabled: (l = (e.vars || e).palette) == null || (l = l.action) == null ? void 0 : l.disabled,
+      inherit: void 0
+    }[n.color]
+  };
+}), y = /* @__PURE__ */ v.forwardRef(function(n, t) {
+  const r = C({
+    props: n,
+    name: "MuiSvgIcon"
+  }), {
+    children: i,
+    className: d,
+    color: f = "inherit",
+    component: c = "svg",
+    fontSize: h = "medium",
+    htmlColor: u,
+    inheritViewBox: m = !1,
+    titleAccess: s,
+    viewBox: a = "0 0 24 24"
+  } = r, p = T(r, j), l = /* @__PURE__ */ v.isValidElement(i) && i.type === "svg", x = S({}, r, {
+    color: f,
+    component: c,
+    fontSize: h,
+    instanceFontSize: n.fontSize,
+    inheritViewBox: m,
+    viewBox: a,
+    hasSvgAsChild: l
+  }), $ = {};
+  m || ($.viewBox = a);
+  const z = A(x);
+  return /* @__PURE__ */ O(E, S({
+    as: c,
+    className: N(z.root, d),
+    focusable: "false",
+    color: u,
+    "aria-hidden": s ? void 0 : !0,
+    role: s ? "img" : void 0,
+    ref: t
+  }, $, p, l && i.props, {
+    ownerState: x,
+    children: [l ? i.props.children : i, s ? /* @__PURE__ */ _("title", {
+      children: s
+    }) : null]
+  }));
+});
+process.env.NODE_ENV !== "production" && (y.propTypes = {
+  // ----------------------------- Warning --------------------------------
+  // | These PropTypes are generated from the TypeScript type definitions |
+  // |     To update them edit the d.ts file and run "yarn proptypes"     |
+  // ----------------------------------------------------------------------
+  /**
+   * Node passed into the SVG element.
+   */
+  children: o.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: o.object,
+  /**
+   * @ignore
+   */
+  className: o.string,
+  /**
+   * The color of the component.
+   * It supports both default and custom theme colors, which can be added as shown in the
+   * [palette customization guide](https://mui.com/material-ui/customization/palette/#custom-colors).
+   * You can use the `htmlColor` prop to apply a color attribute to the SVG element.
+   * @default 'inherit'
+   */
+  color: o.oneOfType([o.oneOf(["inherit", "action", "disabled", "primary", "secondary", "error", "info", "success", "warning"]), o.string]),
+  /**
+   * The component used for the root node.
+   * Either a string to use a HTML element or a component.
+   */
+  component: o.elementType,
+  /**
+   * The fontSize applied to the icon. Defaults to 24px, but can be configure to inherit font size.
+   * @default 'medium'
+   */
+  fontSize: o.oneOfType([o.oneOf(["inherit", "large", "medium", "small"]), o.string]),
+  /**
+   * Applies a color attribute to the SVG element.
+   */
+  htmlColor: o.string,
+  /**
+   * If `true`, the root node will inherit the custom `component`'s viewBox and the `viewBox`
+   * prop will be ignored.
+   * Useful when you want to reference a custom `component` and have `SvgIcon` pass that
+   * `component`'s viewBox to the root node.
+   * @default false
+   */
+  inheritViewBox: o.bool,
+  /**
+   * The shape-rendering attribute. The behavior of the different options is described on the
+   * [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/shape-rendering).
+   * If you are having issues with blurry icons you should investigate this prop.
+   */
+  shapeRendering: o.string,
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: o.oneOfType([o.arrayOf(o.oneOfType([o.func, o.object, o.bool])), o.func, o.object]),
+  /**
+   * Provides a human-readable title for the element that contains it.
+   * https://www.w3.org/TR/SVG-access/#Equivalent
+   */
+  titleAccess: o.string,
+  /**
+   * Allows you to redefine what the coordinates without units mean inside an SVG element.
+   * For example, if the SVG element is 500 (width) by 200 (height),
+   * and you pass viewBox="0 0 50 20",
+   * this means that the coordinates inside the SVG will go from the top left corner (0,0)
+   * to bottom right (50,20) and each unit will be worth 10px.
+   * @default '0 0 24 24'
+   */
+  viewBox: o.string
+});
+y.muiName = "SvgIcon";
+function P(e, n) {
+  function t(r, i) {
+    return /* @__PURE__ */ _(y, S({
+      "data-testid": `${n}Icon`,
+      ref: i
+    }, r, {
+      children: e
+    }));
+  }
+  return process.env.NODE_ENV !== "production" && (t.displayName = `${n}Icon`), t.muiName = y.muiName, /* @__PURE__ */ v.memo(/* @__PURE__ */ v.forwardRef(t));
+}
+export {
+  P as c
+};

package/dist/index.js

@@ -1,6 +1,7 @@
-import { default as e } from "./components/BasicButtons/BasicButtons.js";
-import { default as r } from "./components/AnotherComponent/AnotherComponent.js";
+import "./assets/index.css";
+import { default as r } from "./components/Button/Button.js";
+import { default as f } from "./components/SearchField/SearchField.js";
 export {
-  r as AnotherComponent,
-  e as BasicButtons
+  r as Button,
+  f as SearchField
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cgi-learning-hub/ui",
-  "version": "0.0.1-dev.1706567478",
+  "version": "0.0.1-dev.1706796454",
   "private": false,
   "author": "CGI Learning-hub Team",
   "description": "@cgi-learning-hub/ui is an open-source React component library that implements UI for HUB's features",
@@ -30,6 +30,8 @@
   ],
   "devDependencies": {
     "@mui/material": "5.15.0",
+    "@mui/styles": "5.15.0",
+    "@mui/icons-material": "5.15.0",
     "@emotion/react": "11.11.1",
     "@emotion/styled": "11.11.0",
     "autoprefixer": "10.4.17",

package/dist/assets/AnotherComponent.css

@@ -1 +0,0 @@
-*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.rounded{border-radius:.25rem}.bg-blue-500{--tw-bg-opacity: 1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.font-bold{font-weight:700}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.hover\:bg-blue-700:hover{--tw-bg-opacity: 1;background-color:rgb(29 78 216 / var(--tw-bg-opacity))}

package/dist/components/AnotherComponent/AnotherComponent.d.ts

@@ -1,2 +0,0 @@
-declare const AnotherComponent: () => import("react/jsx-runtime").JSX.Element;
-export default AnotherComponent;

package/dist/components/AnotherComponent/AnotherComponent.js

@@ -1,6 +0,0 @@
-import "../../assets/AnotherComponent.css";
-import { jsx as o } from "react/jsx-runtime";
-const n = () => /* @__PURE__ */ o("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded", children: "Click me from AnotherComponent" });
-export {
-  n as default
-};

package/dist/components/AnotherComponent/AnotherComponent.stories.d.ts

@@ -1,5 +0,0 @@
-import { StoryFn, Meta } from '@storybook/react';
-declare const stories: Meta<StoryFn<any>>;
-export declare const Primary: any;
-export declare const Secondary: any;
-export default stories;

package/dist/components/AnotherComponent/AnotherComponent.stories.js

@@ -1,22 +0,0 @@
-import { jsx as e } from "react/jsx-runtime";
-import o from "./AnotherComponent.js";
-const p = {
-  title: "Components/AnotherComponent",
-  component: o,
-  argTypes: {
-    // Définissez ici vos paramètres d'histoires spécifiques aux arguments (args).
-  }
-}, t = (n) => /* @__PURE__ */ e(o, { ...n }), r = t.bind({});
-r.args = {
-  label: "Primary Button"
-};
-const a = t.bind({});
-a.args = {
-  label: "Secondary Button",
-  secondary: !0
-};
-export {
-  r as Primary,
-  a as Secondary,
-  p as default
-};

package/dist/components/AnotherComponent/index.d.ts

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

package/dist/components/AnotherComponent/index.js

@@ -1,4 +0,0 @@
-import { default as t } from "./AnotherComponent.js";
-export {
-  t as AnotherComponent
-};

package/dist/components/BasicButtons/BasicButtons.d.ts

@@ -1,2 +0,0 @@
-declare const BasicButtons: () => import("react/jsx-runtime").JSX.Element;
-export default BasicButtons;