@zydon/common 2.9.28 → 2.9.30
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -7,15 +7,15 @@ import '../../../chunk-Z6YXPKWP.js';
|
|
|
7
7
|
import { useCallback, useMemo } from 'react';
|
|
8
8
|
import { useFormContext, useFieldArray } from 'react-hook-form';
|
|
9
9
|
import w from '@mui/material/Divider';
|
|
10
|
-
import
|
|
10
|
+
import B from '@mui/material/IconButton';
|
|
11
11
|
import F from '@mui/material/InputAdornment';
|
|
12
12
|
import n from '@mui/material/Stack';
|
|
13
13
|
import M from '@mui/material/Typography';
|
|
14
|
-
import
|
|
14
|
+
import x from '@mui/material/Alert';
|
|
15
15
|
import { styled, alpha } from '@mui/material/styles';
|
|
16
16
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
17
17
|
|
|
18
|
-
var u=[{label:"XML",value:"XML"},{label:"JSON",value:"JSON"},{label:"BYTEA",value:"BYTEA"}],T=[{label:"GET",value:"GET"},{label:"POST",value:"POST"},{label:"DELETE",value:"DELETE"},{label:"PUT",value:"PUT"}];var y=styled(
|
|
18
|
+
var u=[{label:"XML",value:"XML"},{label:"JSON",value:"JSON"},{label:"BYTEA",value:"BYTEA"}],T=[{label:"GET",value:"GET"},{label:"POST",value:"POST"},{label:"DELETE",value:"DELETE"},{label:"PUT",value:"PUT"}];var y=styled(B)(({theme:o})=>({svg:{color:`${o.palette.primary.main} !important`}})),h=styled(M)(()=>({textDecoration:"underline",fontWeight:"600",cursor:"pointer"})),f=styled(x)(({theme:o})=>({backgroundColor:`${alpha(o.palette.primary.main,.03)}`,border:`1px solid ${alpha(o.palette.primary.main,.4)}`,flexDirection:"row",alignItems:"center",padding:"2px 12px",gap:8,borderRadius:8,marginBottom:16,"& svg":{color:o.palette.primary.main}}));var N=()=>{let o=()=>{let a="https://ajuda.zydon.com.br/sobre-webhooks";window.open(a,"_blank");};return jsx(f,{severity:"info",children:jsxs(M,{color:"grey",variant:"caption",children:["Webhooks permitem que servi\xE7os externos sejam notificados quando determinados eventos acontecem. Saiba mais"," ",jsx(h,{variant:"caption",color:"primary",onClick:()=>o(),children:"acessando a documenta\xE7\xE3o do Webhook"})]})})},v=N;var G={required:{value:!0,message:"Campo Tipo de conte\xFAdo \xE9 obrigat\xF3rio"}},J={required:{value:!0,message:"Campo M\xE9todo HTTP \xE9 obrigat\xF3rio"}},X={required:{value:!0,message:"Url \xE9 obrigat\xF3rio"}},z={required:{value:!0,message:""}},K=({webhookData:o,isEditing:a$4=!1,haveTip:k=!1,hasFilter:C=!0,hasType:A=!0})=>{let{control:P}=useFormContext(),{fields:I,append:d,remove:O}=useFieldArray({name:"headers",control:P}),_=useCallback(()=>{d({value:"",name:""});},[d]),m=useCallback(()=>{o?.resource_id&&navigator.clipboard.writeText(o.resource_id).catch(()=>{});},[o?.resource_id]),L=useMemo(()=>({endAdornment:jsx(F,{position:"end",children:jsx(y,{"aria-label":"Copiar ID origem",onClick:m,children:jsx(a,{className:"copyIcon",icon:"COPY_CONTENT"})})})}),[m]);return jsxs(Fragment,{children:[k&&jsx(v,{}),a$4&&jsx(a$1,{name:"name",label:"Nome do webhook"}),jsxs(n,{direction:"row",gap:2,children:[jsx(a$1,{name:"url",label:"URL de endpoint",rules:X}),C&&jsx(a$1,{name:"filter",label:"Filtro"})]}),a$4&&o&&jsxs(Fragment,{children:[jsx(a$1,{variant:"filled",name:"solution",label:"Solu\xE7\xE3o",disabled:!0}),jsxs(n,{direction:"row",gap:2,children:[jsx(a$1,{variant:"filled",name:"resource",label:"Origem",disabled:!0}),jsx(a$1,{variant:"filled",name:"resource_id",label:"ID origem",disabled:!0,InputProps:L}),jsx(a$1,{variant:"filled",name:"event",label:"Evento",disabled:!0})]})]}),jsxs(n,{direction:"row",gap:2,alignItems:"center",children:[A&&jsx(a$2,{fullWidth:!0,options:u,name:"content_type",label:"Tipo de conte\xFAdo",required:!0,rules:G}),jsx(a$2,{fullWidth:!0,options:T,name:"http_method",label:"M\xE9todo HTTP",required:!0,rules:J})]}),jsx(M,{variant:"overline",color:"grey",children:"Cabe\xE7alho"}),I?.map((W,l)=>jsxs(n,{direction:"row",gap:2,alignItems:"center",children:[jsx(a$1,{name:`headers.${l}.name`,label:"Chave",required:!0,rules:z}),jsx(a$1,{name:`headers.${l}.value`,label:"Valor"}),jsx(B,{"aria-label":"Remover cabe\xE7alho",color:"error",onClick:()=>O(l),children:jsx(a,{icon:"DELETE_MARK_BUTTON_02"})})]},W.id)),jsx(a$3,{actionType:"NEW",size:"large",variant:"outlined",color:"inherit",fullWidth:!0,onClick:_,children:"Adicionar novo cabe\xE7alho"}),jsx(w,{})]})},Ee=K;
|
|
19
19
|
|
|
20
20
|
export { Ee as default };
|
|
21
21
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/form/Webhook/index.tsx","../../../../src/components/form/Webhook/props.ts","../../../../src/components/form/Webhook/styles.ts","../../../../src/components/form/Webhook/WebhookAlert.tsx"],"names":["useCallback","useMemo","useFieldArray","useFormContext","Divider","IconButton","InputAdornment","Stack","Typography","ContentTypeOptions","HttpMethodOptions","Alert","alpha","styled","SyledIconButton","theme","StyledTypography","StyledAlert","jsx","jsxs","WebhookAlert","handleLinkClick","url","WebhookAlert_default","Fragment","CONTENT_TYPE_RULES","HTTP_METHOD_RULES","URL_RULES","HEADER_KEY_RULES","Webhook","webhookData","isEditing","haveTip","hasFilter","hasType","control","headers","append","remove","handleCreateField","handleCopyResourceId","resourceIdInputProps","Icon_default","Field_default","Autocomplete_default","item","index","ActionButton_default","Webhook_default"],"mappings":"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","sourcesContent":["import { useCallback, useMemo } from 'react';\nimport { useFieldArray, useFormContext } from 'react-hook-form';\nimport Divider from '@mui/material/Divider';\nimport IconButton from '@mui/material/IconButton';\nimport InputAdornment from '@mui/material/InputAdornment';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\n\nimport ActionButton from 'components/ActionButton';\nimport Icon from 'components/Icon';\n\nimport Autocomplete from '../Autocomplete';\nimport Field from '../Field';\n\nimport { ContentTypeOptions, HttpMethodOptions, WebhookProps } from './props';\nimport { SyledIconButton } from './styles';\nimport WebhookAlert from './WebhookAlert';\n\nconst CONTENT_TYPE_RULES = {\n required: { value: true, message: 'Campo Tipo de conteúdo é obrigatório' },\n} as const;\n\nconst HTTP_METHOD_RULES = {\n required: { value: true, message: 'Campo Método HTTP é obrigatório' },\n} as const;\n\nconst URL_RULES = {\n required: { value: true, message: 'Url é obrigatório' },\n} as const;\n\nconst HEADER_KEY_RULES = {\n required: { value: true, message: '' },\n} as const;\n\nconst Webhook = ({\n webhookData,\n isEditing = false,\n haveTip = false,\n hasFilter = true,\n hasType = true,\n}: WebhookProps) => {\n const { control } = useFormContext();\n\n const {\n fields: headers,\n append,\n remove,\n } = useFieldArray({\n name: 'headers',\n control,\n });\n\n const handleCreateField = useCallback(() => {\n append({ value: '', name: '' });\n }, [append]);\n\n const handleCopyResourceId = useCallback(() => {\n if (!webhookData?.resource_id) return;\n navigator.clipboard\n .writeText(webhookData.resource_id)\n .catch(() => undefined);\n }, [webhookData?.resource_id]);\n\n const resourceIdInputProps = useMemo(\n () => ({\n endAdornment: (\n <InputAdornment position=\"end\">\n <SyledIconButton\n aria-label=\"Copiar ID origem\"\n onClick={handleCopyResourceId}\n >\n <Icon className=\"copyIcon\" icon=\"COPY_CONTENT\" />\n </SyledIconButton>\n </InputAdornment>\n ),\n }),\n [handleCopyResourceId],\n );\n\n return (\n <>\n {haveTip && <WebhookAlert />}\n {isEditing && <Field name=\"name\" label=\"Nome do webhook\" />}\n <Stack direction=\"row\" gap={2}>\n <Field name=\"url\" label=\"URL de endpoint\" rules={URL_RULES} />\n {hasFilter && <Field name=\"filter\" label=\"Filtro\" />}\n </Stack>\n {isEditing && webhookData && (\n <>\n <Field variant=\"filled\" name=\"solution\" label=\"Solução\" disabled />\n <Stack direction=\"row\" gap={2}>\n <Field variant=\"filled\" name=\"resource\" label=\"Origem\" disabled />\n <Field\n variant=\"filled\"\n name=\"resource_id\"\n label=\"ID origem\"\n disabled\n InputProps={resourceIdInputProps}\n />\n <Field variant=\"filled\" name=\"event\" label=\"Evento\" disabled />\n </Stack>\n </>\n )}\n <Stack direction=\"row\" gap={2} alignItems=\"center\">\n {hasType && (\n <Autocomplete\n fullWidth\n options={ContentTypeOptions}\n name=\"content_type\"\n label=\"Tipo de conteúdo\"\n required\n rules={CONTENT_TYPE_RULES}\n />\n )}\n <Autocomplete\n fullWidth\n options={HttpMethodOptions}\n name=\"http_method\"\n label=\"Método HTTP\"\n required\n rules={HTTP_METHOD_RULES}\n />\n </Stack>\n <Typography variant=\"overline\" color=\"grey\">\n Cabeçalho\n </Typography>\n {headers?.map((item, index) => (\n <Stack key={item.id} direction=\"row\" gap={2} alignItems=\"center\">\n <Field\n name={`headers.${index}.name`}\n label=\"Chave\"\n required\n rules={HEADER_KEY_RULES}\n />\n <Field name={`headers.${index}.value`} label=\"Valor\" />\n <IconButton\n aria-label=\"Remover cabeçalho\"\n color=\"error\"\n onClick={() => remove(index)}\n >\n <Icon icon=\"DELETE_MARK_BUTTON_02\" />\n </IconButton>\n </Stack>\n ))}\n <ActionButton\n actionType=\"NEW\"\n size=\"large\"\n variant=\"outlined\"\n color=\"inherit\"\n fullWidth\n onClick={handleCreateField}\n >\n Adicionar novo cabeçalho\n </ActionButton>\n <Divider />\n </>\n );\n};\n\nexport default Webhook;\n","import { WebhookType } from 'types/webhook';\n\nexport interface WebhookProps {\n webhookData?: WebhookType;\n isEditing?: boolean;\n haveTip?: boolean;\n hasFilter?: boolean;\n hasType?: boolean;\n}\nexport enum ContentTypeStatus {\n XML = 'XML',\n JSON = 'JSON',\n BYTEA = 'BYTEA',\n}\n\nexport enum HttpMethodStatus {\n GET = 'GET',\n POST = 'POST',\n PATCH = 'PATCH',\n DELETE = 'DELETE',\n PUT = 'PUT',\n}\n\nexport const ContentTypeOptions = [\n {\n label: ContentTypeStatus.XML,\n value: ContentTypeStatus.XML,\n },\n {\n label: ContentTypeStatus.JSON,\n value: ContentTypeStatus.JSON,\n },\n {\n label: ContentTypeStatus.BYTEA,\n value: ContentTypeStatus.BYTEA,\n },\n];\n\nexport const HttpMethodOptions = [\n {\n label: HttpMethodStatus.GET,\n value: HttpMethodStatus.GET,\n },\n {\n label: HttpMethodStatus.POST,\n value: HttpMethodStatus.POST,\n },\n {\n label: HttpMethodStatus.DELETE,\n value: HttpMethodStatus.DELETE,\n },\n {\n label: HttpMethodStatus.PUT,\n value: HttpMethodStatus.PUT,\n },\n];\n","import Alert from '@mui/material/Alert';\nimport IconButton from '@mui/material/IconButton';\nimport { alpha, styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nexport const SyledIconButton = styled(IconButton)(({ theme }) => ({\n svg: {\n color: `${theme.palette.primary.main} !important`,\n },\n}));\n\nexport const StyledTypography = styled(Typography)(() => ({\n textDecoration: 'underline',\n fontWeight: '600',\n cursor: 'pointer',\n}));\n\nexport const StyledAlert = styled(Alert)(({ theme }) => ({\n backgroundColor: `${alpha(theme.palette.primary.main, 0.03)}`,\n border: `1px solid ${alpha(theme.palette.primary.main, 0.4)}`,\n flexDirection: 'row',\n alignItems: 'center',\n padding: '2px 12px',\n gap: 8,\n borderRadius: 8,\n marginBottom: 16,\n\n '& svg': {\n color: theme.palette.primary.main,\n },\n}));\n","import Typography from '@mui/material/Typography';\n\nimport { StyledAlert, StyledTypography } from './styles';\n\nconst WebhookAlert = () => {\n const handleLinkClick = () => {\n const url =\n 'https://ajuda.zydon.com.br/pt-BR/articles/9180603-sobre-webhooks';\n window.open(url, '_blank');\n };\n\n return (\n <StyledAlert severity=\"info\">\n <Typography color=\"grey\" variant=\"caption\">\n Webhooks permitem que serviços externos sejam notificados quando\n determinados eventos acontecem. Saiba mais{' '}\n <StyledTypography\n variant=\"caption\"\n color=\"primary\"\n onClick={() => handleLinkClick()}\n >\n acessando a documentação do Webhook\n </StyledTypography>\n </Typography>\n </StyledAlert>\n );\n};\n\nexport default WebhookAlert;\n"]}
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/form/Webhook/index.tsx","../../../../src/components/form/Webhook/props.ts","../../../../src/components/form/Webhook/styles.ts","../../../../src/components/form/Webhook/WebhookAlert.tsx"],"names":["useCallback","useMemo","useFieldArray","useFormContext","Divider","IconButton","InputAdornment","Stack","Typography","ContentTypeOptions","HttpMethodOptions","Alert","alpha","styled","SyledIconButton","theme","StyledTypography","StyledAlert","jsx","jsxs","WebhookAlert","handleLinkClick","url","WebhookAlert_default","Fragment","CONTENT_TYPE_RULES","HTTP_METHOD_RULES","URL_RULES","HEADER_KEY_RULES","Webhook","webhookData","isEditing","haveTip","hasFilter","hasType","control","headers","append","remove","handleCreateField","handleCopyResourceId","resourceIdInputProps","Icon_default","Field_default","Autocomplete_default","item","index","ActionButton_default","Webhook_default"],"mappings":"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","sourcesContent":["import { useCallback, useMemo } from 'react';\nimport { useFieldArray, useFormContext } from 'react-hook-form';\nimport Divider from '@mui/material/Divider';\nimport IconButton from '@mui/material/IconButton';\nimport InputAdornment from '@mui/material/InputAdornment';\nimport Stack from '@mui/material/Stack';\nimport Typography from '@mui/material/Typography';\n\nimport ActionButton from 'components/ActionButton';\nimport Icon from 'components/Icon';\n\nimport Autocomplete from '../Autocomplete';\nimport Field from '../Field';\n\nimport { ContentTypeOptions, HttpMethodOptions, WebhookProps } from './props';\nimport { SyledIconButton } from './styles';\nimport WebhookAlert from './WebhookAlert';\n\nconst CONTENT_TYPE_RULES = {\n required: { value: true, message: 'Campo Tipo de conteúdo é obrigatório' },\n} as const;\n\nconst HTTP_METHOD_RULES = {\n required: { value: true, message: 'Campo Método HTTP é obrigatório' },\n} as const;\n\nconst URL_RULES = {\n required: { value: true, message: 'Url é obrigatório' },\n} as const;\n\nconst HEADER_KEY_RULES = {\n required: { value: true, message: '' },\n} as const;\n\nconst Webhook = ({\n webhookData,\n isEditing = false,\n haveTip = false,\n hasFilter = true,\n hasType = true,\n}: WebhookProps) => {\n const { control } = useFormContext();\n\n const {\n fields: headers,\n append,\n remove,\n } = useFieldArray({\n name: 'headers',\n control,\n });\n\n const handleCreateField = useCallback(() => {\n append({ value: '', name: '' });\n }, [append]);\n\n const handleCopyResourceId = useCallback(() => {\n if (!webhookData?.resource_id) return;\n navigator.clipboard\n .writeText(webhookData.resource_id)\n .catch(() => undefined);\n }, [webhookData?.resource_id]);\n\n const resourceIdInputProps = useMemo(\n () => ({\n endAdornment: (\n <InputAdornment position=\"end\">\n <SyledIconButton\n aria-label=\"Copiar ID origem\"\n onClick={handleCopyResourceId}\n >\n <Icon className=\"copyIcon\" icon=\"COPY_CONTENT\" />\n </SyledIconButton>\n </InputAdornment>\n ),\n }),\n [handleCopyResourceId],\n );\n\n return (\n <>\n {haveTip && <WebhookAlert />}\n {isEditing && <Field name=\"name\" label=\"Nome do webhook\" />}\n <Stack direction=\"row\" gap={2}>\n <Field name=\"url\" label=\"URL de endpoint\" rules={URL_RULES} />\n {hasFilter && <Field name=\"filter\" label=\"Filtro\" />}\n </Stack>\n {isEditing && webhookData && (\n <>\n <Field variant=\"filled\" name=\"solution\" label=\"Solução\" disabled />\n <Stack direction=\"row\" gap={2}>\n <Field variant=\"filled\" name=\"resource\" label=\"Origem\" disabled />\n <Field\n variant=\"filled\"\n name=\"resource_id\"\n label=\"ID origem\"\n disabled\n InputProps={resourceIdInputProps}\n />\n <Field variant=\"filled\" name=\"event\" label=\"Evento\" disabled />\n </Stack>\n </>\n )}\n <Stack direction=\"row\" gap={2} alignItems=\"center\">\n {hasType && (\n <Autocomplete\n fullWidth\n options={ContentTypeOptions}\n name=\"content_type\"\n label=\"Tipo de conteúdo\"\n required\n rules={CONTENT_TYPE_RULES}\n />\n )}\n <Autocomplete\n fullWidth\n options={HttpMethodOptions}\n name=\"http_method\"\n label=\"Método HTTP\"\n required\n rules={HTTP_METHOD_RULES}\n />\n </Stack>\n <Typography variant=\"overline\" color=\"grey\">\n Cabeçalho\n </Typography>\n {headers?.map((item, index) => (\n <Stack key={item.id} direction=\"row\" gap={2} alignItems=\"center\">\n <Field\n name={`headers.${index}.name`}\n label=\"Chave\"\n required\n rules={HEADER_KEY_RULES}\n />\n <Field name={`headers.${index}.value`} label=\"Valor\" />\n <IconButton\n aria-label=\"Remover cabeçalho\"\n color=\"error\"\n onClick={() => remove(index)}\n >\n <Icon icon=\"DELETE_MARK_BUTTON_02\" />\n </IconButton>\n </Stack>\n ))}\n <ActionButton\n actionType=\"NEW\"\n size=\"large\"\n variant=\"outlined\"\n color=\"inherit\"\n fullWidth\n onClick={handleCreateField}\n >\n Adicionar novo cabeçalho\n </ActionButton>\n <Divider />\n </>\n );\n};\n\nexport default Webhook;\n","import { WebhookType } from 'types/webhook';\n\nexport interface WebhookProps {\n webhookData?: WebhookType;\n isEditing?: boolean;\n haveTip?: boolean;\n hasFilter?: boolean;\n hasType?: boolean;\n}\nexport enum ContentTypeStatus {\n XML = 'XML',\n JSON = 'JSON',\n BYTEA = 'BYTEA',\n}\n\nexport enum HttpMethodStatus {\n GET = 'GET',\n POST = 'POST',\n PATCH = 'PATCH',\n DELETE = 'DELETE',\n PUT = 'PUT',\n}\n\nexport const ContentTypeOptions = [\n {\n label: ContentTypeStatus.XML,\n value: ContentTypeStatus.XML,\n },\n {\n label: ContentTypeStatus.JSON,\n value: ContentTypeStatus.JSON,\n },\n {\n label: ContentTypeStatus.BYTEA,\n value: ContentTypeStatus.BYTEA,\n },\n];\n\nexport const HttpMethodOptions = [\n {\n label: HttpMethodStatus.GET,\n value: HttpMethodStatus.GET,\n },\n {\n label: HttpMethodStatus.POST,\n value: HttpMethodStatus.POST,\n },\n {\n label: HttpMethodStatus.DELETE,\n value: HttpMethodStatus.DELETE,\n },\n {\n label: HttpMethodStatus.PUT,\n value: HttpMethodStatus.PUT,\n },\n];\n","import Alert from '@mui/material/Alert';\nimport IconButton from '@mui/material/IconButton';\nimport { alpha, styled } from '@mui/material/styles';\nimport Typography from '@mui/material/Typography';\n\nexport const SyledIconButton = styled(IconButton)(({ theme }) => ({\n svg: {\n color: `${theme.palette.primary.main} !important`,\n },\n}));\n\nexport const StyledTypography = styled(Typography)(() => ({\n textDecoration: 'underline',\n fontWeight: '600',\n cursor: 'pointer',\n}));\n\nexport const StyledAlert = styled(Alert)(({ theme }) => ({\n backgroundColor: `${alpha(theme.palette.primary.main, 0.03)}`,\n border: `1px solid ${alpha(theme.palette.primary.main, 0.4)}`,\n flexDirection: 'row',\n alignItems: 'center',\n padding: '2px 12px',\n gap: 8,\n borderRadius: 8,\n marginBottom: 16,\n\n '& svg': {\n color: theme.palette.primary.main,\n },\n}));\n","import Typography from '@mui/material/Typography';\n\nimport { StyledAlert, StyledTypography } from './styles';\n\nconst WebhookAlert = () => {\n const handleLinkClick = () => {\n const url =\n 'https://ajuda.zydon.com.br/sobre-webhooks';\n window.open(url, '_blank');\n };\n\n return (\n <StyledAlert severity=\"info\">\n <Typography color=\"grey\" variant=\"caption\">\n Webhooks permitem que serviços externos sejam notificados quando\n determinados eventos acontecem. Saiba mais{' '}\n <StyledTypography\n variant=\"caption\"\n color=\"primary\"\n onClick={() => handleLinkClick()}\n >\n acessando a documentação do Webhook\n </StyledTypography>\n </Typography>\n </StyledAlert>\n );\n};\n\nexport default WebhookAlert;\n"]}
|
|
@@ -2,7 +2,7 @@ import { a } from '../../chunk-F65ZXAGV.js';
|
|
|
2
2
|
import { styled, useTheme } from '@mui/material/styles';
|
|
3
3
|
import I from '@mui/material/Stack';
|
|
4
4
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
5
|
-
import
|
|
5
|
+
import N from '@mui/material/Box';
|
|
6
6
|
import R from '@mui/material/Container';
|
|
7
7
|
import G from '@mui/material/Toolbar';
|
|
8
8
|
import D from '@mui/material/AppBar';
|
|
@@ -10,7 +10,7 @@ import J from '@mui/material/SvgIcon';
|
|
|
10
10
|
import q from '@mui/material/IconButton';
|
|
11
11
|
import j from '@mui/material/GlobalStyles';
|
|
12
12
|
|
|
13
|
-
var L=({children:o,isNavHorizontal:t,sx:r,...e})=>jsx(I,{component:"main",flex:"1 1 auto",bgcolor:"grey.100",sx:{...t&&{"--layout-dashboard-content-pt":"40px"},...r},...e,children:o}),b=L;var s={root:"layout__root",main:"layout__main",header:"layout__header",content:"layout__main__content",hasSidebar:"layout__has__sidebar"};styled("span")(({theme:o})=>({width:1,height:10,flexShrink:0,display:"none",position:"relative",alignItems:"center",flexDirection:"column",marginLeft:o.spacing(2.5),marginRight:o.spacing(2.5),backgroundColor:"currentColor","&::before, &::after":{top:-5,width:3,height:3,content:'""',flexShrink:0,borderRadius:"50%",position:"absolute",backgroundColor:"currentColor"},"&::after":{bottom:-5,top:"auto"}}));var k=styled(D)(({theme:o})=>({zIndex:"var(--layout-header-zIndex)",backgroundColor:o.palette.background.paper,"&::before":{content:'""',position:"absolute",bottom:0,left:0,width:"100%",height:"1px",backgroundColor:o.palette.divider,zIndex:1}}));var V=({sx:o,slots:t,slotProps:r,layoutQuery:e="md",...i})=>{let a=useTheme(),n={default:{minHeight:"auto",height:"var(--layout-header-mobile-height)",backgroundColor:a.palette.background.paper,transition:a.transitions.create(["height","background-color"],{easing:a.transitions.easing.easeInOut,duration:a.transitions.duration.shorter}),[a.breakpoints.up("sm")]:{minHeight:"auto"},[a.breakpoints.up(e)]:{height:"var(--layout-header-desktop-height)"}}};return jsxs(k,{position:"sticky",sx:o,...i,children:[t?.topArea,(t?.leftArea||t?.centerArea||t?.rightArea)&&jsx(G,{disableGutters:!0,...r?.toolbar,sx:{...n.default,...r?.toolbar?.sx,maxHeight:64},children:jsxs(R,{...r?.container,sx:{height:1,display:"flex",alignItems:"center",...r?.container?.sx},children:[t?.leftArea,jsx(
|
|
13
|
+
var L=({children:o,isNavHorizontal:t,sx:r,...e})=>jsx(I,{component:"main",flex:"1 1 auto",bgcolor:"grey.100",sx:{...t&&{"--layout-dashboard-content-pt":"40px"},...r},...e,children:o}),b=L;var s={root:"layout__root",main:"layout__main",header:"layout__header",content:"layout__main__content",hasSidebar:"layout__has__sidebar"};styled("span")(({theme:o})=>({width:1,height:10,flexShrink:0,display:"none",position:"relative",alignItems:"center",flexDirection:"column",marginLeft:o.spacing(2.5),marginRight:o.spacing(2.5),backgroundColor:"currentColor","&::before, &::after":{top:-5,width:3,height:3,content:'""',flexShrink:0,borderRadius:"50%",position:"absolute",backgroundColor:"currentColor"},"&::after":{bottom:-5,top:"auto"}}));var k=styled(D)(({theme:o})=>({zIndex:"var(--layout-header-zIndex)",backgroundColor:o.palette.background.paper,"&::before":{content:'""',position:"absolute",bottom:0,left:0,width:"100%",height:"1px",backgroundColor:o.palette.divider,zIndex:1}}));var V=({sx:o,slots:t,slotProps:r,layoutQuery:e="md",...i})=>{let a=useTheme(),n={default:{minHeight:"auto",height:"var(--layout-header-mobile-height)",backgroundColor:a.palette.background.paper,transition:a.transitions.create(["height","background-color"],{easing:a.transitions.easing.easeInOut,duration:a.transitions.duration.shorter}),[a.breakpoints.up("sm")]:{minHeight:"auto"},[a.breakpoints.up(e)]:{height:"var(--layout-header-desktop-height)"}}};return jsxs(k,{position:"sticky",sx:o,...i,children:[t?.topArea,(t?.leftArea||t?.centerArea||t?.rightArea)&&jsx(G,{disableGutters:!0,...r?.toolbar,sx:{...n.default,...r?.toolbar?.sx,maxHeight:64},children:jsxs(R,{...r?.container,sx:{height:1,display:"flex",alignItems:"center",...r?.container?.sx},children:[t?.leftArea,jsx(N,{sx:{display:"flex",flex:"1 1 auto",justifyContent:"center"},children:t?.centerArea}),t?.rightArea]})}),t?.bottomArea]})},B=V;var X=({sx:o,slots:t,slotProps:r,layoutQuery:e,...i})=>jsx(B,{sx:o,layoutQuery:e,slots:{...t},slotProps:r,...i}),w=X;var A=styled(q,{shouldForwardProp:o=>o!=="isNavMini"})(({theme:o,isNavMini:t})=>({padding:8,top:15,position:"fixed",color:o.palette.action.active,backgroundColor:o.palette.background.paper,transform:"translateX(-50%)",zIndex:"var(--layout-nav-zIndex)",left:t?"var(--layout-nav-mini-width)":"var(--layout-nav-vertical-width)",border:`1px solid ${o.palette.divider}`,transition:o.transitions.create(["left"],{easing:"var(--layout-transition-easing)",duration:"var(--layout-transition-duration)"}),"&:hover":{color:o.palette.text.primary,backgroundColor:o.palette.background.neutral}}));var K=({isNavMini:o,...t})=>jsx(A,{size:"small",isNavMini:o,...t,children:jsx(J,{sx:{width:16,height:16,...o&&{transform:"scaleX(-1)"}},children:jsx("path",{fill:"currentColor",d:"M13.83 19a1 1 0 0 1-.78-.37l-4.83-6a1 1 0 0 1 0-1.27l5-6a1 1 0 0 1 1.54 1.28L10.29 12l4.32 5.36a1 1 0 0 1-.78 1.64"})})}),P=K;styled(I)({padding:"12px 16px 24px",svg:{width:125}});styled(I)({padding:"12px 24px 24px",alignItems:"center",justifyContent:"center",svg:{width:32,height:32}});var _=styled(N,{shouldForwardProp:o=>o!=="isNavMini"&&o!=="layoutQuery"})(({theme:o,isNavMini:t,layoutQuery:r})=>({top:0,left:0,height:"100%",display:"none",position:"fixed",flexDirection:"column",backgroundColor:o.palette.background.paper,zIndex:"var(--layout-nav-zIndex)",width:t?"var(--layout-nav-mini-width)":"var(--layout-nav-vertical-width)",borderRight:`1px solid ${o.palette.divider}`,transition:o.transitions.create(["width"],{easing:"var(--layout-transition-easing)",duration:"var(--layout-transition-duration)"}),[o.breakpoints.up(r)]:{display:"flex"}}));var Z=({slots:o,isNavMini:t,layoutQuery:r,onToggleNav:e,children:i})=>{let a$1=useTheme(),n=jsxs(Fragment,{children:[o?.topArea,jsx(a,{fillContent:!0,autoHide:!1,sx:{p:2},children:i}),o?.bottomArea]}),m=jsxs(Fragment,{children:[o?.topArea,jsx(a,{fillContent:!0,autoHide:!1,sx:{p:2},children:i}),o?.bottomArea]});return jsxs(_,{isNavMini:t,layoutQuery:r,children:[jsx(P,{isNavMini:t,onClick:e,sx:{display:"none",[a$1.breakpoints.up(r)]:{display:"inline-flex"}}}),t?m:n]})},M=Z;var oo=({sx:o,cssVars:t,children:r,footerSection:e,headerSection:i,sidebarSection:a})=>jsxs(Fragment,{children:[jsx(j,{styles:{body:{"--layout-nav-zIndex":1101,"--layout-nav-mobile-width":"320px","--layout-header-blur":"8px","--layout-header-zIndex":1100,"--layout-header-mobile-height":"64px","--layout-header-desktop-height":"72px",...t}}}),jsx(N,{id:"root__layout",sx:o,children:a?jsxs(Fragment,{children:[a,jsxs(N,{display:"flex",flex:"1 1 auto",flexDirection:"column",className:s.hasSidebar,children:[i,r,e]})]}):jsxs(Fragment,{children:[i,r,e]})})]}),T=oo;var ro=({children:o,footerContent:t,headerProps:r,sidebarContent:e,sidebarProps:i,isNavMini:a,onToggleNavMini:n,mainProps:m})=>{let l=useTheme(),p="lg";return jsx(T,{headerSection:jsx(w,{layoutQuery:p,slotProps:{toolbar:{sx:{['& [data-area="right"]']:{gap:{xs:0,sm:.75}}}},container:{maxWidth:!1,sx:{px:{[p]:5}}}},slots:r?.slots}),sidebarSection:jsx(M,{isNavMini:a,layoutQuery:p,onToggleNav:n,slots:i?.slots,children:e}),footerSection:t,cssVars:{"--layout-transition-easing":"linear","--layout-transition-duration":"120ms","--layout-nav-mini-width":"88px","--layout-nav-vertical-width":"300px","--layout-nav-horizontal-height":"64px","--layout-dashboard-content-pt":l.spacing(1),"--layout-dashboard-content-pb":l.spacing(8),"--layout-dashboard-content-px":l.spacing(5)},sx:{[`& .${s.hasSidebar}`]:{[l.breakpoints.up(p)]:{transition:l.transitions.create(["padding-left"],{easing:"var(--layout-transition-easing)",duration:"var(--layout-transition-duration)"}),pl:a?"var(--layout-nav-mini-width)":"var(--layout-nav-vertical-width)"}}},children:jsx(b,{isNavHorizontal:!1,...m,children:o})})},jo=ro;
|
|
14
14
|
|
|
15
15
|
export { jo as default };
|
|
16
16
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/layouts/Admin/index.tsx","../../../src/layouts/Admin/Wrapper/Main.tsx","../../../src/layouts/Admin/classes.ts","../../../src/layouts/Admin/Header/HeaderSection.tsx","../../../src/layouts/Admin/Header/styles.ts","../../../src/layouts/Admin/Header/index.tsx","../../../src/layouts/Admin/Sidebar/index.tsx","../../../src/layouts/Admin/NavToggleButton/index.tsx","../../../src/layouts/Admin/NavToggleButton/styles.ts","../../../src/layouts/Admin/Sidebar/styles.ts","../../../src/layouts/Admin/Wrapper/index.tsx"],"names":["useTheme","Stack","jsx","Main","children","isNavHorizontal","sx","other","Main_default","layoutClasses","Box","Container","Toolbar","MuiAppBar","styled","StyledDivider","theme","AppBar","jsxs","HeaderSection","slots","slotProps","layoutQuery","toolbarStyles","HeaderSection_default","Header","Header_default","SvgIcon","IconButton","Button","prop","isNavMini","NavToggleButton","NavToggleButton_default","LogoFull","LogoMini","Fragment","Sidebar","onToggleNav","renderNavVertical","Scrollbar_default","renderNavMini","Sidebar_default","GlobalStyles","Wrapper","cssVars","footerSection","headerSection","sidebarSection","Wrapper_default","Admin","footerContent","headerProps","sidebarContent","sidebarProps","onToggleNavMini","mainProps","Admin_default"],"mappings":"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","sourcesContent":["import { PropsWithChildren } from 'react';\nimport type { Breakpoint } from '@mui/material/styles';\nimport { useTheme } from '@mui/material/styles';\n\nimport Main from './Wrapper/Main';\nimport { layoutClasses } from './classes';\nimport Header from './Header';\nimport { AdminProps } from './props';\nimport Sidebar from './Sidebar';\nimport Wrapper from './Wrapper';\n\nconst Admin = ({\n children,\n footerContent,\n headerProps,\n sidebarContent,\n sidebarProps,\n isNavMini,\n onToggleNavMini,\n mainProps,\n}: PropsWithChildren<AdminProps>) => {\n const theme = useTheme();\n\n const layoutQuery: Breakpoint = 'lg';\n\n return (\n <Wrapper\n headerSection={\n <Header\n layoutQuery={layoutQuery}\n slotProps={{\n toolbar: {\n sx: {\n ['& [data-area=\"right\"]']: {\n gap: { xs: 0, sm: 0.75 },\n },\n },\n },\n container: {\n maxWidth: false,\n sx: {\n px: { [layoutQuery]: 5 },\n },\n },\n }}\n slots={headerProps?.slots}\n />\n }\n sidebarSection={\n <Sidebar\n isNavMini={isNavMini}\n layoutQuery={layoutQuery}\n onToggleNav={onToggleNavMini}\n slots={sidebarProps?.slots}\n >\n {sidebarContent}\n </Sidebar>\n }\n footerSection={footerContent}\n cssVars={{\n '--layout-transition-easing': 'linear',\n '--layout-transition-duration': '120ms',\n '--layout-nav-mini-width': '88px',\n '--layout-nav-vertical-width': '300px',\n '--layout-nav-horizontal-height': '64px',\n '--layout-dashboard-content-pt': theme.spacing(1),\n '--layout-dashboard-content-pb': theme.spacing(8),\n '--layout-dashboard-content-px': theme.spacing(5),\n }}\n sx={{\n [`& .${layoutClasses.hasSidebar}`]: {\n [theme.breakpoints.up(layoutQuery)]: {\n transition: theme.transitions.create(['padding-left'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n pl: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n },\n },\n }}\n >\n <Main isNavHorizontal={false} {...mainProps}>\n {children}\n </Main>\n </Wrapper>\n );\n};\n\nexport default Admin;\n","import Stack from '@mui/material/Stack';\n\nimport { MainProps } from './props';\n\nconst Main = ({ children, isNavHorizontal, sx, ...other }: MainProps) => {\n return (\n <Stack\n component=\"main\"\n flex=\"1 1 auto\"\n bgcolor=\"grey.100\"\n sx={{\n ...(isNavHorizontal && {\n '--layout-dashboard-content-pt': '40px',\n }),\n ...sx,\n }}\n {...other}\n >\n {children}\n </Stack>\n );\n};\n\nexport default Main;\n","export const layoutClasses = {\n root: 'layout__root',\n main: 'layout__main',\n header: 'layout__header',\n content: 'layout__main__content',\n hasSidebar: 'layout__has__sidebar',\n};\n","import Box from '@mui/material/Box';\nimport Container from '@mui/material/Container';\nimport { useTheme } from '@mui/material/styles';\nimport Toolbar from '@mui/material/Toolbar';\n\nimport { HeaderSectionProps } from './props';\nimport { AppBar } from './styles';\n\nconst HeaderSection = ({\n sx,\n slots,\n slotProps,\n layoutQuery = 'md',\n ...other\n}: HeaderSectionProps) => {\n const theme = useTheme();\n\n const toolbarStyles = {\n default: {\n minHeight: 'auto',\n height: 'var(--layout-header-mobile-height)',\n backgroundColor: theme.palette.background.paper,\n transition: theme.transitions.create(['height', 'background-color'], {\n easing: theme.transitions.easing.easeInOut,\n duration: theme.transitions.duration.shorter,\n }),\n [theme.breakpoints.up('sm')]: {\n minHeight: 'auto',\n },\n [theme.breakpoints.up(layoutQuery)]: {\n height: 'var(--layout-header-desktop-height)',\n },\n },\n };\n\n return (\n <AppBar position=\"sticky\" sx={sx} {...other}>\n {slots?.topArea}\n\n {(slots?.leftArea || slots?.centerArea || slots?.rightArea) && (\n <Toolbar\n disableGutters\n {...slotProps?.toolbar}\n sx={{\n ...toolbarStyles.default,\n ...slotProps?.toolbar?.sx,\n maxHeight: 64,\n }}\n >\n <Container\n {...slotProps?.container}\n sx={{\n height: 1,\n display: 'flex',\n alignItems: 'center',\n ...slotProps?.container?.sx,\n }}\n >\n {slots?.leftArea}\n\n <Box\n sx={{\n display: 'flex',\n flex: '1 1 auto',\n justifyContent: 'center',\n }}\n >\n {slots?.centerArea}\n </Box>\n\n {slots?.rightArea}\n </Container>\n </Toolbar>\n )}\n\n {slots?.bottomArea}\n </AppBar>\n );\n};\n\nexport default HeaderSection;\n","import MuiAppBar from '@mui/material/AppBar';\nimport { styled } from '@mui/material/styles';\n\nexport const StyledDivider = styled('span')(({ theme }) => ({\n width: 1,\n height: 10,\n flexShrink: 0,\n display: 'none',\n position: 'relative',\n alignItems: 'center',\n flexDirection: 'column',\n marginLeft: theme.spacing(2.5),\n marginRight: theme.spacing(2.5),\n backgroundColor: 'currentColor',\n\n '&::before, &::after': {\n top: -5,\n width: 3,\n height: 3,\n content: '\"\"',\n flexShrink: 0,\n borderRadius: '50%',\n position: 'absolute',\n backgroundColor: 'currentColor',\n },\n '&::after': { bottom: -5, top: 'auto' },\n}));\n\nexport const AppBar = styled(MuiAppBar)(({ theme }) => ({\n zIndex: 'var(--layout-header-zIndex)',\n backgroundColor: theme.palette.background.paper,\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n bottom: 0,\n left: 0,\n width: '100%',\n height: '1px',\n backgroundColor: theme.palette.divider,\n zIndex: 1,\n },\n}));\n","import HeaderSection from './HeaderSection';\nimport { HeaderProps } from './props';\n\nconst Header = ({\n sx,\n slots,\n slotProps,\n layoutQuery,\n ...other\n}: HeaderProps) => {\n return (\n <HeaderSection\n sx={sx}\n layoutQuery={layoutQuery}\n slots={{\n ...slots,\n }}\n slotProps={slotProps}\n {...other}\n />\n );\n};\n\nexport default Header;\n","import { PropsWithChildren } from 'react';\nimport { useTheme } from '@mui/material/styles';\n\nimport Scrollbar from 'components/Scrollbar';\n\nimport NavToggleButton from '../NavToggleButton';\n\nimport { SidebarProps } from './props';\nimport { Container } from './styles';\n\nconst Sidebar = ({\n slots,\n isNavMini,\n layoutQuery,\n onToggleNav,\n children,\n}: PropsWithChildren<SidebarProps>) => {\n const theme = useTheme();\n\n const renderNavVertical = (\n <>\n {slots?.topArea}\n\n <Scrollbar fillContent sx={{ p: 2 }}>\n {children}\n </Scrollbar>\n\n {slots?.bottomArea}\n </>\n );\n\n const renderNavMini = (\n <>\n {slots?.topArea}\n\n <Scrollbar fillContent sx={{ p: 2 }}>\n {children}\n </Scrollbar>\n\n {slots?.bottomArea}\n </>\n );\n\n return (\n <Container isNavMini={isNavMini} layoutQuery={layoutQuery}>\n <NavToggleButton\n isNavMini={isNavMini}\n onClick={onToggleNav}\n sx={{\n display: 'none',\n [theme.breakpoints.up(layoutQuery)]: {\n display: 'inline-flex',\n },\n }}\n />\n {isNavMini ? renderNavMini : renderNavVertical}\n </Container>\n );\n};\n\nexport default Sidebar;\n","import SvgIcon from '@mui/material/SvgIcon';\n\nimport { NavToggleButtonProps } from './props';\nimport { Button } from './styles';\n\nconst NavToggleButton = ({ isNavMini, ...other }: NavToggleButtonProps) => {\n return (\n <Button size=\"small\" isNavMini={isNavMini} {...other}>\n <SvgIcon\n sx={{\n width: 16,\n height: 16,\n ...(isNavMini && {\n transform: 'scaleX(-1)',\n }),\n }}\n >\n <path\n fill=\"currentColor\"\n d=\"M13.83 19a1 1 0 0 1-.78-.37l-4.83-6a1 1 0 0 1 0-1.27l5-6a1 1 0 0 1 1.54 1.28L10.29 12l4.32 5.36a1 1 0 0 1-.78 1.64\"\n />\n </SvgIcon>\n </Button>\n );\n};\n\nexport default NavToggleButton;\n","import IconButton from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nexport const Button = styled(IconButton, {\n shouldForwardProp: prop => prop !== 'isNavMini',\n})<{ isNavMini: boolean }>(({ theme, isNavMini }) => ({\n padding: 8,\n top: 15,\n position: 'fixed',\n color: theme.palette.action.active,\n backgroundColor: theme.palette.background.paper,\n transform: 'translateX(-50%)',\n zIndex: 'var(--layout-nav-zIndex)',\n left: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n border: `1px solid ${theme.palette.divider}`,\n transition: theme.transitions.create(['left'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n\n '&:hover': {\n color: theme.palette.text.primary,\n backgroundColor: theme.palette.background.neutral,\n },\n}));\n","import Box from '@mui/material/Box';\nimport Stack from '@mui/material/Stack';\nimport { Breakpoint, styled } from '@mui/material/styles';\n\nexport const LogoFull = styled(Stack)({\n padding: '12px 16px 24px',\n\n svg: {\n width: 125,\n },\n});\n\nexport const LogoMini = styled(Stack)({\n padding: '12px 24px 24px',\n alignItems: 'center',\n justifyContent: 'center',\n\n svg: {\n width: 32,\n height: 32,\n },\n});\n\nexport const Container = styled(Box, {\n shouldForwardProp: prop => prop !== 'isNavMini' && prop !== 'layoutQuery',\n})<{\n isNavMini: boolean;\n layoutQuery: Breakpoint;\n}>(({ theme, isNavMini, layoutQuery }) => ({\n top: 0,\n left: 0,\n height: '100%',\n display: 'none',\n position: 'fixed',\n flexDirection: 'column',\n backgroundColor: theme.palette.background.paper,\n zIndex: 'var(--layout-nav-zIndex)',\n width: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n borderRight: `1px solid ${theme.palette.divider}`,\n\n transition: theme.transitions.create(['width'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n\n [theme.breakpoints.up(layoutQuery)]: {\n display: 'flex',\n },\n}));\n","import Box from '@mui/material/Box';\nimport GlobalStyles from '@mui/material/GlobalStyles';\n\nimport { layoutClasses } from '../classes';\n\nimport { LayoutSectionProps } from './props';\n\nconst Wrapper = ({\n sx,\n cssVars,\n children,\n footerSection,\n headerSection,\n sidebarSection,\n}: LayoutSectionProps) => {\n return (\n <>\n <GlobalStyles\n styles={{\n body: {\n '--layout-nav-zIndex': 1101,\n '--layout-nav-mobile-width': '320px',\n '--layout-header-blur': '8px',\n '--layout-header-zIndex': 1100,\n '--layout-header-mobile-height': '64px',\n '--layout-header-desktop-height': '72px',\n ...cssVars,\n },\n }}\n />\n\n <Box id=\"root__layout\" sx={sx}>\n {sidebarSection ? (\n <>\n {sidebarSection}\n <Box\n display=\"flex\"\n flex=\"1 1 auto\"\n flexDirection=\"column\"\n className={layoutClasses.hasSidebar}\n >\n {headerSection}\n {children}\n {footerSection}\n </Box>\n </>\n ) : (\n <>\n {headerSection}\n {children}\n {footerSection}\n </>\n )}\n </Box>\n </>\n );\n};\n\nexport default Wrapper;\n"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/layouts/Admin/index.tsx","../../../src/layouts/Admin/Wrapper/Main.tsx","../../../src/layouts/Admin/classes.ts","../../../src/layouts/Admin/Header/HeaderSection.tsx","../../../src/layouts/Admin/Header/styles.ts","../../../src/layouts/Admin/Header/index.tsx","../../../src/layouts/Admin/Sidebar/index.tsx","../../../src/layouts/Admin/NavToggleButton/index.tsx","../../../src/layouts/Admin/NavToggleButton/styles.ts","../../../src/layouts/Admin/Sidebar/styles.ts","../../../src/layouts/Admin/Wrapper/index.tsx"],"names":["useTheme","Stack","jsx","Main","children","isNavHorizontal","sx","other","Main_default","layoutClasses","Box","Container","Toolbar","MuiAppBar","styled","StyledDivider","theme","AppBar","jsxs","HeaderSection","slots","slotProps","layoutQuery","toolbarStyles","HeaderSection_default","Header","Header_default","SvgIcon","IconButton","Button","prop","isNavMini","NavToggleButton","NavToggleButton_default","LogoFull","LogoMini","Fragment","Sidebar","onToggleNav","renderNavVertical","Scrollbar_default","renderNavMini","Sidebar_default","GlobalStyles","Wrapper","cssVars","footerSection","headerSection","sidebarSection","Wrapper_default","Admin","footerContent","headerProps","sidebarContent","sidebarProps","onToggleNavMini","mainProps","Admin_default"],"mappings":"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","sourcesContent":["import { PropsWithChildren } from 'react';\nimport type { Breakpoint } from '@mui/material/styles';\nimport { useTheme } from '@mui/material/styles';\n\nimport Main from './Wrapper/Main';\nimport { layoutClasses } from './classes';\nimport Header from './Header';\nimport { AdminProps } from './props';\nimport Sidebar from './Sidebar';\nimport Wrapper from './Wrapper';\n\nconst Admin = ({\n children,\n footerContent,\n headerProps,\n sidebarContent,\n sidebarProps,\n isNavMini,\n onToggleNavMini,\n mainProps,\n}: PropsWithChildren<AdminProps>) => {\n const theme = useTheme();\n\n const layoutQuery: Breakpoint = 'lg';\n\n return (\n <Wrapper\n headerSection={\n <Header\n layoutQuery={layoutQuery}\n slotProps={{\n toolbar: {\n sx: {\n ['& [data-area=\"right\"]']: {\n gap: { xs: 0, sm: 0.75 },\n },\n },\n },\n container: {\n maxWidth: false,\n sx: {\n px: { [layoutQuery]: 5 },\n },\n },\n }}\n slots={headerProps?.slots}\n />\n }\n sidebarSection={\n <Sidebar\n isNavMini={isNavMini}\n layoutQuery={layoutQuery}\n onToggleNav={onToggleNavMini}\n slots={sidebarProps?.slots}\n >\n {sidebarContent}\n </Sidebar>\n }\n footerSection={footerContent}\n cssVars={{\n '--layout-transition-easing': 'linear',\n '--layout-transition-duration': '120ms',\n '--layout-nav-mini-width': '88px',\n '--layout-nav-vertical-width': '300px',\n '--layout-nav-horizontal-height': '64px',\n '--layout-dashboard-content-pt': theme.spacing(1),\n '--layout-dashboard-content-pb': theme.spacing(8),\n '--layout-dashboard-content-px': theme.spacing(5),\n }}\n sx={{\n [`& .${layoutClasses.hasSidebar}`]: {\n [theme.breakpoints.up(layoutQuery)]: {\n transition: theme.transitions.create(['padding-left'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n pl: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n },\n },\n }}\n >\n <Main isNavHorizontal={false} {...mainProps}>\n {children}\n </Main>\n </Wrapper>\n );\n};\n\nexport default Admin;\n","import Stack from '@mui/material/Stack';\n\nimport { MainProps } from './props';\n\nconst Main = ({ children, isNavHorizontal, sx, ...other }: MainProps) => {\n return (\n <Stack\n component=\"main\"\n flex=\"1 1 auto\"\n bgcolor=\"grey.100\"\n sx={{\n ...(isNavHorizontal && {\n '--layout-dashboard-content-pt': '40px',\n }),\n ...sx,\n }}\n {...other}\n >\n {children}\n </Stack>\n );\n};\n\nexport default Main;\n","export const layoutClasses = {\n root: 'layout__root',\n main: 'layout__main',\n header: 'layout__header',\n content: 'layout__main__content',\n hasSidebar: 'layout__has__sidebar',\n};\n","import Box from '@mui/material/Box';\nimport Container from '@mui/material/Container';\nimport { useTheme } from '@mui/material/styles';\nimport Toolbar from '@mui/material/Toolbar';\n\nimport { HeaderSectionProps } from './props';\nimport { AppBar } from './styles';\n\nconst HeaderSection = ({\n sx,\n slots,\n slotProps,\n layoutQuery = 'md',\n ...other\n}: HeaderSectionProps) => {\n const theme = useTheme();\n\n const toolbarStyles = {\n default: {\n minHeight: 'auto',\n height: 'var(--layout-header-mobile-height)',\n backgroundColor: theme.palette.background.paper,\n transition: theme.transitions.create(['height', 'background-color'], {\n easing: theme.transitions.easing.easeInOut,\n duration: theme.transitions.duration.shorter,\n }),\n [theme.breakpoints.up('sm')]: {\n minHeight: 'auto',\n },\n [theme.breakpoints.up(layoutQuery)]: {\n height: 'var(--layout-header-desktop-height)',\n },\n },\n };\n\n return (\n <AppBar position=\"sticky\" sx={sx} {...other}>\n {slots?.topArea}\n\n {(slots?.leftArea || slots?.centerArea || slots?.rightArea) && (\n <Toolbar\n disableGutters\n {...slotProps?.toolbar}\n sx={{\n ...toolbarStyles.default,\n ...slotProps?.toolbar?.sx,\n maxHeight: 64,\n }}\n >\n <Container\n {...slotProps?.container}\n sx={{\n height: 1,\n display: 'flex',\n alignItems: 'center',\n ...slotProps?.container?.sx,\n }}\n >\n {slots?.leftArea}\n\n <Box\n sx={{\n display: 'flex',\n flex: '1 1 auto',\n justifyContent: 'center',\n }}\n >\n {slots?.centerArea}\n </Box>\n\n {slots?.rightArea}\n </Container>\n </Toolbar>\n )}\n\n {slots?.bottomArea}\n </AppBar>\n );\n};\n\nexport default HeaderSection;\n","import MuiAppBar from '@mui/material/AppBar';\nimport { styled } from '@mui/material/styles';\n\nexport const StyledDivider = styled('span')(({ theme }) => ({\n width: 1,\n height: 10,\n flexShrink: 0,\n display: 'none',\n position: 'relative',\n alignItems: 'center',\n flexDirection: 'column',\n marginLeft: theme.spacing(2.5),\n marginRight: theme.spacing(2.5),\n backgroundColor: 'currentColor',\n\n '&::before, &::after': {\n top: -5,\n width: 3,\n height: 3,\n content: '\"\"',\n flexShrink: 0,\n borderRadius: '50%',\n position: 'absolute',\n backgroundColor: 'currentColor',\n },\n '&::after': { bottom: -5, top: 'auto' },\n}));\n\nexport const AppBar = styled(MuiAppBar)(({ theme }) => ({\n zIndex: 'var(--layout-header-zIndex)',\n backgroundColor: theme.palette.background.paper,\n\n '&::before': {\n content: '\"\"',\n position: 'absolute',\n bottom: 0,\n left: 0,\n width: '100%',\n height: '1px',\n backgroundColor: theme.palette.divider,\n zIndex: 1,\n },\n}));\n","import HeaderSection from './HeaderSection';\nimport { HeaderProps } from './props';\n\nconst Header = ({\n sx,\n slots,\n slotProps,\n layoutQuery,\n ...other\n}: HeaderProps) => {\n return (\n <HeaderSection\n sx={sx}\n layoutQuery={layoutQuery}\n slots={{\n ...slots,\n }}\n slotProps={slotProps}\n {...other}\n />\n );\n};\n\nexport default Header;\n","import { PropsWithChildren } from 'react';\nimport { useTheme } from '@mui/material/styles';\n\nimport Scrollbar from 'components/Scrollbar';\n\nimport NavToggleButton from '../NavToggleButton';\n\nimport { SidebarProps } from './props';\nimport { Container } from './styles';\n\nconst Sidebar = ({\n slots,\n isNavMini,\n layoutQuery,\n onToggleNav,\n children,\n}: PropsWithChildren<SidebarProps>) => {\n const theme = useTheme();\n\n const renderNavVertical = (\n <>\n {slots?.topArea}\n\n <Scrollbar fillContent autoHide={false} sx={{ p: 2 }}>\n {children}\n </Scrollbar>\n\n {slots?.bottomArea}\n </>\n );\n\n const renderNavMini = (\n <>\n {slots?.topArea}\n\n <Scrollbar fillContent autoHide={false} sx={{ p: 2 }}>\n {children}\n </Scrollbar>\n\n {slots?.bottomArea}\n </>\n );\n\n return (\n <Container isNavMini={isNavMini} layoutQuery={layoutQuery}>\n <NavToggleButton\n isNavMini={isNavMini}\n onClick={onToggleNav}\n sx={{\n display: 'none',\n [theme.breakpoints.up(layoutQuery)]: {\n display: 'inline-flex',\n },\n }}\n />\n {isNavMini ? renderNavMini : renderNavVertical}\n </Container>\n );\n};\n\nexport default Sidebar;\n","import SvgIcon from '@mui/material/SvgIcon';\n\nimport { NavToggleButtonProps } from './props';\nimport { Button } from './styles';\n\nconst NavToggleButton = ({ isNavMini, ...other }: NavToggleButtonProps) => {\n return (\n <Button size=\"small\" isNavMini={isNavMini} {...other}>\n <SvgIcon\n sx={{\n width: 16,\n height: 16,\n ...(isNavMini && {\n transform: 'scaleX(-1)',\n }),\n }}\n >\n <path\n fill=\"currentColor\"\n d=\"M13.83 19a1 1 0 0 1-.78-.37l-4.83-6a1 1 0 0 1 0-1.27l5-6a1 1 0 0 1 1.54 1.28L10.29 12l4.32 5.36a1 1 0 0 1-.78 1.64\"\n />\n </SvgIcon>\n </Button>\n );\n};\n\nexport default NavToggleButton;\n","import IconButton from '@mui/material/IconButton';\nimport { styled } from '@mui/material/styles';\n\nexport const Button = styled(IconButton, {\n shouldForwardProp: prop => prop !== 'isNavMini',\n})<{ isNavMini: boolean }>(({ theme, isNavMini }) => ({\n padding: 8,\n top: 15,\n position: 'fixed',\n color: theme.palette.action.active,\n backgroundColor: theme.palette.background.paper,\n transform: 'translateX(-50%)',\n zIndex: 'var(--layout-nav-zIndex)',\n left: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n border: `1px solid ${theme.palette.divider}`,\n transition: theme.transitions.create(['left'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n\n '&:hover': {\n color: theme.palette.text.primary,\n backgroundColor: theme.palette.background.neutral,\n },\n}));\n","import Box from '@mui/material/Box';\nimport Stack from '@mui/material/Stack';\nimport { Breakpoint, styled } from '@mui/material/styles';\n\nexport const LogoFull = styled(Stack)({\n padding: '12px 16px 24px',\n\n svg: {\n width: 125,\n },\n});\n\nexport const LogoMini = styled(Stack)({\n padding: '12px 24px 24px',\n alignItems: 'center',\n justifyContent: 'center',\n\n svg: {\n width: 32,\n height: 32,\n },\n});\n\nexport const Container = styled(Box, {\n shouldForwardProp: prop => prop !== 'isNavMini' && prop !== 'layoutQuery',\n})<{\n isNavMini: boolean;\n layoutQuery: Breakpoint;\n}>(({ theme, isNavMini, layoutQuery }) => ({\n top: 0,\n left: 0,\n height: '100%',\n display: 'none',\n position: 'fixed',\n flexDirection: 'column',\n backgroundColor: theme.palette.background.paper,\n zIndex: 'var(--layout-nav-zIndex)',\n width: isNavMini\n ? 'var(--layout-nav-mini-width)'\n : 'var(--layout-nav-vertical-width)',\n borderRight: `1px solid ${theme.palette.divider}`,\n\n transition: theme.transitions.create(['width'], {\n easing: 'var(--layout-transition-easing)',\n duration: 'var(--layout-transition-duration)',\n }),\n\n [theme.breakpoints.up(layoutQuery)]: {\n display: 'flex',\n },\n}));\n","import Box from '@mui/material/Box';\nimport GlobalStyles from '@mui/material/GlobalStyles';\n\nimport { layoutClasses } from '../classes';\n\nimport { LayoutSectionProps } from './props';\n\nconst Wrapper = ({\n sx,\n cssVars,\n children,\n footerSection,\n headerSection,\n sidebarSection,\n}: LayoutSectionProps) => {\n return (\n <>\n <GlobalStyles\n styles={{\n body: {\n '--layout-nav-zIndex': 1101,\n '--layout-nav-mobile-width': '320px',\n '--layout-header-blur': '8px',\n '--layout-header-zIndex': 1100,\n '--layout-header-mobile-height': '64px',\n '--layout-header-desktop-height': '72px',\n ...cssVars,\n },\n }}\n />\n\n <Box id=\"root__layout\" sx={sx}>\n {sidebarSection ? (\n <>\n {sidebarSection}\n <Box\n display=\"flex\"\n flex=\"1 1 auto\"\n flexDirection=\"column\"\n className={layoutClasses.hasSidebar}\n >\n {headerSection}\n {children}\n {footerSection}\n </Box>\n </>\n ) : (\n <>\n {headerSection}\n {children}\n {footerSection}\n </>\n )}\n </Box>\n </>\n );\n};\n\nexport default Wrapper;\n"]}
|