UNPKG

@up-group-ui/react-controls

Version:
1 lines 15.9 kB
"use strict";(self.webpackChunk_up_group_ui_react_controls=self.webpackChunk_up_group_ui_react_controls||[]).push([[5765],{"./src/components/Color/Color.stories.tsx":(__unused_webpack_module,__webpack_exports__,__webpack_require__)=>{__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{All:()=>All,__namedExportsOrder:()=>__namedExportsOrder,default:()=>__WEBPACK_DEFAULT_EXPORT__});__webpack_require__("./node_modules/react/index.js");var _All$parameters,_All$parameters2,_All$parameters2$docs,_mui_material__WEBPACK_IMPORTED_MODULE_3__=__webpack_require__("./node_modules/@mui/material/styles/useTheme.js"),_Typography__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__("./src/components/Typography/index.ts"),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__=__webpack_require__("./node_modules/react/jsx-runtime.js");function _typeof(obj){return _typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(obj){return typeof obj}:function(obj){return obj&&"function"==typeof Symbol&&obj.constructor===Symbol&&obj!==Symbol.prototype?"symbol":typeof obj},_typeof(obj)}function ownKeys(object,enumerableOnly){var keys=Object.keys(object);if(Object.getOwnPropertySymbols){var symbols=Object.getOwnPropertySymbols(object);enumerableOnly&&(symbols=symbols.filter((function(sym){return Object.getOwnPropertyDescriptor(object,sym).enumerable}))),keys.push.apply(keys,symbols)}return keys}function _objectSpread(target){for(var i=1;i<arguments.length;i++){var source=null!=arguments[i]?arguments[i]:{};i%2?ownKeys(Object(source),!0).forEach((function(key){_defineProperty(target,key,source[key])})):Object.getOwnPropertyDescriptors?Object.defineProperties(target,Object.getOwnPropertyDescriptors(source)):ownKeys(Object(source)).forEach((function(key){Object.defineProperty(target,key,Object.getOwnPropertyDescriptor(source,key))}))}return target}function _defineProperty(obj,key,value){return(key=function _toPropertyKey(arg){var key=function _toPrimitive(input,hint){if("object"!==_typeof(input)||null===input)return input;var prim=input[Symbol.toPrimitive];if(void 0!==prim){var res=prim.call(input,hint||"default");if("object"!==_typeof(res))return res;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===hint?String:Number)(input)}(arg,"string");return"symbol"===_typeof(key)?key:String(key)}(key))in obj?Object.defineProperty(obj,key,{value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}const __WEBPACK_DEFAULT_EXPORT__={title:"System/Color"};var wrapperStyle={display:"grid",gridTemplateColumns:"repeat(6, 1fr)"},colorStyle={borderRadius:"3px",borderStyle:"solid",borderWidth:"0.0625rem",borderColor:"transparent",width:"8rem",height:"8rem"},Template=function Template(){var theme=(0,_mui_material__WEBPACK_IMPORTED_MODULE_3__.Z)();return(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{style:wrapperStyle,children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.brands.cadhoc.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Cadhoc"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#C50E1F"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.brands.cultureCheck.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Chèque Culture"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#C5007B"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.brands.readCheck.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Chèque Lire"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#0070B8"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.brands.personalServices.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Service à la personne"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#009EE3"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.brands.lunch.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Déjeuner"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#F59100"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.grey[200]})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Gris très clair"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#F2F2F2"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.grey[400]})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Gris clair"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#D7D7D7"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.grey[600]})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Gris Foncé"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#979797"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.grey[800]})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Gris très foncé"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#494949"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.primary.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Up"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#F59100"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.primary.dark})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Up foncé"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#C47400"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.primary.light})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Up clair"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#FDE9CC"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.success.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Success"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#6DBD8E"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.warning.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Warning"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#C07300"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.info.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Info"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#039EB2"})]}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsxs)("div",{children:[(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)("div",{style:_objectSpread(_objectSpread({},colorStyle),{},{background:theme.palette.error.main})}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"Error"}),(0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_2__.jsx)(_Typography__WEBPACK_IMPORTED_MODULE_1__.Z,{variant:"body1",children:"#D0021B"})]})]})};Template.displayName="Template";var All=Template.bind({});All.parameters=_objectSpread(_objectSpread({},All.parameters),{},{docs:_objectSpread(_objectSpread({},null===(_All$parameters=All.parameters)||void 0===_All$parameters?void 0:_All$parameters.docs),{},{source:_objectSpread({originalSource:'() => {\n const theme = useTheme();\n return <div style={wrapperStyle}>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.brands.cadhoc.main\n }}></div>\n <Typography variant="body1">Cadhoc</Typography>\n <Typography variant="body1">#C50E1F</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.brands.cultureCheck.main\n }}></div>\n <Typography variant="body1">Chèque Culture</Typography>\n <Typography variant="body1">#C5007B</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.brands.readCheck.main\n }}></div>\n <Typography variant="body1">Chèque Lire</Typography>\n <Typography variant="body1">#0070B8</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.brands.personalServices.main\n }}></div>\n <Typography variant="body1">Service à la personne</Typography>\n <Typography variant="body1">#009EE3</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.brands.lunch.main\n }}></div>\n <Typography variant="body1">Déjeuner</Typography>\n <Typography variant="body1">#F59100</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.grey[\'200\']\n }}></div>\n <Typography variant="body1">Gris très clair</Typography>\n <Typography variant="body1">#F2F2F2</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.grey[\'400\']\n }}></div>\n <Typography variant="body1">Gris clair</Typography>\n <Typography variant="body1">#D7D7D7</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.grey[\'600\']\n }}></div>\n <Typography variant="body1">Gris Foncé</Typography>\n <Typography variant="body1">#979797</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.grey[\'800\']\n }}></div>\n <Typography variant="body1">Gris très foncé</Typography>\n <Typography variant="body1">#494949</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.primary.main\n }}></div>\n <Typography variant="body1">Up</Typography>\n <Typography variant="body1">#F59100</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.primary.dark\n }}></div>\n <Typography variant="body1">Up foncé</Typography>\n <Typography variant="body1">#C47400</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.primary.light\n }}></div>\n <Typography variant="body1">Up clair</Typography>\n <Typography variant="body1">#FDE9CC</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.success.main\n }}></div>\n <Typography variant="body1">Success</Typography>\n <Typography variant="body1">#6DBD8E</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.warning.main\n }}></div>\n <Typography variant="body1">Warning</Typography>\n <Typography variant="body1">#C07300</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.info.main\n }}></div>\n <Typography variant="body1">Info</Typography>\n <Typography variant="body1">#039EB2</Typography>\n </div>\n <div>\n <div style={{\n ...colorStyle,\n background: theme.palette.error.main\n }}></div>\n <Typography variant="body1">Error</Typography>\n <Typography variant="body1">#D0021B</Typography>\n </div>\n </div>;\n}'},null===(_All$parameters2=All.parameters)||void 0===_All$parameters2||null===(_All$parameters2$docs=_All$parameters2.docs)||void 0===_All$parameters2$docs?void 0:_All$parameters2$docs.source)})});var __namedExportsOrder=["All"]}}]);