@axa-fr/design-system-look-and-feel-css 1.0.4 → 1.0.5-alpha.244

package/dist/look-and-feel.scss

@@ -1,35 +1,28 @@
 @use "common/tokens";
-@use "Grid/Grid";
-@use "Grid/DebugGrid";
 @use "Accordion/Accordion";
 @use "AccordionCore/AccordionCore";
-@use "Button/Button";
+@use "Alert/Alert";
 @use "Card/Card";
 @use "Divider/Divider";
 @use "Layout/Footer/Footer";
-@use "Stepper/Stepper";
-@use "Layout/Header/Header";
 @use "Form/Radio/Radio";
 @use "Tabs/Tabs";
 @use "Form/Checkbox/Checkbox";
 @use "Form/Select/Select";
-@use "Form/Text/Text";
-@use "Form/TextArea/TextArea";
 @use "Form/FileUpload/FileUpload";
 @use "Modal/Modal";
-@use "Alert/Alert";
-@use "Link/Link";
 @use "Pagination/Pagination";
 @use "Pagination/PaginationDesktop";
 @use "Pagination/PaginationMobile";
-@use "Loader/Loader";
 @use "./List/List";
-@use "List/ClickList/ClickList";
+@use "List/ClickItem/ClickItem";
 @use "./List/ContentItemDuo/ContentItemDuo";
 @use "List/ContentTabList/ContentTabList";
 @use "Tag/Tag";
 @use "Form/InputError/InputError";
 @use "IconBg/IconBg";
+@use "Layout/Header/BurgerMenu/BurgerMenu";
+@use "Layout/Header/Header";
 @use "Layout/Header/NavBar/NavBar";
 @use "Layout/Header/PreviousLink/PreviousLink";
 @use "Title/Title";

package/package.json

@@ -1,29 +1,33 @@
 {
   "name": "@axa-fr/design-system-look-and-feel-css",
-  "version": "1.0.4",
+  "version": "1.0.5-alpha.244",
   "description": "",
-  "main": "index.js",
+  "sass": "dist/look-and-feel.scss",
+  "style": "dist/look-and-feel.css",
+  "exports": {
+    "./logo-axa.svg": "./files/assets/logo-axa.svg",
+    "./dist/common/assets/logo-axa.svg": "./files/assets/logo-axa.svg",
+    "./dist/*": {
+      "default": "./dist/*"
+    }
+  },
   "files": [
-    "dist"
+    "dist",
+    "files"
   ],
   "scripts": {
     "prebuild": "rimraf dist",
-    "start": "postcss \"src/**/*.scss\" --base src --dir dist --ext css --verbose --watch --config ../../config/postcss.config.js",
-    "build": "postcss \"src/**/*.scss\" --base src --dir dist --ext css --verbose --env production --config ../../config/postcss.config.js",
-    "start:storybook": "storybook dev -p 6008",
-    "build:storybook": "storybook build",
-    "build-storybook": "storybook build",
-    "eslint": "eslint src --ext js,jsx,ts,tsx",
-    "eslint:fix": "eslint src --ext js,jsx,ts,tsx --fix",
+    "build": "postcss \"src/**/*.scss\" --base src --dir dist --ext css --verbose --env production",
+    "postbuild": "copyfiles --up 1 \"src/**/*.{scss,css}\" dist",
     "stylelint": "stylelint \"src/**/*.{scss,css}\"",
-    "stylelint:fix": "stylelint \"src/**/*.{scss,css}\" --fix",
-    "prettier": "prettier \"src/**/*.!(js|jsx|ts|tsx|scss|css)\" --check --ignore-unknown",
-    "prettier:fix": "prettier \"src/**/*.!(js|jsx|ts|tsx|scss|css)\" --write --ignore-unknown",
-    "tsc": "tsc --noEmit",
-    "chromatic": "npx chromatic"
+    "stylelint:fix": "stylelint \"src/**/*.{scss,css}\" --fix"
   },
-  "dependencies": {
-    "rc-slider": "^11.1.7"
+  "devDependencies": {
+    "@axa-fr/postcss-config-design-system": "*",
+    "@axa-fr/prettier-config-design-system": "*",
+    "@axa-fr/stylelint-config-design-system": "*",
+    "copyfiles": "^2.4.1",
+    "rimraf": "^6.0.1"
   },
   "peerDependencies": {
     "@material-symbols/svg-400": ">= 0.19.0"
@@ -33,52 +37,6 @@
       "optional": true
     }
   },
-  "devDependencies": {
-    "@chromatic-com/storybook": "^2.0.2",
-    "@csstools/postcss-sass": "^5.1.1",
-    "@material-symbols/svg-400": "*",
-    "@storybook/addon-essentials": "^8.3.5",
-    "@storybook/addon-interactions": "^8.3.5",
-    "@storybook/addon-links": "^8.3.5",
-    "@storybook/addon-storysource": "^8.3.5",
-    "@storybook/blocks": "^8.3.5",
-    "@storybook/html": "^8.3.5",
-    "@storybook/html-vite": "^8.3.5",
-    "@storybook/test": "^8.3.5",
-    "@storybook/theming": "^8.3.5",
-    "@typescript-eslint/eslint-plugin": "^8.17.0",
-    "@typescript-eslint/parser": "^8.17.0",
-    "browserslist": "^4.23.3",
-    "chromatic": "^11.12.0",
-    "copyfiles": "^2.4.1",
-    "cssnano": "^7.0.3",
-    "eslint": "^8.57.0",
-    "eslint-config-airbnb": "^19.0.4",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-import-resolver-typescript": "^3.6.1",
-    "eslint-plugin-import": "^2.29.1",
-    "eslint-plugin-jsx-a11y": "^6.8.0",
-    "eslint-plugin-prettier": "^5.1.0",
-    "eslint-plugin-react": "^7.36.1",
-    "eslint-plugin-react-hooks": "^4.6.0",
-    "eslint-plugin-storybook": "^0.9.0",
-    "postcss": "^8.4.35",
-    "postcss-cli": "^11.0.0",
-    "postcss-flexbugs-fixes": "^5.0.2",
-    "postcss-normalize": "^10.0.1",
-    "postcss-preset-env": "^9.5.2",
-    "postcss-scss": "^4.0.9",
-    "prettier": "^3.3.3",
-    "rimraf": "^6.0.1",
-    "storybook": "^8.3.5",
-    "stylelint": "^16.11.0",
-    "stylelint-config-pretty-order": "^0.5.1",
-    "stylelint-config-recommended-scss": "^14.0.0",
-    "stylelint-config-standard": "^36.0.0",
-    "stylelint-prettier": "^5.0.0",
-    "tsc-files": "^1.1.4",
-    "vite": "^5.4.8"
-  },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/AxaFrance/design-system.git"
@@ -104,13 +62,13 @@
     ]
   },
   "lint-staged": {
-    "*.(js|jsx|ts|tsx)": "eslint --fix",
-    "*.(ts|tsx)": "tsc-files --noEmit",
-    "*.(scss|css)": "stylelint --fix",
-    "*.mdx": "prettier --write"
+    "*.(scss|css)": "stylelint --fix"
+  },
+  "prettier": "@axa-fr/prettier-config-design-system",
+  "stylelint": {
+    "extends": "@axa-fr/stylelint-config-design-system"
   },
   "volta": {
-    "node": "20.10.0",
-    "npm": "10.2.5"
+    "extends": "../../../package.json"
   }
-}
+}

package/dist/Button/Button.css

@@ -1 +0,0 @@
-.af-btn-client{align-items:center;background-color:var(--color-axa);border:0;border-radius:8px;cursor:pointer;display:flex;font-family:var(--font-family-base);font-weight:600;gap:1rem;justify-content:center;min-height:3.5rem;padding:.8rem 1.2rem;transition-duration:var(--transition-duration);transition-property:width,height,border,color,background-color,outline,box-shadow;transition-timing-function:linear;-webkit-user-select:none;user-select:none}.af-btn-client,.af-btn-client:hover{color:var(--color-white);text-decoration:none}.af-btn-client:hover{background-color:var(--color-blue-1)}.af-btn-client:active,.af-btn-client:focus{background-color:var(--color-btn-light);color:var(--color-white);outline:none}.af-btn-client:focus-visible{outline:2px solid var(--color-blue-3);outline-offset:3px}.af-btn-client>svg{aspect-ratio:1;fill:currentcolor}.af-btn-client--ghost{background-color:initial;color:var(--color-axa);gap:.25rem;min-height:auto;min-width:auto;padding:0}.af-btn-client--ghost:hover{background-color:initial;color:var(--color-blue-1)}.af-btn-client--ghost:active,.af-btn-client--ghost:focus{background-color:initial;color:var(--color-btn-light)}.af-btn-client--primary-business{background-color:var(--color-btn-business)}.af-btn-client--primary-business:hover{background-color:var(--color-btn-business-dark)}.af-btn-client--primary-business:focus{background-color:var(--color-btn-business-light)}.af-btn-client--tertiary{background-color:var(--color-btn-tertiary-bg);color:var(--color-axa)}.af-btn-client--tertiary:hover{background-color:var(--color-btn-tertiary-bg-darker);color:var(--color-axa)}.af-btn-client--tertiary:active,.af-btn-client--tertiary:focus{background-color:var(--color-btn-tertiary-bg-lighter);color:var(--color-axa)}.af-btn-client--secondary{background-color:var(--color-white);box-shadow:0 0 0 1px var(--color-axa) inset;color:var(--color-axa)}.af-btn-client--secondary:active,.af-btn-client--secondary:focus,.af-btn-client--secondary:hover{background-color:var(--color-white);box-shadow:0 0 0 2px var(--color-blue-1) inset;color:var(--color-blue-1)}.af-btn-client--secondary:active{background-color:var(--color-blue-2)}.af-btn-client--secondary-error{background-color:var(--color-white);box-shadow:0 0 0 1px var(--color-red-700) inset;color:var(--color-red-700)}.af-btn-client--secondary-error:active,.af-btn-client--secondary-error:focus,.af-btn-client--secondary-error:hover{background-color:var(--color-white);box-shadow:0 0 0 2px var(--color-btn-error-text) inset;color:var(--color-btn-error-text)}.af-btn-client--secondary-error:active{background-color:var(--color-btn-error-bg)}.af-btn-client__wrapper{align-items:center;display:flex;justify-content:center;line-height:1}.af-btn-client:disabled,.af-btn-client[aria-disabled=true]{background-color:var(--color-gray-300);box-shadow:none;color:var(--color-btn-disabled-text);cursor:not-allowed}.af-btn-client:disabled:focus,.af-btn-client:disabled:hover,.af-btn-client[aria-disabled=true]:focus,.af-btn-client[aria-disabled=true]:hover{background-color:var(--color-gray-300);border-color:#0000;color:var(--color-btn-disabled-text)}

package/dist/Button/Button.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Button/Button.scss%23sass","../../src/Button/Button.scss"],"names":[],"mappings":"AAAA,eAME,kBAAA,CAOA,iCAAA,CATA,QAAA,CACA,iBAAA,CAaA,cAAA,CAjBA,YAAA,CAQA,mCAAA,CACA,eAAA,CAFA,QAAA,CADA,sBAAA,CALA,iBAAA,CACA,oBAAA,CAWA,8CAAA,CACA,iFAAA,CAEA,iCAAA,CAEA,wBAAA,CAAA,gBCAF,CDEE,oCATA,wBAAA,CADA,oBCaF,CDHE,qBAGE,oCCAJ,CDGE,2CAGE,uCAAA,CADA,wBAAA,CAEA,YCFJ,CDKE,6BACE,qCAAA,CACA,kBCHJ,CDME,mBACE,cAAA,CACA,iBCJJ,CDOE,sBAME,wBAAA,CADA,sBAAA,CADA,UAAA,CAFA,eAAA,CADA,cAAA,CAEA,SCFJ,CDOI,4BAEE,wBAAA,CADA,yBCJN,CDQI,yDAGE,wBAAA,CADA,4BCNN,CDWE,iCACE,0CCTJ,CDWI,uCACE,+CCTN,CDYI,uCACE,gDCVN,CDcE,yBAEE,6CAAA,CADA,sBCXJ,CDcI,+BAEE,oDAAA,CADA,sBCXN,CDeI,+DAGE,qDAAA,CADA,sBCbN,CDkBE,0BAEE,mCAAA,CACA,2CAAA,CAFA,sBCdJ,CDkBI,iGAIE,mCAAA,CACA,8CAAA,CAFA,yBChBN,CDqBI,iCACE,oCCnBN,CDuBE,gCAEE,mCAAA,CACA,+CAAA,CAFA,0BCnBJ,CDuBI,mHAIE,mCAAA,CACA,sDAAA,CAFA,iCCrBN,CD0BI,uCACE,0CCxBN,CD4BE,wBAEE,kBAAA,CADA,YAAA,CAEA,sBAAA,CACA,aC1BJ,CD6BE,2DAGE,sCAAA,CACA,eAAA,CAFA,oCAAA,CAGA,kBC5BJ,CD8BI,8IAIE,sCAAA,CAFA,kBAAA,CACA,oCC5BN","file":"Button.css","sourcesContent":[".af-btn-client {\n  display: flex;\n  min-height: 3.5rem;\n  padding: 0.8rem 1.2rem;\n  border: 0;\n  border-radius: 8px;\n  align-items: center;\n  justify-content: center;\n  gap: 1rem;\n  font-family: var(--font-family-base);\n  font-weight: 600;\n  text-decoration: none;\n  color: var(--color-white);\n  background-color: var(--color-axa);\n  transition-duration: var(--transition-duration);\n  transition-property: width, height, border, color, background-color, outline,\n    box-shadow;\n  transition-timing-function: linear;\n  cursor: pointer;\n  user-select: none;\n\n  &:hover {\n    text-decoration: none;\n    color: var(--color-white);\n    background-color: var(--color-blue-1);\n  }\n\n  &:active,\n  &:focus {\n    color: var(--color-white);\n    background-color: var(--color-btn-light);\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid var(--color-blue-3);\n    outline-offset: 3px;\n  }\n\n  & > svg {\n    aspect-ratio: 1;\n    fill: currentcolor;\n  }\n\n  &--ghost {\n    min-width: auto;\n    min-height: auto;\n    padding: 0;\n    gap: 0.25rem;\n    color: var(--color-axa);\n    background-color: transparent;\n\n    &:hover {\n      color: var(--color-blue-1);\n      background-color: transparent;\n    }\n\n    &:focus,\n    &:active {\n      color: var(--color-btn-light);\n      background-color: transparent;\n    }\n  }\n\n  &--primary-business {\n    background-color: var(--color-btn-business);\n\n    &:hover {\n      background-color: var(--color-btn-business-dark);\n    }\n\n    &:focus {\n      background-color: var(--color-btn-business-light);\n    }\n  }\n\n  &--tertiary {\n    color: var(--color-axa);\n    background-color: var(--color-btn-tertiary-bg);\n\n    &:hover {\n      color: var(--color-axa);\n      background-color: var(--color-btn-tertiary-bg-darker);\n    }\n\n    &:focus,\n    &:active {\n      color: var(--color-axa);\n      background-color: var(--color-btn-tertiary-bg-lighter);\n    }\n  }\n\n  &--secondary {\n    color: var(--color-axa);\n    background-color: var(--color-white);\n    box-shadow: 0 0 0 1px var(--color-axa) inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: var(--color-blue-1);\n      background-color: var(--color-white);\n      box-shadow: 0 0 0 2px var(--color-blue-1) inset;\n    }\n\n    &:active {\n      background-color: var(--color-blue-2);\n    }\n  }\n\n  &--secondary-error {\n    color: var(--color-red-700);\n    background-color: var(--color-white);\n    box-shadow: 0 0 0 1px var(--color-red-700) inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: var(--color-btn-error-text);\n      background-color: var(--color-white);\n      box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;\n    }\n\n    &:active {\n      background-color: var(--color-btn-error-bg);\n    }\n  }\n\n  &__wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n  }\n\n  &:disabled,\n  &[aria-disabled=\"true\"] {\n    color: var(--color-btn-disabled-text);\n    background-color: var(--color-gray-300);\n    box-shadow: none;\n    cursor: not-allowed;\n\n    &:hover,\n    &:focus {\n      border-color: transparent;\n      color: var(--color-btn-disabled-text);\n      background-color: var(--color-gray-300);\n    }\n  }\n}\n",".af-btn-client {\n  display: flex;\n  min-height: 3.5rem;\n  padding: 0.8rem 1.2rem;\n  border: 0;\n  border-radius: 8px;\n  align-items: center;\n  justify-content: center;\n  gap: 1rem;\n  font-family: var(--font-family-base);\n  font-weight: 600;\n  text-decoration: none;\n  color: var(--color-white);\n  background-color: var(--color-axa);\n  transition-duration: var(--transition-duration);\n  transition-property: width, height, border, color, background-color, outline,\n    box-shadow;\n  transition-timing-function: linear;\n  cursor: pointer;\n  user-select: none;\n\n  &:hover {\n    text-decoration: none;\n    color: var(--color-white);\n    background-color: var(--color-blue-1);\n  }\n\n  &:active,\n  &:focus {\n    color: var(--color-white);\n    background-color: var(--color-btn-light);\n    outline: none;\n  }\n\n  &:focus-visible {\n    outline: 2px solid var(--color-blue-3);\n    outline-offset: 3px;\n  }\n\n  & > svg {\n    aspect-ratio: 1;\n    fill: currentcolor;\n  }\n\n  &--ghost {\n    min-width: auto;\n    min-height: auto;\n    padding: 0;\n    gap: 0.25rem;\n    color: var(--color-axa);\n    background-color: transparent;\n\n    &:hover {\n      color: var(--color-blue-1);\n      background-color: transparent;\n    }\n\n    &:focus,\n    &:active {\n      color: var(--color-btn-light);\n      background-color: transparent;\n    }\n  }\n\n  &--primary-business {\n    background-color: var(--color-btn-business);\n\n    &:hover {\n      background-color: var(--color-btn-business-dark);\n    }\n\n    &:focus {\n      background-color: var(--color-btn-business-light);\n    }\n  }\n\n  &--tertiary {\n    color: var(--color-axa);\n    background-color: var(--color-btn-tertiary-bg);\n\n    &:hover {\n      color: var(--color-axa);\n      background-color: var(--color-btn-tertiary-bg-darker);\n    }\n\n    &:focus,\n    &:active {\n      color: var(--color-axa);\n      background-color: var(--color-btn-tertiary-bg-lighter);\n    }\n  }\n\n  &--secondary {\n    color: var(--color-axa);\n    background-color: var(--color-white);\n    box-shadow: 0 0 0 1px var(--color-axa) inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: var(--color-blue-1);\n      background-color: var(--color-white);\n      box-shadow: 0 0 0 2px var(--color-blue-1) inset;\n    }\n\n    &:active {\n      background-color: var(--color-blue-2);\n    }\n  }\n\n  &--secondary-error {\n    color: var(--color-red-700);\n    background-color: var(--color-white);\n    box-shadow: 0 0 0 1px var(--color-red-700) inset;\n\n    &:hover,\n    &:focus,\n    &:active {\n      color: var(--color-btn-error-text);\n      background-color: var(--color-white);\n      box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;\n    }\n\n    &:active {\n      background-color: var(--color-btn-error-bg);\n    }\n  }\n\n  &__wrapper {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    line-height: 1;\n  }\n\n  &:disabled,\n  &[aria-disabled=\"true\"] {\n    color: var(--color-btn-disabled-text);\n    background-color: var(--color-gray-300);\n    box-shadow: none;\n    cursor: not-allowed;\n\n    &:hover,\n    &:focus {\n      border-color: transparent;\n      color: var(--color-btn-disabled-text);\n      background-color: var(--color-gray-300);\n    }\n  }\n}\n"]}

package/dist/Button/Button.scss

@@ -1,150 +0,0 @@
-.af-btn-client {
-  display: flex;
-  min-height: 3.5rem;
-  padding: 0.8rem 1.2rem;
-  border: 0;
-  border-radius: 8px;
-  align-items: center;
-  justify-content: center;
-  gap: 1rem;
-  font-family: var(--font-family-base);
-  font-weight: 600;
-  text-decoration: none;
-  color: var(--color-white);
-  background-color: var(--color-axa);
-  transition-duration: var(--transition-duration);
-  transition-property: width, height, border, color, background-color, outline,
-    box-shadow;
-  transition-timing-function: linear;
-  cursor: pointer;
-  user-select: none;
-
-  &:hover {
-    text-decoration: none;
-    color: var(--color-white);
-    background-color: var(--color-blue-1);
-  }
-
-  &:active,
-  &:focus {
-    color: var(--color-white);
-    background-color: var(--color-btn-light);
-    outline: none;
-  }
-
-  &:focus-visible {
-    outline: 2px solid var(--color-blue-3);
-    outline-offset: 3px;
-  }
-
-  & > svg {
-    aspect-ratio: 1;
-    fill: currentcolor;
-  }
-
-  &--ghost {
-    min-width: auto;
-    min-height: auto;
-    padding: 0;
-    gap: 0.25rem;
-    color: var(--color-axa);
-    background-color: transparent;
-
-    &:hover {
-      color: var(--color-blue-1);
-      background-color: transparent;
-    }
-
-    &:focus,
-    &:active {
-      color: var(--color-btn-light);
-      background-color: transparent;
-    }
-  }
-
-  &--primary-business {
-    background-color: var(--color-btn-business);
-
-    &:hover {
-      background-color: var(--color-btn-business-dark);
-    }
-
-    &:focus {
-      background-color: var(--color-btn-business-light);
-    }
-  }
-
-  &--tertiary {
-    color: var(--color-axa);
-    background-color: var(--color-btn-tertiary-bg);
-
-    &:hover {
-      color: var(--color-axa);
-      background-color: var(--color-btn-tertiary-bg-darker);
-    }
-
-    &:focus,
-    &:active {
-      color: var(--color-axa);
-      background-color: var(--color-btn-tertiary-bg-lighter);
-    }
-  }
-
-  &--secondary {
-    color: var(--color-axa);
-    background-color: var(--color-white);
-    box-shadow: 0 0 0 1px var(--color-axa) inset;
-
-    &:hover,
-    &:focus,
-    &:active {
-      color: var(--color-blue-1);
-      background-color: var(--color-white);
-      box-shadow: 0 0 0 2px var(--color-blue-1) inset;
-    }
-
-    &:active {
-      background-color: var(--color-blue-2);
-    }
-  }
-
-  &--secondary-error {
-    color: var(--color-red-700);
-    background-color: var(--color-white);
-    box-shadow: 0 0 0 1px var(--color-red-700) inset;
-
-    &:hover,
-    &:focus,
-    &:active {
-      color: var(--color-btn-error-text);
-      background-color: var(--color-white);
-      box-shadow: 0 0 0 2px var(--color-btn-error-text) inset;
-    }
-
-    &:active {
-      background-color: var(--color-btn-error-bg);
-    }
-  }
-
-  &__wrapper {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    line-height: 1;
-  }
-
-  &:disabled,
-  &[aria-disabled="true"] {
-    color: var(--color-btn-disabled-text);
-    background-color: var(--color-gray-300);
-    box-shadow: none;
-    cursor: not-allowed;
-
-    &:hover,
-    &:focus {
-      border-color: transparent;
-      color: var(--color-btn-disabled-text);
-      background-color: var(--color-gray-300);
-    }
-  }
-}

package/dist/Form/TextArea/TextArea.css

@@ -1 +0,0 @@
-.af-form__input-container{--row-gap:calc(8/var(--font-size-base)*1rem);align-items:flex-start}.af-form__input-container,.af-form__label-container{display:flex;flex-direction:column;row-gap:var(--row-gap)}.af-form__label-container{--row-gap:calc(4/var(--font-size-base)*1rem)}.af-form__input-label{color:var(--color-gray-900);font-size:1.125rem;font-weight:600;line-height:1.25rem}@media (width > 1023px){.af-form__input-label{font-size:1.125rem;line-height:1.5rem}}.af-form__input-description{color:var(--color-gray-700);font-size:.875rem;font-weight:400;line-height:1.125rem}@media (width > 1023px){.af-form__input-description{font-size:1rem;line-height:1.25rem}}.af-form__input-helper{color:var(--color-gray-700);font-size:.875rem;line-height:1.125rem}@media (width > 1023px){.af-form__input-helper{font-size:1rem;line-height:1.25rem}}.af-form__input-more{width:fit-content;fill:var(--color-axa)}.af-form__input-more svg{height:1.25rem;width:1.25rem}.af-form__input-text{border:1px solid var(--color-gray);border-radius:var(--default-border-radius);color:var(--color-gray-900);font-size:1rem;line-height:1.25rem;padding:1rem 2.5rem 1rem 1rem}@media (width > 1023px){.af-form__input-text{font-size:1.125rem;line-height:1.5rem}}.af-form__input-text--error{border:2px solid var(--color-red-700)}.af-form__input-text:enabled:active,.af-form__input-text:enabled:focus{border:1px solid var(--color-axa);outline:none}.af-form__input-text:not(:disabled,:focus,:active,.af-form__input-text--error):hover{border:2px solid var(--color-axa);outline:none}.af-form__input-textarea{border:1px solid var(--color-gray);border-radius:var(--default-border-radius);color:var(--color-gray-900);font-size:1rem;height:8.875rem;line-height:1.25rem;margin-top:.5rem;padding:1rem 2.5rem 1rem 1rem;width:100%}@media (width > 1023px){.af-form__input-textarea{font-size:1.125rem;line-height:1.5rem}}.af-form__input-textarea--error{border:2px solid var(--color-red-700)}.af-form__input-textarea:enabled:active,.af-form__input-textarea:enabled:focus{border:1px solid var(--color-axa);outline:none}.af-form__input-textarea:not(:disabled,:focus,:active,.af-form__input-textarea--error):hover{border:2px solid var(--color-axa);outline:none}

package/dist/Form/TextArea/TextArea.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../../src/Form/Text/Text.scss","../../../src/Form/TextArea/TextArea.scss","../../../src/Form/TextArea/TextArea.scss%23sass"],"names":[],"mappings":"AAGE,0BCFF,4CDGI,CAIA,sBCFJ,CDME,oDANE,YAAA,CCHJ,qBAAA,CDMI,sBCGJ,CDAE,0BACE,4CCDJ,CDQE,sBAIE,2BAAA,CAHA,kBAAA,CACA,eAAA,CACA,mBCLJ,CDQI,wBANF,sBCCA,kBAAA,CDOI,kBCLJ,CACF,CDQE,4BAIE,2BAAA,CAHA,iBAAA,CACA,eAAA,CACA,oBCLJ,CDQI,wBANF,4BAOI,cAAA,CCLJ,mBACF,CACA,CDQE,uBAGE,2BAAA,CAFA,iBAAA,CACA,oBCLJ,CDQI,wBALF,uBAMI,cAAA,CACA,mBCLJ,CACF,CDQE,qBACE,iBAAA,CACA,qBCNJ,CDQI,yBAEE,cAAA,CADA,aCLN,CDUE,qBAEE,kCAAA,CACA,0CAAA,CAGA,2BAAA,CAFA,cAAA,CACA,mBAAA,CAJA,6BCHJ,CDUI,wBARF,qBASI,kBAAA,CACA,kBCPJ,CACF,CDSI,4BACE,qCCPN,CDWM,uEAEE,iCAAA,CACA,YCVR,CDcI,qFACE,iCAAA,CACA,YCZN,CC7EA,yBAKE,kCAAA,CACA,0CAAA,CAGA,2BAAA,CAFA,cAAA,CALA,eAAA,CAMA,mBAAA,CALA,gBAAA,CACA,6BAAA,CAHA,UDwFF,CC9EE,wBAXF,yBAYI,kBAAA,CACA,kBDiFF,CACF,CC/EE,gCACE,qCDiFJ,CC7EI,+EAEE,iCAAA,CACA,YD8EN,CC1EE,6FACE,iCAAA,CACA,YD4EJ","file":"TextArea.css","sourcesContent":["@use \"../../common/common\" as common;\n\n.af-form {\n  &__input-container {\n    --row-gap: calc(8 / var(--font-size-base) * 1rem);\n\n    display: flex;\n    flex-direction: column;\n    align-items: flex-start;\n    row-gap: var(--row-gap);\n  }\n\n  &__label-container {\n    --row-gap: calc(4 / var(--font-size-base) * 1rem);\n\n    display: flex;\n    flex-direction: column;\n    row-gap: var(--row-gap);\n  }\n\n  &__input-label {\n    font-size: common.rem(18);\n    font-weight: 600;\n    line-height: common.rem(20);\n    color: var(--color-gray-900);\n\n    @media (width > #{common.$breakpoint-md}) {\n      font-size: common.rem(18);\n      line-height: common.rem(24);\n    }\n  }\n\n  &__input-description {\n    font-size: common.rem(14);\n    font-weight: 400;\n    line-height: common.rem(18);\n    color: var(--color-gray-700);\n\n    @media (width > #{common.$breakpoint-md}) {\n      font-size: common.rem(16);\n      line-height: common.rem(20);\n    }\n  }\n\n  &__input-helper {\n    font-size: common.rem(14);\n    line-height: common.rem(18);\n    color: var(--color-gray-700);\n\n    @media (width > #{common.$breakpoint-md}) {\n      font-size: common.rem(16);\n      line-height: common.rem(20);\n    }\n  }\n\n  &__input-more {\n    width: fit-content;\n    fill: var(--color-axa);\n\n    svg {\n      width: 1.25rem;\n      height: 1.25rem;\n    }\n  }\n\n  &__input-text {\n    padding: 1rem 2.5rem 1rem 1rem;\n    border: 1px solid var(--color-gray);\n    border-radius: var(--default-border-radius);\n    font-size: common.rem(16);\n    line-height: common.rem(20);\n    color: var(--color-gray-900);\n\n    @media (width > #{common.$breakpoint-md}) {\n      font-size: common.rem(18);\n      line-height: common.rem(24);\n    }\n\n    &--error {\n      border: 2px solid var(--color-red-700);\n    }\n\n    &:enabled {\n      &:focus,\n      &:active {\n        border: 1px solid var(--color-axa);\n        outline: none;\n      }\n    }\n\n    &:not(:disabled, :focus, :active, &--error):hover {\n      border: 2px solid var(--color-axa);\n      outline: none;\n    }\n  }\n}\n","@use \"../../common/common\" as common;\n@use \"../Text/Text\";\n\n.af-form__input-textarea {\n  width: 100%;\n  height: common.rem(142);\n  margin-top: 0.5rem;\n  padding: 1rem 2.5rem 1rem 1rem;\n  border: 1px solid var(--color-gray);\n  border-radius: var(--default-border-radius);\n  font-size: common.rem(16);\n  line-height: common.rem(20);\n  color: var(--color-gray-900);\n\n  @media (width > #{common.$breakpoint-md}) {\n    font-size: common.rem(18);\n    line-height: common.rem(24);\n  }\n\n  &--error {\n    border: 2px solid var(--color-red-700);\n  }\n\n  &:enabled {\n    &:focus,\n    &:active {\n      border: 1px solid var(--color-axa);\n      outline: none;\n    }\n  }\n\n  &:not(:disabled, :focus, :active, &--error):hover {\n    border: 2px solid var(--color-axa);\n    outline: none;\n  }\n}\n","@use \"../../common/common\" as common;\n@use \"../Text/Text\";\n\n.af-form__input-textarea {\n  width: 100%;\n  height: common.rem(142);\n  margin-top: 0.5rem;\n  padding: 1rem 2.5rem 1rem 1rem;\n  border: 1px solid var(--color-gray);\n  border-radius: var(--default-border-radius);\n  font-size: common.rem(16);\n  line-height: common.rem(20);\n  color: var(--color-gray-900);\n\n  @media (width > #{common.$breakpoint-md}) {\n    font-size: common.rem(18);\n    line-height: common.rem(24);\n  }\n\n  &--error {\n    border: 2px solid var(--color-red-700);\n  }\n\n  &:enabled {\n    &:focus,\n    &:active {\n      border: 1px solid var(--color-axa);\n      outline: none;\n    }\n  }\n\n  &:not(:disabled, :focus, :active, &--error):hover {\n    border: 2px solid var(--color-axa);\n    outline: none;\n  }\n}\n"]}

package/dist/Form/TextArea/TextArea.scss

@@ -1,36 +0,0 @@
-@use "../../common/common" as common;
-@use "../Text/Text";
-
-.af-form__input-textarea {
-  width: 100%;
-  height: common.rem(142);
-  margin-top: 0.5rem;
-  padding: 1rem 2.5rem 1rem 1rem;
-  border: 1px solid var(--color-gray);
-  border-radius: var(--default-border-radius);
-  font-size: common.rem(16);
-  line-height: common.rem(20);
-  color: var(--color-gray-900);
-
-  @media (width > #{common.$breakpoint-md}) {
-    font-size: common.rem(18);
-    line-height: common.rem(24);
-  }
-
-  &--error {
-    border: 2px solid var(--color-red-700);
-  }
-
-  &:enabled {
-    &:focus,
-    &:active {
-      border: 1px solid var(--color-axa);
-      outline: none;
-    }
-  }
-
-  &:not(:disabled, :focus, :active, &--error):hover {
-    border: 2px solid var(--color-axa);
-    outline: none;
-  }
-}

package/dist/Grid/DebugGrid.css

@@ -1 +0,0 @@
-.af-checkbox-select--debuggrid label:has(>[name=debuggrid]){background-color:#fff;bottom:0;height:auto;left:0;position:fixed;z-index:2}.debug-grid{display:none;height:100%;mix-blend-mode:multiply;opacity:.5;position:fixed;top:0;width:100%}.debug-grid .grid{--name:"small: 0 to 667px";--color-bg-cols:#e9d6f2;height:100%;position:relative}.debug-grid .grid:before{color:color-mix(in hsl,var(--color-bg-cols),#000 20%);content:var(--name);font-size:clamp(.5rem,4vw,3rem);height:100%;left:.5vw;position:absolute;text-align:center;text-orientation:mixed;top:50%;transform:translateY(-50%);transition:color .3s linear .2s;width:100%;writing-mode:vertical-rl}.debug-grid .grid .cols{background-color:var(--color-bg-cols);display:none;grid-column:span 1;height:100%;transition:background-color .3s linear .2s}.debug-grid .grid .cols:nth-child(-n+4){display:block}@media (width > 667px){.debug-grid .grid{--name:"medium: 668px to 1023px";--color-bg-cols:#d6d9f2}.debug-grid .grid .cols:nth-child(-n+8){display:block}}@media (width > 1023px){.debug-grid .grid{--name:"large: 1024px to 1279px";--color-bg-cols:#c1ecec}.debug-grid .grid .cols:nth-child(-n+12){display:block}}@media (width > 1279px){.debug-grid .grid{--name:"extra large: 1280px to 1599px";--color-bg-cols:#c2ecc2}}@media (width > 1599px){.debug-grid .grid{--name:"extra large: 1600px to infinity";--color-bg-cols:#ffd1d3}}body:has([name=debuggrid]:checked) .debug-grid{display:block}

package/dist/Grid/DebugGrid.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Grid/DebugGrid.scss%23sass","../../src/Grid/DebugGrid.scss"],"names":[],"mappings":"AAEA,4DAME,qBAAA,CAHA,QAAA,CAEA,WAAA,CADA,MAAA,CAHA,cAAA,CCDF,SAKA,CDIA,YAGE,YAAA,CAEA,WAAA,CAEA,uBAAA,CADA,UAAA,CALA,cAAA,CCDF,KAAA,CDIE,UCEF,CDGE,kBACE,0BAAA,CACA,uBAAA,CAGA,WAAA,CADA,iBCDJ,CDII,yBAUE,qDAAA,CAGA,mBAAA,CAPA,+BAAA,CADA,WAAA,CAFA,SAAA,CAFA,iBAAA,CAMA,iBAAA,CACA,sBAAA,CANA,OAAA,CASA,0BAAA,CACA,+BAAA,CARA,UAAA,CAKA,wBCEN,CDKI,wBAIE,qCAAA,CAHA,YAAA,CAEA,kBAAA,CADA,WAAA,CAGA,0CCHN,CDKM,wCACE,aCHR,CDOI,uBAnCF,kBAoCI,gCAAA,CACA,uBCJJ,CDMI,wCACE,aCJN,CACF,CDOI,wBA5CF,kBA6CI,gCAAA,CACA,uBCJJ,CDMI,yCACE,aCJN,CACF,CDOI,wBArDF,kBAsDI,sCAAA,CACA,uBCJJ,CACF,CDMI,wBA1DF,kBA2DI,wCAAA,CACA,uBCHJ,CACF,CDSI,+CACE,aCNN","file":"DebugGrid.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n.af-checkbox-select--debuggrid label:has(> [name=\"debuggrid\"]) {\n  position: fixed;\n  z-index: 2;\n  bottom: 0;\n  left: 0;\n  height: auto;\n  background-color: common.$color-white;\n}\n\n.debug-grid {\n  position: fixed;\n  top: 0;\n  display: none;\n  width: 100%;\n  height: 100%;\n  opacity: 0.5;\n  mix-blend-mode: multiply;\n\n  .grid {\n    --name: \"small: 0 to 667px\";\n    --color-bg-cols: hsl(280.71deg, 51.85%, 89.41%);\n\n    position: relative;\n    height: 100%;\n\n    &::before {\n      position: absolute;\n      top: 50%;\n      left: 0.5vw;\n      width: 100%;\n      height: 100%;\n      font-size: clamp(0.5rem, 4vw, 3rem);\n      text-align: center;\n      text-orientation: mixed;\n      writing-mode: vertical-rl;\n      color: color-mix(in hsl, var(--color-bg-cols), rgb(0, 0, 0) 20%);\n      transform: translate(0, -50%);\n      transition: color 300ms linear 200ms;\n      content: var(--name);\n    }\n\n    .cols {\n      display: none;\n      height: 100%;\n      grid-column: span 1;\n      background-color: var(--color-bg-cols);\n      transition: background-color 300ms linear 200ms;\n\n      &:nth-child(-n + 4) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-sm}) {\n      --name: \"medium: 668px to 1023px\";\n      --color-bg-cols: hsl(233.57deg, 51.85%, 89.41%);\n\n      .cols:nth-child(-n + 8) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-md}) {\n      --name: \"large: 1024px to 1279px\";\n      --color-bg-cols: hsl(180deg, 53.09%, 84.12%);\n\n      .cols:nth-child(-n + 12) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-lg}) {\n      --name: \"extra large: 1280px to 1599px\";\n      --color-bg-cols: hsl(120deg, 52.5%, 84.31%);\n    }\n\n    @media (width > #{common.$breakpoint-xl}) {\n      --name: \"extra large: 1600px to infinity\";\n      --color-bg-cols: hsl(357.39deg, 100%, 90.98%);\n    }\n  }\n}\n\nbody {\n  &:has([name=\"debuggrid\"]:checked) {\n    .debug-grid {\n      display: block;\n    }\n  }\n}\n","@use \"../common/common.scss\" as common;\n\n.af-checkbox-select--debuggrid label:has(> [name=\"debuggrid\"]) {\n  position: fixed;\n  z-index: 2;\n  bottom: 0;\n  left: 0;\n  height: auto;\n  background-color: common.$color-white;\n}\n\n.debug-grid {\n  position: fixed;\n  top: 0;\n  display: none;\n  width: 100%;\n  height: 100%;\n  opacity: 0.5;\n  mix-blend-mode: multiply;\n\n  .grid {\n    --name: \"small: 0 to 667px\";\n    --color-bg-cols: hsl(280.71deg, 51.85%, 89.41%);\n\n    position: relative;\n    height: 100%;\n\n    &::before {\n      position: absolute;\n      top: 50%;\n      left: 0.5vw;\n      width: 100%;\n      height: 100%;\n      font-size: clamp(0.5rem, 4vw, 3rem);\n      text-align: center;\n      text-orientation: mixed;\n      writing-mode: vertical-rl;\n      color: color-mix(in hsl, var(--color-bg-cols), rgb(0, 0, 0) 20%);\n      transform: translate(0, -50%);\n      transition: color 300ms linear 200ms;\n      content: var(--name);\n    }\n\n    .cols {\n      display: none;\n      height: 100%;\n      grid-column: span 1;\n      background-color: var(--color-bg-cols);\n      transition: background-color 300ms linear 200ms;\n\n      &:nth-child(-n + 4) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-sm}) {\n      --name: \"medium: 668px to 1023px\";\n      --color-bg-cols: hsl(233.57deg, 51.85%, 89.41%);\n\n      .cols:nth-child(-n + 8) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-md}) {\n      --name: \"large: 1024px to 1279px\";\n      --color-bg-cols: hsl(180deg, 53.09%, 84.12%);\n\n      .cols:nth-child(-n + 12) {\n        display: block;\n      }\n    }\n\n    @media (width > #{common.$breakpoint-lg}) {\n      --name: \"extra large: 1280px to 1599px\";\n      --color-bg-cols: hsl(120deg, 52.5%, 84.31%);\n    }\n\n    @media (width > #{common.$breakpoint-xl}) {\n      --name: \"extra large: 1600px to infinity\";\n      --color-bg-cols: hsl(357.39deg, 100%, 90.98%);\n    }\n  }\n}\n\nbody {\n  &:has([name=\"debuggrid\"]:checked) {\n    .debug-grid {\n      display: block;\n    }\n  }\n}\n"]}

package/dist/Grid/DebugGrid.scss

@@ -1,92 +0,0 @@
-@use "../common/common.scss" as common;
-
-.af-checkbox-select--debuggrid label:has(> [name="debuggrid"]) {
-  position: fixed;
-  z-index: 2;
-  bottom: 0;
-  left: 0;
-  height: auto;
-  background-color: common.$color-white;
-}
-
-.debug-grid {
-  position: fixed;
-  top: 0;
-  display: none;
-  width: 100%;
-  height: 100%;
-  opacity: 0.5;
-  mix-blend-mode: multiply;
-
-  .grid {
-    --name: "small: 0 to 667px";
-    --color-bg-cols: hsl(280.71deg, 51.85%, 89.41%);
-
-    position: relative;
-    height: 100%;
-
-    &::before {
-      position: absolute;
-      top: 50%;
-      left: 0.5vw;
-      width: 100%;
-      height: 100%;
-      font-size: clamp(0.5rem, 4vw, 3rem);
-      text-align: center;
-      text-orientation: mixed;
-      writing-mode: vertical-rl;
-      color: color-mix(in hsl, var(--color-bg-cols), rgb(0, 0, 0) 20%);
-      transform: translate(0, -50%);
-      transition: color 300ms linear 200ms;
-      content: var(--name);
-    }
-
-    .cols {
-      display: none;
-      height: 100%;
-      grid-column: span 1;
-      background-color: var(--color-bg-cols);
-      transition: background-color 300ms linear 200ms;
-
-      &:nth-child(-n + 4) {
-        display: block;
-      }
-    }
-
-    @media (width > #{common.$breakpoint-sm}) {
-      --name: "medium: 668px to 1023px";
-      --color-bg-cols: hsl(233.57deg, 51.85%, 89.41%);
-
-      .cols:nth-child(-n + 8) {
-        display: block;
-      }
-    }
-
-    @media (width > #{common.$breakpoint-md}) {
-      --name: "large: 1024px to 1279px";
-      --color-bg-cols: hsl(180deg, 53.09%, 84.12%);
-
-      .cols:nth-child(-n + 12) {
-        display: block;
-      }
-    }
-
-    @media (width > #{common.$breakpoint-lg}) {
-      --name: "extra large: 1280px to 1599px";
-      --color-bg-cols: hsl(120deg, 52.5%, 84.31%);
-    }
-
-    @media (width > #{common.$breakpoint-xl}) {
-      --name: "extra large: 1600px to infinity";
-      --color-bg-cols: hsl(357.39deg, 100%, 90.98%);
-    }
-  }
-}
-
-body {
-  &:has([name="debuggrid"]:checked) {
-    .debug-grid {
-      display: block;
-    }
-  }
-}

package/dist/Grid/Grid.css

@@ -1 +0,0 @@
-.grid{--col-gap:calc(8/var(--font-size-base)*1rem);--row-gap:calc(16/var(--font-size-base)*1rem);--margin-inline:calc(16/var(--font-size-base)*1rem);--cols:4;--start:auto;display:grid;gap:var(--row-gap) var(--col-gap);grid-template-columns:repeat(var(--cols),1fr);margin-inline:var(--margin-inline)}@media (width > 667px){.grid{--cols:8;--col-gap:calc(16/var(--font-size-base)*1rem);--margin-inline:calc(60/var(--font-size-base)*1rem)}}@media (width > 1023px){.grid{--col-gap:calc(24/var(--font-size-base)*1rem);--margin-inline:calc(80/var(--font-size-base)*1rem);--cols:12}}@media (width > 1279px){.grid{--margin-inline:calc(120/var(--font-size-base)*1rem)}}@media (width > 1599px){.grid{--margin-inline:auto;max-width:1320px}}.grid .subgrid,.grid :has(>.subgrid),.grid>*{align-content:start;display:grid;grid-column:var(--start)/span var(--cols);row-gap:var(--row-gap)}.grid>*>*{--start:auto}.grid .subgrid,.grid :has(>.subgrid){grid-template-columns:subgrid}.grid .subgrid>*,.grid :has(>.subgrid)>*{grid-column:var(--start)/span var(--cols)}

package/dist/Grid/Grid.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Grid/Grid.scss%23sass","../../src/Grid/Grid.scss"],"names":[],"mappings":"AAeA,MACE,4CAAA,CACA,6CAAA,CCFF,mDAAA,CDIE,QAAA,CACA,YAAA,CAEA,YAAA,CAGA,iCAAA,CADA,6CAAA,CADA,kCCDF,CDKE,uBAZF,MCUE,QAAA,CDIE,6CAAA,CCFF,mDACA,CACF,CDIE,wBAlBF,MAmBI,6CAAA,CCDF,mDAAA,CDGE,SCDF,CACF,CDGE,wBAxBF,MCwBE,oDACA,CACF,CDEE,wBA5BF,MA6BI,oBAAA,CAEA,gBCAF,CACF,CDEE,6CAKE,mBAAA,CAFA,YAAA,CACA,yCAAA,CAEA,sBCFJ,CDKE,UACE,YCHJ,CDME,qCAEE,6BCLJ,CDOI,yCACE,yCCLN","file":"Grid.css","sourcesContent":["@use \"../common/common.scss\" as common;\n\n/* GRID SYSTEM DESIGN SYSTEM AXA FRANCE (Look & Feel)****************\n\nSee the documentation : https://zeroheight.com/54c5bd254/v/latest/p/48d0d1-grille\n\nIts MOBILE FIRST approach, so the defauts values target the mobile.\n\n@media (width > #{common.$breakpoint-sm}) { >>>>> more than  667px\n@media (width > #{common.$breakpoint-md}) { >>>>> more than 1023px\n@media (width > #{common.$breakpoint-lg}) { >>>>> more than 1279px\n@media (width > #{common.$breakpoint-xl}) { >>>>> more than 1599px\n\n********************************************************************* */\n\n.grid {\n  --col-gap: calc(8 / var(--font-size-base) * 1rem);\n  --row-gap: calc(16 / var(--font-size-base) * 1rem);\n  --margin-inline: calc(16 / var(--font-size-base) * 1rem);\n  --cols: 4;\n  --start: auto;\n\n  display: grid;\n  margin-inline: var(--margin-inline);\n  grid-template-columns: repeat(var(--cols), 1fr);\n  gap: var(--row-gap) var(--col-gap);\n\n  @media (width > #{common.$breakpoint-sm}) {\n    --cols: 8;\n    --col-gap: calc(16 / var(--font-size-base) * 1rem);\n    --margin-inline: calc(60 / var(--font-size-base) * 1rem);\n  }\n\n  @media (width > #{common.$breakpoint-md}) {\n    --col-gap: calc(24 / var(--font-size-base) * 1rem);\n    --margin-inline: calc(80 / var(--font-size-base) * 1rem);\n    --cols: 12;\n  }\n\n  @media (width > #{common.$breakpoint-lg}) {\n    --margin-inline: calc(120 / var(--font-size-base) * 1rem);\n  }\n\n  @media (width > #{common.$breakpoint-xl}) {\n    --margin-inline: auto;\n\n    max-width: 1320px;\n  }\n\n  > *,\n  & .subgrid,\n  & :has(> .subgrid) {\n    display: grid;\n    grid-column: var(--start) / span var(--cols);\n    align-content: start;\n    row-gap: var(--row-gap);\n  }\n\n  > * > * {\n    --start: auto;\n  }\n\n  .subgrid,\n  & :has(> .subgrid) {\n    grid-template-columns: subgrid;\n\n    > * {\n      grid-column: var(--start) / span var(--cols);\n    }\n  }\n}\n","@use \"../common/common.scss\" as common;\n\n/* GRID SYSTEM DESIGN SYSTEM AXA FRANCE (Look & Feel)****************\n\nSee the documentation : https://zeroheight.com/54c5bd254/v/latest/p/48d0d1-grille\n\nIts MOBILE FIRST approach, so the defauts values target the mobile.\n\n@media (width > #{common.$breakpoint-sm}) { >>>>> more than  667px\n@media (width > #{common.$breakpoint-md}) { >>>>> more than 1023px\n@media (width > #{common.$breakpoint-lg}) { >>>>> more than 1279px\n@media (width > #{common.$breakpoint-xl}) { >>>>> more than 1599px\n\n********************************************************************* */\n\n.grid {\n  --col-gap: calc(8 / var(--font-size-base) * 1rem);\n  --row-gap: calc(16 / var(--font-size-base) * 1rem);\n  --margin-inline: calc(16 / var(--font-size-base) * 1rem);\n  --cols: 4;\n  --start: auto;\n\n  display: grid;\n  margin-inline: var(--margin-inline);\n  grid-template-columns: repeat(var(--cols), 1fr);\n  gap: var(--row-gap) var(--col-gap);\n\n  @media (width > #{common.$breakpoint-sm}) {\n    --cols: 8;\n    --col-gap: calc(16 / var(--font-size-base) * 1rem);\n    --margin-inline: calc(60 / var(--font-size-base) * 1rem);\n  }\n\n  @media (width > #{common.$breakpoint-md}) {\n    --col-gap: calc(24 / var(--font-size-base) * 1rem);\n    --margin-inline: calc(80 / var(--font-size-base) * 1rem);\n    --cols: 12;\n  }\n\n  @media (width > #{common.$breakpoint-lg}) {\n    --margin-inline: calc(120 / var(--font-size-base) * 1rem);\n  }\n\n  @media (width > #{common.$breakpoint-xl}) {\n    --margin-inline: auto;\n\n    max-width: 1320px;\n  }\n\n  > *,\n  & .subgrid,\n  & :has(> .subgrid) {\n    display: grid;\n    grid-column: var(--start) / span var(--cols);\n    align-content: start;\n    row-gap: var(--row-gap);\n  }\n\n  > * > * {\n    --start: auto;\n  }\n\n  .subgrid,\n  & :has(> .subgrid) {\n    grid-template-columns: subgrid;\n\n    > * {\n      grid-column: var(--start) / span var(--cols);\n    }\n  }\n}\n"]}

package/dist/Grid/Grid.scss

@@ -1,71 +0,0 @@
-@use "../common/common.scss" as common;
-
-/* GRID SYSTEM DESIGN SYSTEM AXA FRANCE (Look & Feel)****************
-
-See the documentation : https://zeroheight.com/54c5bd254/v/latest/p/48d0d1-grille
-
-Its MOBILE FIRST approach, so the defauts values target the mobile.
-
-@media (width > #{common.$breakpoint-sm}) { >>>>> more than  667px
-@media (width > #{common.$breakpoint-md}) { >>>>> more than 1023px
-@media (width > #{common.$breakpoint-lg}) { >>>>> more than 1279px
-@media (width > #{common.$breakpoint-xl}) { >>>>> more than 1599px
-
-********************************************************************* */
-
-.grid {
-  --col-gap: calc(8 / var(--font-size-base) * 1rem);
-  --row-gap: calc(16 / var(--font-size-base) * 1rem);
-  --margin-inline: calc(16 / var(--font-size-base) * 1rem);
-  --cols: 4;
-  --start: auto;
-
-  display: grid;
-  margin-inline: var(--margin-inline);
-  grid-template-columns: repeat(var(--cols), 1fr);
-  gap: var(--row-gap) var(--col-gap);
-
-  @media (width > #{common.$breakpoint-sm}) {
-    --cols: 8;
-    --col-gap: calc(16 / var(--font-size-base) * 1rem);
-    --margin-inline: calc(60 / var(--font-size-base) * 1rem);
-  }
-
-  @media (width > #{common.$breakpoint-md}) {
-    --col-gap: calc(24 / var(--font-size-base) * 1rem);
-    --margin-inline: calc(80 / var(--font-size-base) * 1rem);
-    --cols: 12;
-  }
-
-  @media (width > #{common.$breakpoint-lg}) {
-    --margin-inline: calc(120 / var(--font-size-base) * 1rem);
-  }
-
-  @media (width > #{common.$breakpoint-xl}) {
-    --margin-inline: auto;
-
-    max-width: 1320px;
-  }
-
-  > *,
-  & .subgrid,
-  & :has(> .subgrid) {
-    display: grid;
-    grid-column: var(--start) / span var(--cols);
-    align-content: start;
-    row-gap: var(--row-gap);
-  }
-
-  > * > * {
-    --start: auto;
-  }
-
-  .subgrid,
-  & :has(> .subgrid) {
-    grid-template-columns: subgrid;
-
-    > * {
-      grid-column: var(--start) / span var(--cols);
-    }
-  }
-}

package/dist/Link/Link.css

@@ -1 +0,0 @@
-.af-link{align-items:center;color:var(--color-axa);display:inline-flex;font-family:var(--font-family-base);gap:.25rem;height:fit-content;text-decoration:underline;width:fit-content;fill:var(--color-axa)}.af-link svg{aspect-ratio:1;height:1.25rem;width:1.25rem}.af-link--openInNewTab{font-weight:600}.af-link:has(svg){text-decoration:none}.af-link:active,.af-link:focus{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:focus-visible{outline:2px solid var(--color-blue-3);outline-offset:3px}.af-link:hover{color:var(--color-blue-1);fill:var(--color-blue-1)}.af-link:hover:has(svg){text-decoration:none}

package/dist/Link/Link.css.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/Link/Link.scss%23sass","../../src/Link/Link.scss"],"names":[],"mappings":"AAEA,SAIE,kBAAA,CAIA,sBAAA,CAPA,mBAAA,CAKA,mCAAA,CADA,UAAA,CAFA,kBAAA,CAIA,yBAAA,CCPF,iBAAA,CDSE,qBCDF,CDGE,aAGE,cAAA,CADA,cAAA,CADA,aCCJ,CDIE,uBACE,eCFJ,CDKE,kBACE,oBCHJ,CDME,+BAEE,yBAAA,CACA,wBCLJ,CDQE,uBACE,qCAAA,CACA,kBCNJ,CDSE,eACE,yBAAA,CACA,wBCPJ,CDSI,wBACE,oBCPN","file":"Link.css","sourcesContent":["@use \"../common/common\" as common;\n\n.af-link {\n  display: inline-flex;\n  width: fit-content;\n  height: fit-content;\n  align-items: center;\n  gap: common.rem(4);\n  font-family: var(--font-family-base);\n  text-decoration: underline;\n  color: var(--color-axa);\n  fill: var(--color-axa);\n\n  svg {\n    width: common.rem(20);\n    height: common.rem(20);\n    aspect-ratio: 1;\n  }\n\n  &--openInNewTab {\n    font-weight: 600;\n  }\n\n  &:has(svg) {\n    text-decoration: none;\n  }\n\n  &:active,\n  &:focus {\n    color: var(--color-blue-1);\n    fill: var(--color-blue-1);\n  }\n\n  &:focus-visible {\n    outline: 2px solid var(--color-blue-3);\n    outline-offset: 3px;\n  }\n\n  &:hover {\n    color: var(--color-blue-1);\n    fill: var(--color-blue-1);\n\n    &:has(svg) {\n      text-decoration: none;\n    }\n  }\n}\n","@use \"../common/common\" as common;\n\n.af-link {\n  display: inline-flex;\n  width: fit-content;\n  height: fit-content;\n  align-items: center;\n  gap: common.rem(4);\n  font-family: var(--font-family-base);\n  text-decoration: underline;\n  color: var(--color-axa);\n  fill: var(--color-axa);\n\n  svg {\n    width: common.rem(20);\n    height: common.rem(20);\n    aspect-ratio: 1;\n  }\n\n  &--openInNewTab {\n    font-weight: 600;\n  }\n\n  &:has(svg) {\n    text-decoration: none;\n  }\n\n  &:active,\n  &:focus {\n    color: var(--color-blue-1);\n    fill: var(--color-blue-1);\n  }\n\n  &:focus-visible {\n    outline: 2px solid var(--color-blue-3);\n    outline-offset: 3px;\n  }\n\n  &:hover {\n    color: var(--color-blue-1);\n    fill: var(--color-blue-1);\n\n    &:has(svg) {\n      text-decoration: none;\n    }\n  }\n}\n"]}

package/dist/Link/Link.scss

@@ -1,47 +0,0 @@
-@use "../common/common" as common;
-
-.af-link {
-  display: inline-flex;
-  width: fit-content;
-  height: fit-content;
-  align-items: center;
-  gap: common.rem(4);
-  font-family: var(--font-family-base);
-  text-decoration: underline;
-  color: var(--color-axa);
-  fill: var(--color-axa);
-
-  svg {
-    width: common.rem(20);
-    height: common.rem(20);
-    aspect-ratio: 1;
-  }
-
-  &--openInNewTab {
-    font-weight: 600;
-  }
-
-  &:has(svg) {
-    text-decoration: none;
-  }
-
-  &:active,
-  &:focus {
-    color: var(--color-blue-1);
-    fill: var(--color-blue-1);
-  }
-
-  &:focus-visible {
-    outline: 2px solid var(--color-blue-3);
-    outline-offset: 3px;
-  }
-
-  &:hover {
-    color: var(--color-blue-1);
-    fill: var(--color-blue-1);
-
-    &:has(svg) {
-      text-decoration: none;
-    }
-  }
-}