odaptos_design_system 2.0.4 → 2.0.6

package/LICENSE

@@ -1,21 +1,21 @@
-MIT License
-
-Copyright (c) 2023 Odaptos
-
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
-
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
-
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+MIT License
+
+Copyright (c) 2023 Odaptos
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 SOFTWARE.

package/README.md

@@ -1,112 +1,112 @@
-# Odaptos Design System
-
-## Commands
-
-TSDX scaffolds your new library inside `/src`, and also sets up a [Parcel-based](https://parceljs.org) playground for it inside `/example`.
-
-The recommended workflow is to run TSDX in one terminal:
-
-```bash
-npm start # or yarn start
-```
-
-This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.
-
-Then run either Storybook or the example playground:
-
-### Storybook
-
-Run inside another terminal:
-
-```bash
-yarn storybook
-```
-
-This loads the stories from `./stories`.
-
-> NOTE: Stories should reference the components as if using the library, similar to the example playground. This means importing from the root project directory. This has been aliased in the tsconfig and the storybook webpack config as a helper.
-
-### Example
-
-Then run the example inside another:
-
-```bash
-cd example
-npm i # or yarn to install dependencies
-npm start # or yarn start
-```
-
-The default example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure TSDX is running in watch mode like we recommend above. **No symlinking required**, we use [Parcel's aliasing](https://parceljs.org/module_resolution.html#aliases).
-
-To do a one-off build, use `npm run build` or `yarn build`.
-
-To run tests, use `npm test` or `yarn test`.
-
-### Bundle analysis
-
-Calculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyze`.
-
-#### Setup Files
-
-This is the folder structure we set up for you:
-
-```txt
-/example
-  index.html
-  index.tsx       # test your component here in a demo app
-  package.json
-  tsconfig.json
-/src
-  index.tsx       # EDIT THIS
-/test
-  blah.test.tsx   # EDIT THIS
-/stories
-  Thing.stories.tsx # EDIT THIS
-/.storybook
-  main.js
-  preview.js
-.gitignore
-package.json
-README.md         # EDIT THIS
-tsconfig.json
-```
-
-### TypeScript
-
-`tsconfig.json` is set up to interpret `dom` and `esnext` types, as well as `react` for `jsx`. Adjust according to your needs.
-
-## Named Exports
-
-Per Palmer Group guidelines, [always use named exports.](https://github.com/palmerhq/typescript#exports) Code split inside your React app instead of your React library.
-
-## Publishing to NPM
-
-Are you connected to npm locally? Go directly to the next step.
-
-1/ To connect to npm from a terminal, follow these steps:
-
-Install Node.js and npm: If you haven't already installed Node.js, download and install the latest version from the official Node.js website. npm is usually installed automatically with Node.js.
-
-Open a terminal
-
-Login to npm: Use the following command to login to npm:
-
-`npm login`
-
-You will be prompted to enter your username, password and e-mail address. Be sure to use the correct credentials associated with your npm account.
-
-Once you've followed these steps, you should be connected to npm via your terminal. You can now publish packages, install packages from the npm registry, or perform other npm-related operations.
-
-2/ Publish the package
-`npm version minor / major / patch` -> For the moment, we're only using the 'patch'.
-`git push`
-`npm publish`
-
-For the moment, only m.trambert@odaptos.com & l.obriot@odaptos can publish the package.
-
-## How to use this package ?
-
-`npm install odaptos_design_system`
-And next just import the component like :
-`import { Button } from 'odaptos_design_system';`
-`<Button>Hello</Button>`
+# Odaptos Design System
+
+## Commands
+
+TSDX scaffolds your new library inside `/src`, and also sets up a [Parcel-based](https://parceljs.org) playground for it inside `/example`.
+
+The recommended workflow is to run TSDX in one terminal:
+
+```bash
+npm start # or yarn start
+```
+
+This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.
+
+Then run either Storybook or the example playground:
+
+### Storybook
+
+Run inside another terminal:
+
+```bash
+yarn storybook
+```
+
+This loads the stories from `./stories`.
+
+> NOTE: Stories should reference the components as if using the library, similar to the example playground. This means importing from the root project directory. This has been aliased in the tsconfig and the storybook webpack config as a helper.
+
+### Example
+
+Then run the example inside another:
+
+```bash
+cd example
+npm i # or yarn to install dependencies
+npm start # or yarn start
+```
+
+The default example imports and live reloads whatever is in `/dist`, so if you are seeing an out of date component, make sure TSDX is running in watch mode like we recommend above. **No symlinking required**, we use [Parcel's aliasing](https://parceljs.org/module_resolution.html#aliases).
+
+To do a one-off build, use `npm run build` or `yarn build`.
+
+To run tests, use `npm test` or `yarn test`.
+
+### Bundle analysis
+
+Calculates the real cost of your library using [size-limit](https://github.com/ai/size-limit) with `npm run size` and visulize it with `npm run analyze`.
+
+#### Setup Files
+
+This is the folder structure we set up for you:
+
+```txt
+/example
+  index.html
+  index.tsx       # test your component here in a demo app
+  package.json
+  tsconfig.json
+/src
+  index.tsx       # EDIT THIS
+/test
+  blah.test.tsx   # EDIT THIS
+/stories
+  Thing.stories.tsx # EDIT THIS
+/.storybook
+  main.js
+  preview.js
+.gitignore
+package.json
+README.md         # EDIT THIS
+tsconfig.json
+```
+
+### TypeScript
+
+`tsconfig.json` is set up to interpret `dom` and `esnext` types, as well as `react` for `jsx`. Adjust according to your needs.
+
+## Named Exports
+
+Per Palmer Group guidelines, [always use named exports.](https://github.com/palmerhq/typescript#exports) Code split inside your React app instead of your React library.
+
+## Publishing to NPM
+
+Are you connected to npm locally? Go directly to the next step.
+
+1/ To connect to npm from a terminal, follow these steps:
+
+Install Node.js and npm: If you haven't already installed Node.js, download and install the latest version from the official Node.js website. npm is usually installed automatically with Node.js.
+
+Open a terminal
+
+Login to npm: Use the following command to login to npm:
+
+`npm login`
+
+You will be prompted to enter your username, password and e-mail address. Be sure to use the correct credentials associated with your npm account.
+
+Once you've followed these steps, you should be connected to npm via your terminal. You can now publish packages, install packages from the npm registry, or perform other npm-related operations.
+
+2/ Publish the package
+`npm version minor / major / patch` -> For the moment, we're only using the 'patch'.
+`git push`
+`npm publish`
+
+For the moment, only m.trambert@odaptos.com & l.obriot@odaptos can publish the package.
+
+## How to use this package ?
+
+`npm install odaptos_design_system`
+And next just import the component like :
+`import { Button } from 'odaptos_design_system';`
+`<Button>Hello</Button>`

package/dist/DesignTokens/Icons/Illustrations/Non_Moderated.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { SvgIconProps } from '@mui/material';
+export default function Non_Moderated({ ...rest }: SvgIconProps): React.JSX.Element;

package/dist/DesignTokens/Icons/index.d.ts

@@ -46,6 +46,7 @@ export { default as InterviewTranscriptGreen } from './Illustrations/InterviewTr
 export { default as MenShowingSomething } from './Illustrations/MenShowingSomething';
 export { default as MetaAnalyse } from './Illustrations/MetaAnalyse';
 export { default as MetaAnalyse2 } from './Illustrations/MetaAnalyse2';
+export { default as Non_Moderated } from './Illustrations/Non_Moderated';
 export { default as OdaAccountPro } from './Illustrations/OdaAccountPro';
 export { default as OdaWaiting } from './Illustrations/OdaWaiting';
 export { default as ScheduleTasks } from './Illustrations/ScheduleTasks';

package/dist/odaptos_design_system.cjs.development.js

@@ -67,35 +67,6 @@ var css_248z = ".Accordion-modules_accordion__dz3L5{align-items:flex-start;backg
 var styles = {"accordion":"Accordion-modules_accordion__dz3L5","accordion_header":"Accordion-modules_accordion_header__lU2yY"};
 styleInject(css_248z);
 
-/** Figma link : https://www.figma.com/file/fjnhhbL12HvKccPmJchVnr/Atomic-Library?type=design&node-id=2760-23794&mode=dev  */
-const Accordion = ({
-  title,
-  children,
-  className,
-  icon,
-  ...props
-}) => {
-  const [isAccordionOpen, setIsAccordionOpen] = React.useState(false);
-  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
-    className: `${styles.accordion} ${className ?? ''}`
-  }), /*#__PURE__*/React__default.createElement("div", {
-    className: styles.accordion_header,
-    onClick: () => setIsAccordionOpen(prev => !prev)
-  }, /*#__PURE__*/React__default.createElement(Text, {
-    size: "base",
-    text: title,
-    weight: "bold"
-  }), /*#__PURE__*/React__default.createElement(IconButton, {
-    variant: "tertiary",
-    icon: icon ? icon : /*#__PURE__*/React__default.createElement(ArrowLineDowIcon, {
-      style: {
-        transform: isAccordionOpen ? 'rotate(180deg)' : 'rotate(0deg)',
-        transition: 'all 0.2s linear'
-      }
-    })
-  })), isAccordionOpen && /*#__PURE__*/React__default.createElement("div", null, children));
-};
-
 var css_248z$1 = ".Avatar-module_initialAvatar__RogI7{background:#e5f1ff}.Avatar-module_imgAvatar__9BC7p,.Avatar-module_initialAvatar__RogI7{align-items:center;border-radius:2.5rem;display:flex;height:2.5rem;justify-content:center;width:2.5rem}.Avatar-module_imgAvatar__9BC7p{background:transparent}.Avatar-module_imgAvatar__9BC7p img{border-radius:100%;height:100%;-o-object-fit:cover;object-fit:cover;width:100%}.Avatar-module_avatar_xs__6KODe{border-radius:1.5rem;height:1.5rem;max-height:1.5rem;max-width:1.5rem;min-height:1.5rem;min-width:1.5rem;width:1.5rem}.Avatar-module_avatar_sm__rGyel{border-radius:2rem;height:2rem;max-height:2rem;max-width:2rem;min-height:2rem;min-width:2rem;width:2rem}.Avatar-module_avatar_base__CetnR{border-radius:2.5rem;height:2.5rem;max-height:2.5rem;min-height:2.5rem;min-width:2.5rem;width:2.5rem}.Avatar-module_avatar_lg__WXo1U{border-radius:3rem;height:3rem;max-height:3rem;max-width:3rem;min-height:3rem;min-width:3rem;width:3rem}.Avatar-module_avatar_xl__i-QST{border-radius:3.5rem;height:3.5rem;max-height:3.5rem;max-width:3.5rem;min-height:3.5rem;min-width:3.5rem;width:3.5rem}";
 var styles$1 = {"initialAvatar":"Avatar-module_initialAvatar__RogI7","imgAvatar":"Avatar-module_imgAvatar__9BC7p","avatar_xs":"Avatar-module_avatar_xs__6KODe","avatar_sm":"Avatar-module_avatar_sm__rGyel","avatar_base":"Avatar-module_avatar_base__CetnR","avatar_lg":"Avatar-module_avatar_lg__WXo1U","avatar_xl":"Avatar-module_avatar_xl__i-QST"};
 styleInject(css_248z$1);
@@ -4283,6 +4254,101 @@ function MetaAnalyse2({
   })));
 }
 
+function Non_Moderated({
+  ...rest
+}) {
+  return /*#__PURE__*/React__default.createElement(material.SvgIcon, Object.assign({
+    strokeWidth: 0.1,
+    stroke: 'currentColor'
+  }, rest), /*#__PURE__*/React__default.createElement("svg", {
+    width: "144",
+    height: "104",
+    viewBox: "0 0 144 104",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, /*#__PURE__*/React__default.createElement("rect", {
+    x: "57",
+    y: "42",
+    width: "30",
+    height: "30",
+    rx: "3.15789",
+    fill: "#0077FF"
+  }), /*#__PURE__*/React__default.createElement("g", {
+    filter: "url(#filter0_d_4270_33535)"
+  }, /*#__PURE__*/React__default.createElement("path", {
+    "fill-rule": "evenodd",
+    "clip-rule": "evenodd",
+    d: "M80.7257 51.1779C80.7257 49.8928 81.7675 48.851 83.0526 48.851V55.8358L83.0522 55.8359C83.0522 58.7291 80.7082 61.0745 77.8167 61.0745C74.9253 61.0745 72.5813 58.7291 72.5813 55.8359C72.5813 52.9426 74.9253 50.5972 77.8167 50.5972C78.8932 50.5972 79.8937 50.9223 80.7257 51.4797V51.1779ZM66.1827 50.5972C69.0742 50.5972 71.4182 52.9426 71.4182 55.8359C71.4182 58.7291 69.0742 61.0745 66.1827 61.0745C63.2913 61.0745 60.9473 58.7291 60.9473 55.8359C60.9473 52.9426 63.2913 50.5972 66.1827 50.5972ZM66.1827 52.9255C64.5764 52.9255 63.2742 54.2285 63.2742 55.8359C63.2742 57.4432 64.5764 58.7462 66.1827 58.7462C67.7891 58.7462 69.0913 57.4432 69.0913 55.8359C69.0913 54.2285 67.7891 52.9255 66.1827 52.9255ZM77.8166 52.9255C76.2103 52.9255 74.908 54.2285 74.908 55.8359C74.908 57.4432 76.2103 58.7462 77.8166 58.7462C79.423 58.7462 80.7252 57.4432 80.7252 55.8359C80.7252 54.2285 79.423 52.9255 77.8166 52.9255ZM69.558 62.278L68.688 62.4859L67.9188 62.6573C67.9188 62.6573 67.6937 62.6985 67.6115 62.8029C67.5292 62.9073 67.7354 63.1393 67.7354 63.1393C67.7354 63.1393 69.1519 65.149 71.9271 65.149C74.8635 65.149 75.9693 63.3879 76.1589 63.086C76.1704 63.0678 76.1785 63.0549 76.1834 63.048C76.271 62.9265 76.2716 62.8698 76.2432 62.8029C76.2148 62.7359 76.0958 62.6908 76.0958 62.6908L74.7149 62.3782C74.7149 62.3782 74.2584 62.278 74.1709 62.2609C74.1055 62.2481 74.043 62.3103 73.9778 62.3753C73.9559 62.3971 73.9337 62.4193 73.911 62.439C73.9053 62.444 73.8973 62.4513 73.887 62.4608C73.7353 62.6013 73.0865 63.2021 71.9271 63.1696C70.7779 63.1373 70.3551 62.7969 70.1285 62.6145C70.1111 62.6005 70.0949 62.5874 70.0795 62.5755C69.9727 62.4923 69.9059 62.4241 69.8565 62.3736C69.8065 62.3225 69.7743 62.2897 69.7365 62.278C69.6615 62.2546 69.558 62.278 69.558 62.278Z",
+    fill: "white"
+  })), /*#__PURE__*/React__default.createElement("path", {
+    d: "M1 6C1 3.23858 3.23858 1 6 1H138C140.761 1 143 3.23858 143 6V15H1V6Z",
+    fill: "#EEEEEE"
+  }), /*#__PURE__*/React__default.createElement("rect", {
+    x: "0.5",
+    y: "0.5",
+    width: "143",
+    height: "103",
+    rx: "5.5",
+    stroke: "#26292E"
+  }), /*#__PURE__*/React__default.createElement("path", {
+    d: "M0.5 15H144",
+    stroke: "#26292E"
+  }), /*#__PURE__*/React__default.createElement("circle", {
+    cx: "9.5",
+    cy: "7.5",
+    r: "3",
+    fill: "white",
+    stroke: "#26292E"
+  }), /*#__PURE__*/React__default.createElement("circle", {
+    cx: "18.5",
+    cy: "7.5",
+    r: "3",
+    fill: "white",
+    stroke: "#26292E"
+  }), /*#__PURE__*/React__default.createElement("circle", {
+    cx: "27.5",
+    cy: "7.5",
+    r: "3",
+    fill: "white",
+    stroke: "#26292E"
+  }), /*#__PURE__*/React__default.createElement("defs", null, /*#__PURE__*/React__default.createElement("filter", {
+    id: "filter0_d_4270_33535",
+    x: "59.9604",
+    y: "48.6536",
+    width: "24.0792",
+    height: "18.2717",
+    filterUnits: "userSpaceOnUse",
+    "color-interpolation-filters": "sRGB"
+  }, /*#__PURE__*/React__default.createElement("feFlood", {
+    "flood-opacity": "0",
+    result: "BackgroundImageFix"
+  }), /*#__PURE__*/React__default.createElement("feColorMatrix", {
+    in: "SourceAlpha",
+    type: "matrix",
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0",
+    result: "hardAlpha"
+  }), /*#__PURE__*/React__default.createElement("feOffset", {
+    dy: "0.789474"
+  }), /*#__PURE__*/React__default.createElement("feGaussianBlur", {
+    stdDeviation: "0.493421"
+  }), /*#__PURE__*/React__default.createElement("feComposite", {
+    in2: "hardAlpha",
+    operator: "out"
+  }), /*#__PURE__*/React__default.createElement("feColorMatrix", {
+    type: "matrix",
+    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.08 0"
+  }), /*#__PURE__*/React__default.createElement("feBlend", {
+    mode: "normal",
+    in2: "BackgroundImageFix",
+    result: "effect1_dropShadow_4270_33535"
+  }), /*#__PURE__*/React__default.createElement("feBlend", {
+    mode: "normal",
+    in: "SourceGraphic",
+    in2: "effect1_dropShadow_4270_33535",
+    result: "shape"
+  })))));
+}
+
 function OdaAccountPro({
   ...rest
 }) {
@@ -14788,7 +14854,8 @@ const TabsUnderline = ({
         textTransform: 'none'
       },
       label: /*#__PURE__*/React__default.createElement("div", {
-        className: styles$M.tab_label_content
+        className: styles$M.tab_label_content,
+        id: item.id
       }, /*#__PURE__*/React__default.createElement(Title, {
         text: item.label,
         weight: value === index ? 'semi-bold' : 'regular',
@@ -14802,7 +14869,8 @@ const TabsUnderline = ({
     });
     if (item.disabled) {
       renderTab = /*#__PURE__*/React__default.createElement("div", {
-        className: styles$M.tab_label_content
+        className: styles$M.tab_label_content,
+        id: item.id
       }, /*#__PURE__*/React__default.createElement(Title, {
         key: `tab#${index}`,
         className: `${!isArrowIconDisplay ? styles$M.tab_label_replacement : styles$M.tab_label_replacement_icon} ${styles$M.disabled}`,
@@ -14824,6 +14892,7 @@ const TabsUnderline = ({
         placement: item.tooltipPlacement,
         arrow: true
       }, /*#__PURE__*/React__default.createElement("div", {
+        id: item.id,
         style: {
           width: 'fit-content',
           display: 'flex',
@@ -16344,6 +16413,35 @@ const UserIndicator = ({
   }));
 };
 
+/** Figma link : https://www.figma.com/file/fjnhhbL12HvKccPmJchVnr/Atomic-Library?type=design&node-id=2760-23794&mode=dev  */
+const Accordion = ({
+  title,
+  children,
+  className,
+  icon,
+  ...props
+}) => {
+  const [isAccordionOpen, setIsAccordionOpen] = React.useState(false);
+  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
+    className: `${styles.accordion} ${className ?? ''}`
+  }), /*#__PURE__*/React__default.createElement("div", {
+    className: styles.accordion_header,
+    onClick: () => setIsAccordionOpen(prev => !prev)
+  }, /*#__PURE__*/React__default.createElement(Text, {
+    size: "base",
+    text: title,
+    weight: "bold"
+  }), /*#__PURE__*/React__default.createElement(IconButton, {
+    variant: "tertiary",
+    icon: icon ? icon : /*#__PURE__*/React__default.createElement(ArrowLineDowIcon, {
+      style: {
+        transform: isAccordionOpen ? 'rotate(180deg)' : 'rotate(0deg)',
+        transition: 'all 0.2s linear'
+      }
+    })
+  })), isAccordionOpen && /*#__PURE__*/React__default.createElement("div", null, children));
+};
+
 exports.AI_UserTest = AI_UserTest;
 exports.Accordion = Accordion;
 exports.AccountIcon = AccountIcon;
@@ -16499,6 +16597,7 @@ exports.NbOfUsersIcon = NbOfUsersIcon;
 exports.NeutralBackgroudIcon = NeutralBackgroudIcon;
 exports.NoCameraIcon = NoCameraIcon;
 exports.NoMicrophoneIcon = NoMicrophoneIcon;
+exports.Non_Moderated = Non_Moderated;
 exports.NotifAlertIcon = NotifAlertIcon;
 exports.NotificationIcon = NotificationIcon;
 exports.NumberField = NumberField;