@cgi-learning-hub/ui 1.3.2 → 1.3.3-dev.1732021842

package/dist/components/stories/RadioGroup.stories.es.js

@@ -0,0 +1,434 @@
+import { jsx as t, jsxs as P } from "react/jsx-runtime";
+import { e as J, F as K, a as Z } from "../../FormLabel-B4QlkhhB.js";
+import * as l from "react";
+import { P as e, J as j, I as B, L as y, n as x, K as M } from "../../identifier-BqadgaK7.js";
+import { u as A } from "../../useControlled-BYdyS7Pn.js";
+import { u as Q } from "../../useForkRef-D-DyzOXj.js";
+import { u as W } from "../../useId-CK6Kn3Tn.js";
+import { a as X, F as I } from "../../FormGroup-BVtE8Mrv.js";
+import { s as C, r as U, u as Y, c as D } from "../../DefaultPropsProvider-CaRoy5OV.js";
+import { S as oo } from "../../SwitchBase-yCuH0Tqk.js";
+import { c as q } from "../../createSvgIcon-DxbvMQd7.js";
+import { m as L } from "../../memoTheme-DfGVDRrB.js";
+import { u as eo } from "../../useFormControl-CatNKXAi.js";
+import { c as $ } from "../../createSimplePaletteValueFilter-B7--0ryQ.js";
+import { r as ao } from "../../refType-DlHf9HvO.js";
+const to = q(/* @__PURE__ */ t("path", {
+  d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"
+}), "RadioButtonUnchecked"), ro = q(/* @__PURE__ */ t("path", {
+  d: "M8.465 8.465C9.37 7.56 10.62 7 12 7C14.76 7 17 9.24 17 12C17 13.38 16.44 14.63 15.535 15.535C14.63 16.44 13.38 17 12 17C9.24 17 7 14.76 7 12C7 10.62 7.56 9.37 8.465 8.465Z"
+}), "RadioButtonChecked"), so = C("span", {
+  shouldForwardProp: U
+})({
+  position: "relative",
+  display: "flex"
+}), no = C(to)({
+  // Scale applied to prevent dot misalignment in Safari
+  transform: "scale(1)"
+}), io = C(ro)(L(({
+  theme: o
+}) => ({
+  left: 0,
+  position: "absolute",
+  transform: "scale(0)",
+  transition: o.transitions.create("transform", {
+    easing: o.transitions.easing.easeIn,
+    duration: o.transitions.duration.shortest
+  }),
+  variants: [{
+    props: {
+      checked: !0
+    },
+    style: {
+      transform: "scale(1)",
+      transition: o.transitions.create("transform", {
+        easing: o.transitions.easing.easeOut,
+        duration: o.transitions.duration.shortest
+      })
+    }
+  }]
+})));
+function F(o) {
+  const {
+    checked: a = !1,
+    classes: r = {},
+    fontSize: s
+  } = o, i = {
+    ...o,
+    checked: a
+  };
+  return /* @__PURE__ */ P(so, {
+    className: r.root,
+    ownerState: i,
+    children: [/* @__PURE__ */ t(no, {
+      fontSize: s,
+      className: r.background,
+      ownerState: i
+    }), /* @__PURE__ */ t(io, {
+      fontSize: s,
+      className: r.dot,
+      ownerState: i
+    })]
+  });
+}
+process.env.NODE_ENV !== "production" && (F.propTypes = {
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: e.bool,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   */
+  fontSize: e.oneOf(["small", "medium"])
+});
+const G = /* @__PURE__ */ l.createContext(void 0);
+process.env.NODE_ENV !== "production" && (G.displayName = "RadioGroupContext");
+function lo() {
+  return l.useContext(G);
+}
+function co(o) {
+  return B("MuiRadio", o);
+}
+const E = j("MuiRadio", ["root", "checked", "disabled", "colorPrimary", "colorSecondary", "sizeSmall"]), uo = (o) => {
+  const {
+    classes: a,
+    color: r,
+    size: s
+  } = o, i = {
+    root: ["root", `color${y(r)}`, s !== "medium" && `size${y(s)}`]
+  };
+  return {
+    ...a,
+    ...D(i, co, a)
+  };
+}, po = C(oo, {
+  shouldForwardProp: (o) => U(o) || o === "classes",
+  name: "MuiRadio",
+  slot: "Root",
+  overridesResolver: (o, a) => {
+    const {
+      ownerState: r
+    } = o;
+    return [a.root, r.size !== "medium" && a[`size${y(r.size)}`], a[`color${y(r.color)}`]];
+  }
+})(L(({
+  theme: o
+}) => ({
+  color: (o.vars || o).palette.text.secondary,
+  [`&.${E.disabled}`]: {
+    color: (o.vars || o).palette.action.disabled
+  },
+  variants: [{
+    props: {
+      color: "default",
+      disabled: !1,
+      disableRipple: !1
+    },
+    style: {
+      "&:hover": {
+        backgroundColor: o.vars ? `rgba(${o.vars.palette.action.activeChannel} / ${o.vars.palette.action.hoverOpacity})` : x(o.palette.action.active, o.palette.action.hoverOpacity)
+      }
+    }
+  }, ...Object.entries(o.palette).filter($()).map(([a]) => ({
+    props: {
+      color: a,
+      disabled: !1,
+      disableRipple: !1
+    },
+    style: {
+      "&:hover": {
+        backgroundColor: o.vars ? `rgba(${o.vars.palette[a].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : x(o.palette[a].main, o.palette.action.hoverOpacity)
+      }
+    }
+  })), ...Object.entries(o.palette).filter($()).map(([a]) => ({
+    props: {
+      color: a,
+      disabled: !1
+    },
+    style: {
+      [`&.${E.checked}`]: {
+        color: (o.vars || o).palette[a].main
+      }
+    }
+  })), {
+    // Should be last to override other colors
+    props: {
+      disableRipple: !1
+    },
+    style: {
+      // Reset on touch devices, it doesn't add specificity
+      "&:hover": {
+        "@media (hover: none)": {
+          backgroundColor: "transparent"
+        }
+      }
+    }
+  }]
+})));
+function fo(o, a) {
+  return typeof a == "object" && a !== null ? o === a : String(o) === String(a);
+}
+const T = /* @__PURE__ */ t(F, {
+  checked: !0
+}), V = /* @__PURE__ */ t(F, {}), g = /* @__PURE__ */ l.forwardRef(function(a, r) {
+  const s = Y({
+    props: a,
+    name: "MuiRadio"
+  }), {
+    checked: i,
+    checkedIcon: h = T,
+    color: S = "primary",
+    icon: k = V,
+    name: d,
+    onChange: w,
+    size: u = "medium",
+    className: p,
+    disabled: z,
+    disableRipple: m = !1,
+    ...b
+  } = s, v = eo();
+  let c = z;
+  v && typeof c > "u" && (c = v.disabled), c ?? (c = !1);
+  const R = {
+    ...s,
+    disabled: c,
+    disableRipple: m,
+    color: S,
+    size: u
+  }, n = uo(R), f = lo();
+  let O = i;
+  const H = J(w, f && f.onChange);
+  let N = d;
+  return f && (typeof O > "u" && (O = fo(f.value, s.value)), typeof N > "u" && (N = f.name)), /* @__PURE__ */ t(po, {
+    type: "radio",
+    icon: /* @__PURE__ */ l.cloneElement(k, {
+      fontSize: V.props.fontSize ?? u
+    }),
+    checkedIcon: /* @__PURE__ */ l.cloneElement(h, {
+      fontSize: T.props.fontSize ?? u
+    }),
+    disabled: c,
+    ownerState: R,
+    classes: n,
+    name: N,
+    checked: O,
+    onChange: H,
+    ref: r,
+    className: M(n.root, p),
+    ...b
+  });
+});
+process.env.NODE_ENV !== "production" && (g.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * If `true`, the component is checked.
+   */
+  checked: e.bool,
+  /**
+   * The icon to display when the component is checked.
+   * @default <RadioButtonIcon checked />
+   */
+  checkedIcon: e.node,
+  /**
+   * Override or extend the styles applied to the component.
+   */
+  classes: e.object,
+  /**
+   * @ignore
+   */
+  className: e.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).
+   * @default 'primary'
+   */
+  color: e.oneOfType([e.oneOf(["default", "primary", "secondary", "error", "info", "success", "warning"]), e.string]),
+  /**
+   * If `true`, the component is disabled.
+   */
+  disabled: e.bool,
+  /**
+   * If `true`, the ripple effect is disabled.
+   * @default false
+   */
+  disableRipple: e.bool,
+  /**
+   * The icon to display when the component is unchecked.
+   * @default <RadioButtonIcon />
+   */
+  icon: e.node,
+  /**
+   * The id of the `input` element.
+   */
+  id: e.string,
+  /**
+   * [Attributes](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input#Attributes) applied to the `input` element.
+   */
+  inputProps: e.object,
+  /**
+   * Pass a ref to the `input` element.
+   */
+  inputRef: ao,
+  /**
+   * Name attribute of the `input` element.
+   */
+  name: e.string,
+  /**
+   * Callback fired when the state is changed.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   * You can pull out the new checked state by accessing `event.target.checked` (boolean).
+   */
+  onChange: e.func,
+  /**
+   * If `true`, the `input` element is required.
+   * @default false
+   */
+  required: e.bool,
+  /**
+   * The size of the component.
+   * `small` is equivalent to the dense radio styling.
+   * @default 'medium'
+   */
+  size: e.oneOfType([e.oneOf(["medium", "small"]), e.string]),
+  /**
+   * The system prop that allows defining system overrides as well as additional CSS styles.
+   */
+  sx: e.oneOfType([e.arrayOf(e.oneOfType([e.func, e.object, e.bool])), e.func, e.object]),
+  /**
+   * The value of the component. The DOM API casts this to a string.
+   */
+  value: e.any
+});
+function mo(o) {
+  return B("MuiRadioGroup", o);
+}
+j("MuiRadioGroup", ["root", "row", "error"]);
+const bo = (o) => {
+  const {
+    classes: a,
+    row: r,
+    error: s
+  } = o;
+  return D({
+    root: ["root", r && "row", s && "error"]
+  }, mo, a);
+}, _ = /* @__PURE__ */ l.forwardRef(function(a, r) {
+  const {
+    // private
+    // eslint-disable-next-line react/prop-types
+    actions: s,
+    children: i,
+    className: h,
+    defaultValue: S,
+    name: k,
+    onChange: d,
+    value: w,
+    ...u
+  } = a, p = l.useRef(null), z = bo(a), [m, b] = A({
+    controlled: w,
+    default: S,
+    name: "RadioGroup"
+  });
+  l.useImperativeHandle(s, () => ({
+    focus: () => {
+      let n = p.current.querySelector("input:not(:disabled):checked");
+      n || (n = p.current.querySelector("input:not(:disabled)")), n && n.focus();
+    }
+  }), []);
+  const v = Q(r, p), c = W(k), R = l.useMemo(() => ({
+    name: c,
+    onChange(n) {
+      b(n.target.value), d && d(n, n.target.value);
+    },
+    value: m
+  }), [c, d, b, m]);
+  return /* @__PURE__ */ t(G.Provider, {
+    value: R,
+    children: /* @__PURE__ */ t(X, {
+      role: "radiogroup",
+      ref: v,
+      className: M(z.root, h),
+      ...u,
+      children: i
+    })
+  });
+});
+process.env.NODE_ENV !== "production" && (_.propTypes = {
+  // ┌────────────────────────────── Warning ──────────────────────────────┐
+  // │ These PropTypes are generated from the TypeScript type definitions. │
+  // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
+  // └─────────────────────────────────────────────────────────────────────┘
+  /**
+   * The content of the component.
+   */
+  children: e.node,
+  /**
+   * @ignore
+   */
+  className: e.string,
+  /**
+   * The default value. Use when the component is not controlled.
+   */
+  defaultValue: e.any,
+  /**
+   * The name used to reference the value of the control.
+   * If you don't provide this prop, it falls back to a randomly generated name.
+   */
+  name: e.string,
+  /**
+   * Callback fired when a radio button is selected.
+   *
+   * @param {React.ChangeEvent<HTMLInputElement>} event The event source of the callback.
+   * @param {string} value The value of the selected radio button.
+   * You can pull out the new value by accessing `event.target.value` (string).
+   */
+  onChange: e.func,
+  /**
+   * Value of the selected radio button. The DOM API casts this to a string.
+   */
+  value: e.any
+});
+const vo = (o) => /* @__PURE__ */ P(K, { children: [
+  /* @__PURE__ */ t(Z, { id: "radio-buttons-group-label", children: "Label" }),
+  /* @__PURE__ */ P(
+    _,
+    {
+      "aria-labelledby": "radio-buttons-group-label",
+      defaultValue: "first",
+      name: "radio-buttons-group",
+      ...o,
+      children: [
+        /* @__PURE__ */ t(I, { value: "first", control: /* @__PURE__ */ t(g, {}), label: "First" }),
+        /* @__PURE__ */ t(I, { value: "second", control: /* @__PURE__ */ t(g, {}), label: "Second" }),
+        /* @__PURE__ */ t(I, { value: "third", control: /* @__PURE__ */ t(g, {}), label: "Third" })
+      ]
+    }
+  )
+] }), Go = {
+  title: "Components/RadioGroup",
+  component: vo
+}, xo = {
+  args: {
+    row: !1
+  }
+}, $o = {
+  args: {
+    row: !0
+  }
+};
+export {
+  xo as Default,
+  $o as Row,
+  Go as default
+};

package/dist/components/stories/SearchInput.stories.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("../SearchInput/SearchInput.cjs.js"),t={title:"Components/SearchInput",component:e},o={args:{placeholder:"Rechercher"}};exports.Default=o;exports.default=t;

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

@@ -0,0 +1,6 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { SearchInput } from '../SearchInput';
+declare const meta: Meta<typeof SearchInput>;
+export default meta;
+type Story = StoryObj<typeof SearchInput>;
+export declare const Default: Story;

package/dist/components/stories/SearchInput.stories.es.js

@@ -0,0 +1,13 @@
+import e from "../SearchInput/SearchInput.es.js";
+const o = {
+  title: "Components/SearchInput",
+  component: e
+}, r = {
+  args: {
+    placeholder: "Rechercher"
+  }
+};
+export {
+  r as Default,
+  o as default
+};

package/dist/components/stories/Select.stories.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const e=require("react/jsx-runtime"),d=require("react"),u=require("../../FormLabel-D8jYibc1.cjs"),l=require("../../Select-ipcMZ4iK.cjs"),t=require("../../MenuItem-Els-vJZW.cjs"),c=n=>{const[a,s]=d.useState("pending"),i=r=>s(r.target.value);return e.jsxs(u.FormControl,{variant:n.variant,sx:{width:"10rem"},children:[e.jsx(l.InputLabel,{id:"simple-select-label",children:"Status"}),e.jsxs(l.Select,{labelId:"simple-select-label",id:"simple-select",value:a,label:"Status",onChange:i,...n,children:[e.jsx(t.MenuItem,{value:"pending",children:"Pending"}),e.jsx(t.MenuItem,{value:"ongoing",children:"Ongoing"}),e.jsx(t.MenuItem,{value:"validated",children:"Validated"}),e.jsx(t.MenuItem,{value:"rejected",children:"Rejected"})]})]})},o={title:"Components/Select",component:c},g={args:{}},m={args:{variant:"filled"}},v={args:{variant:"standard"}},S={args:{disabled:!0}};exports.Default=g;exports.Disabled=S;exports.Filled=m;exports.Standard=v;exports.default=o;

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

@@ -0,0 +1,10 @@
+import { SelectProps } from '@mui/material/Select';
+import { Meta, StoryObj } from '@storybook/react';
+declare const Select: (props: SelectProps) => import("react/jsx-runtime").JSX.Element;
+declare const meta: Meta<typeof Select>;
+export default meta;
+type Story = StoryObj<typeof Select>;
+export declare const Default: Story;
+export declare const Filled: Story;
+export declare const Standard: Story;
+export declare const Disabled: Story;

package/dist/components/stories/Select.stories.es.js

@@ -0,0 +1,52 @@
+import { jsxs as l, jsx as e } from "react/jsx-runtime";
+import { useState as d } from "react";
+import { F as o } from "../../FormLabel-B4QlkhhB.js";
+import { a as c, S as m } from "../../Select-BlPQngVF.js";
+import { M as t } from "../../MenuItem-D7HWYhF3.js";
+const u = (a) => {
+  const [n, s] = d("pending"), r = (i) => s(i.target.value);
+  return /* @__PURE__ */ l(o, { variant: a.variant, sx: { width: "10rem" }, children: [
+    /* @__PURE__ */ e(c, { id: "simple-select-label", children: "Status" }),
+    /* @__PURE__ */ l(
+      m,
+      {
+        labelId: "simple-select-label",
+        id: "simple-select",
+        value: n,
+        label: "Status",
+        onChange: r,
+        ...a,
+        children: [
+          /* @__PURE__ */ e(t, { value: "pending", children: "Pending" }),
+          /* @__PURE__ */ e(t, { value: "ongoing", children: "Ongoing" }),
+          /* @__PURE__ */ e(t, { value: "validated", children: "Validated" }),
+          /* @__PURE__ */ e(t, { value: "rejected", children: "Rejected" })
+        ]
+      }
+    )
+  ] });
+}, f = {
+  title: "Components/Select",
+  component: u
+}, b = {
+  args: {}
+}, j = {
+  args: {
+    variant: "filled"
+  }
+}, x = {
+  args: {
+    variant: "standard"
+  }
+}, C = {
+  args: {
+    disabled: !0
+  }
+};
+export {
+  b as Default,
+  C as Disabled,
+  j as Filled,
+  x as Standard,
+  f as default
+};

package/dist/components/stories/TabList.stories.cjs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const s=require("react/jsx-runtime"),O=require("react"),r=require("../../identifier-BQH88SE0.cjs"),d=require("../../Tabs-Nvk94RTW.cjs"),P=require("../../DefaultPropsProvider-BrX6iuA3.cjs"),E=require("../../useThemeProps-r0DnR8FJ.cjs");function M(e){const n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});if(e){for(const t in e)if(t!=="default"){const o=Object.getOwnPropertyDescriptor(e,t);Object.defineProperty(n,t,o.get?o:{enumerable:!0,get:()=>e[t]})}}return n.default=e,Object.freeze(n)}const a=M(O),f=a.createContext(null);process.env.NODE_ENV!=="production"&&(f.displayName="TabContext");function D(){const[e,n]=a.useState(null);return a.useEffect(()=>{n(`mui-p-${Math.round(Math.random()*1e5)}`)},[]),e}function y(e){const{children:n,value:t}=e,o=D(),p=a.useMemo(()=>({idPrefix:o,value:t}),[o,t]);return s.jsx(f.Provider,{value:p,children:n})}process.env.NODE_ENV!=="production"&&(y.propTypes={children:r.PropTypes.node,value:r.PropTypes.oneOfType([r.PropTypes.number,r.PropTypes.string]).isRequired});function v(){return a.useContext(f)}function x(e,n){const{idPrefix:t}=e;return t===null?null:`${e.idPrefix}-P-${n}`}function m(e,n){const{idPrefix:t}=e;return t===null?null:`${e.idPrefix}-T-${n}`}const h=a.forwardRef(function(n,t){const{children:o,...p}=n,i=v();if(i===null)throw new TypeError("No TabContext provided");const l=a.Children.map(o,u=>a.isValidElement(u)?a.cloneElement(u,{"aria-controls":x(i,u.props.value),id:m(i,u.props.value)}):null);return s.jsx(d.Tabs,{...p,ref:t,value:i.value,children:l})});process.env.NODE_ENV!=="production"&&(h.propTypes={children:r.PropTypes.node});function R(e){return r.generateUtilityClass("MuiTabPanel",e)}r.generateUtilityClasses("MuiTabPanel",["root","hidden"]);const q=e=>{const{classes:n,hidden:t}=e,o={root:["root",t&&"hidden"]};return P.composeClasses(o,R,n)},w=P.styled("div",{name:"MuiTabPanel",slot:"Root",overridesResolver:(e,n)=>n.root})(({theme:e})=>({padding:e.spacing(3)})),T=a.forwardRef(function(n,t){const o=E.useThemeProps({props:n,name:"MuiTabPanel"}),{children:p,className:i,value:l,keepMounted:u=!1,...j}=o,b={...o},g=q(b),c=v();if(c===null)throw new TypeError("No TabContext provided");const C=x(c,l),N=m(c,l);return s.jsx(w,{"aria-labelledby":N,className:r.clsx(g.root,i),hidden:l!==c.value,id:C,ref:t,role:"tabpanel",ownerState:b,...j,children:(u||l===c.value)&&p})});process.env.NODE_ENV!=="production"&&(T.propTypes={children:r.PropTypes.node,classes:r.PropTypes.object,className:r.PropTypes.string,keepMounted:r.PropTypes.bool,sx:r.PropTypes.oneOfType([r.PropTypes.arrayOf(r.PropTypes.oneOfType([r.PropTypes.func,r.PropTypes.object,r.PropTypes.bool])),r.PropTypes.func,r.PropTypes.object]),value:r.PropTypes.oneOfType([r.PropTypes.number,r.PropTypes.string]).isRequired});const _=e=>s.jsxs(y,{value:"1",children:[s.jsxs(h,{...e,"aria-label":"lab API tabs example",children:[s.jsx(d.Tab,{label:"Utilisateurs",value:"1"}),s.jsx(d.Tab,{label:"Groupes",value:"2"}),s.jsx(d.Tab,{label:"Demandes d'inscription",value:"3"})]}),s.jsx(T,{value:"1",children:"Utilisateurs"}),s.jsx(T,{value:"2",children:"Groupes"}),s.jsx(T,{value:"3",children:"Demandes d'inscription"})]}),S={title:"Components/TabList",component:_},U={args:{}};exports.Default=U;exports.default=S;

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

@@ -0,0 +1,7 @@
+import { TabListProps } from '@mui/lab/TabList';
+import { Meta, StoryObj } from '@storybook/react';
+declare const TabList: (props: TabListProps) => import("react/jsx-runtime").JSX.Element;
+declare const meta: Meta<typeof TabList>;
+export default meta;
+type Story = StoryObj<typeof TabList>;
+export declare const Default: Story;