npm - @pega/cosmos-react-core - Versions diffs - 2.0.0-dev.14.3 → 2.0.0-dev.16.2 - Mend

@pega/cosmos-react-core 2.0.0-dev.14.3 → 2.0.0-dev.16.2

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.

Files changed (199) hide show

package/lib/components/PageTemplates/PageTemplates.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n useState,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n ReactNode,\n useRef\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, NoChildrenProp, AsProp } from '../../types';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon, { StyledIcon } from '../Icon';\nimport { tryCatch } from '../../utils';\nimport Tabs, { TabPanel, TabsProps } from '../Tabs';\nimport Flex from '../Flex';\nimport { useBreakpoint, useScrollStick } from '../../hooks';\nimport type { ScrollStickOptions } from '../../hooks/useScrollStick';\nimport Breadcrumbs, { BreadcrumbsProps } from '../Breadcrumbs';\n\nexport interface PageTemplateProps extends BaseProps, AsProp, NoChildrenProp {\n title: string;\n icon?: string;\n actions?: ReactNode;\n banners?: ReactNode;\n path?: BreadcrumbsProps['path'];\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TabbedPageProps extends PageTemplateProps {\n tabs: TabsProps;\n a: ReactNode;\n}\n\nexport interface OneColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n}\n\nexport interface TwoColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface ThreeColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface FourColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n d: ReactNode;\n}\n\nexport interface WideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface NarrowWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface WideWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface PageLayoutProps extends PageTemplateProps {\n regions: ReactNode[];\n regionsGridRef?: Ref<HTMLDivElement>;\n cols?: string;\n}\n\nexport const StyledPageLayout = styled.div(\n ({ theme }) => css`\n height: 100%;\n padding: calc(2 * ${theme.base.spacing});\n background-color: ${theme.base.palette['app-background']};\n `\n);\n\nStyledPageLayout.defaultProps = defaultThemeProp;\n\nexport const StyledPageHeader = styled.header(({ theme }) => {\n return css`\n min-height: ${theme.base['hit-area']['mouse-min']};\n min-width: 0;\n `;\n});\n\nStyledPageHeader.defaultProps = defaultThemeProp;\n\nexport const StyledBannerRegion = styled.div``;\n\nexport const StyledPageIcon = styled(Flex)(({ theme }) => {\n const bgColor = theme.base.palette['brand-primary'];\n const color = tryCatch(() => readableColor(bgColor));\n return css`\n height: calc(4 * ${theme.base.spacing});\n width: calc(4 * ${theme.base.spacing});\n background: ${bgColor};\n color: ${color};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n\n /* Need to override size set in SummaryItem */\n ${StyledIcon} {\n height: 1.125rem;\n width: 1.125rem;\n }\n `;\n});\n\nStyledPageIcon.defaultProps = defaultThemeProp;\n\nexport const StyledBreadcrumbs: typeof Breadcrumbs = styled(Breadcrumbs)(({ theme }) => {\n return css`\n margin-bottom: ${theme.base.spacing};\n `;\n});\n\nStyledBreadcrumbs.defaultProps = defaultThemeProp;\n\nconst PageLayout: FunctionComponent<PageLayoutProps & ForwardProps> = forwardRef(\n (\n {\n regions,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n title,\n icon,\n path,\n actions,\n banners,\n as,\n regionsGridRef,\n ...restProps\n }: PropsWithoutRef<PageLayoutProps>,\n ref: PageLayoutProps['ref']\n ) => {\n const regionArea = `'${Array.from({ length: regions.length }, (_, i) => `col-${i + 1}`).join(\n ' '\n )}'`;\n\n const isMediumOrAbove = useBreakpoint('md');\n const hasSideBySideColumns = regions.length > 1 && isMediumOrAbove;\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: [],\n offset: 16\n });\n\n useScrollStick(hasSideBySideColumns ? scrollStickOptions.current : undefined);\n\n return (\n <Grid\n {...restProps}\n as={StyledPageLayout}\n forwardedAs={as}\n container={{\n gap: 2\n }}\n md={{\n container: {\n areas: banners ? `\"header\"\\n\"banner\"\\n\"regions\"` : `\"header\"\\n\"regions\"`\n }\n }}\n ref={ref}\n >\n <Grid as={StyledPageHeader} md={{ item: { area: 'header' } }}>\n {path && path.length > 0 && <StyledBreadcrumbs path={...path} />}\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n </Grid>\n {banners && (\n <Grid as={StyledBannerRegion} md={{ item: { area: 'banner' } }}>\n {banners}\n </Grid>\n )}\n <Grid\n ref={regionsGridRef}\n container={{\n autoRows: 'max-content',\n cols: '1fr',\n gap: 2\n }}\n md={{ container: { areas: regionArea, rows: '1fr', cols }, item: { area: 'regions' } }}\n >\n {regions.map((colItems: ReactNode, i: number) => {\n return (\n <Grid\n ref={(el: HTMLDivElement) => {\n if (el) (scrollStickOptions.current?.elements).push(el);\n }}\n container={{\n cols: 'minmax(0, 1fr)',\n alignItems: 'start',\n alignContent: 'start',\n gap: 2\n }}\n md={{ item: { area: `col-${i + 1}`, alignSelf: 'start' } }}\n // eslint-disable-next-line react/no-array-index-key\n key={i}\n >\n {colItems}\n </Grid>\n );\n })}\n </Grid>\n </Grid>\n );\n }\n);\n\nexport const TabbedPage: FunctionComponent<TabbedPageProps & ForwardProps> = forwardRef(\n ({ tabs, a, ...restProps }: PropsWithoutRef<TabbedPageProps>, ref: Ref<HTMLDivElement>) => {\n const [tabId, setTabId] = useState(tabs.currentTabId ?? tabs.tabs[0]?.id);\n\n return (\n <PageLayout\n regions={[\n <>\n <Tabs\n {...tabs}\n onTabClick={(id, e) => {\n setTabId(id);\n tabs.onTabClick?.(id, e);\n }}\n />\n <Grid\n as={TabPanel}\n tabId={tabId}\n container={{\n alignItems: 'start',\n alignContent: 'start',\n gap: 2\n }}\n >\n {a}\n </Grid>\n </>\n ]}\n ref={ref}\n {...restProps}\n />\n );\n }\n);\nexport const OneColumnPage: FunctionComponent<OneColumnPageProps & ForwardProps> = forwardRef(\n ({ a, ...restProps }: PropsWithoutRef<OneColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a]} ref={ref} {...restProps} />;\n }\n);\n\nexport const TwoColumnPage: FunctionComponent<TwoColumnPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<TwoColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} ref={ref} {...restProps} />;\n }\n);\n\nexport const ThreeColumnPage: FunctionComponent<ThreeColumnPageProps & ForwardProps> = forwardRef(\n ({ a, b, c, ...restProps }: PropsWithoutRef<ThreeColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b, c]} ref={ref} {...restProps} />;\n }\n);\n\nexport const FourColumnPage: FunctionComponent<FourColumnPageProps & ForwardProps> = forwardRef(\n (\n { a, b, c, d, ...restProps }: PropsWithoutRef<FourColumnPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c, d]} ref={ref} {...restProps} />;\n }\n);\n\nexport const WideNarrowPage: FunctionComponent<WideNarrowPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} cols='2fr 1fr' ref={ref} {...restProps} />;\n }\n);\n\nexport const NarrowWidePage: FunctionComponent<WideNarrowPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} cols='1fr 2fr' ref={ref} {...restProps} />;\n }\n);\n\nexport const WideWideNarrowPage: FunctionComponent<WideWideNarrowPageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<WideWideNarrowPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='2fr 2fr 1fr' ref={ref} {...restProps} />;\n }\n );\n\nexport const NarrowWideWidePage: FunctionComponent<NarrowWideWidePageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideWidePageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='1fr 2fr 2fr' ref={ref} {...restProps} />;\n }\n );\n\nexport const NarrowWideNarrowPage: FunctionComponent<NarrowWideNarrowPageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideNarrowPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='1fr 3fr 1fr' ref={ref} {...restProps} />;\n }\n );\n"]}
1	+ {"version":3,"file":"PageTemplates.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/PageTemplates.tsx"],"names":[],"mappings":";AAAA,OAAO,EACL,UAAU,EACV,QAAQ,EAKR,MAAM,EAEN,UAAU,EACX,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,UAAU,CAAC;AAEzC,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,WAAW,MAAM,gBAAgB,CAAC;AACzC,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AACvC,OAAO,IAAI,EAAE,EAAE,QAAQ,EAAa,MAAM,SAAS,CAAC;AACpD,OAAO,IAAI,MAAM,SAAS,CAAC;AAC3B,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAExE,OAAO,WAAW,EAAE,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AAClF,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAC1D,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AA2E1C,MAAM,CAAC,MAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IACvD,MAAM,OAAO,GAAG,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;IACpD,MAAM,KAAK,GAAG,QAAQ,CAAC,GAAG,EAAE,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC,CAAC;IACrD,OAAO,GAAG,CAAA;uBACW,KAAK,CAAC,IAAI,CAAC,OAAO;sBACnB,KAAK,CAAC,IAAI,CAAC,OAAO;kBACtB,OAAO;aACZ,KAAK;gCACc,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC;GACxD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,cAAc,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE/C,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC1D,OAAO,GAAG,CAAA;MACN,iBAAiB;0BACG,KAAK,CAAC,IAAI,CAAC,OAAO;;;MAGtC,YAAY;MACZ,UAAU;qCACqB,KAAK,CAAC,IAAI,CAAC,OAAO;;GAEpD,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AACzC,YAAY,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE7C,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEtC,CAAC;AACF,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA,EAAE,CAAC;AAC1C,aAAa,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAE9C,MAAM,CAAC,MAAM,wBAAwB,GAAoB,MAAM,CAAC,QAAQ,CAAC,CAAC,GAAG,EAAE;IAC7E,OAAO,GAAG,CAAA;;;GAGT,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,wBAAwB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEzD,MAAM,CAAC,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAGxC,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,GAAG,CAAA;;;wBAGX,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,gBAAgB,CAAC;;MAEtD,aAAa;IACf,GAAG,CAAA;QACC,aAAa;;;;QAIb,aAAa;;;;;;KAMhB;GACF,CACF,CAAC;AAEF,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,CACE,EACE,OAAO,EACP,IAAI,GAAG,UAAU,OAAO,CAAC,MAAM,mBAAmB,EAClD,KAAK,EACL,IAAI,EACJ,IAAI,EACJ,OAAO,EACP,OAAO,EACP,IAAI,EACJ,EAAE,EACF,MAAM,EACN,UAAU,EACV,aAAa,GAAG,KAAK,EACrB,GAAG,SAAS,EACqB,EACnC,GAA2B,EAC3B,EAAE;IACF,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,UAAU,EAAe,CAAC;IAC5D,MAAM,eAAe,GAAG,aAAa,CAAC,IAAI,CAAC,CAAC;IAC5C,MAAM,oBAAoB,GAAG,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,eAAe,CAAC;IACnE,MAAM,EAAE,QAAQ,EAAE,GAAG,UAAU,CAAC,eAAe,CAAC,CAAC;IAEjD,MAAM,kBAAkB,GAAG,MAAM,CAAmD;QAClF,QAAQ,EAAE,EAAE;KACb,CAAC,CAAC;IAEH,kBAAkB,CAAC,OAAO,CAAC,eAAe,GAAG,aAAa,IAAI,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC;IAChG,kBAAkB,CAAC,OAAO,CAAC,MAAM,GAAG,CAAC,QAAQ,EAAE,YAAY,IAAI,CAAC,CAAC,GAAG,EAAE,CAAC;IAEvE,cAAc,CAAC,oBAAoB,CAAC,CAAC,CAAC,kBAAkB,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC;IAE9E,OAAO,CACL,MAAC,IAAI,oBACC,SAAS,IACb,SAAS,EAAE;YACT,SAAS,EAAE,QAAQ;YACnB,GAAG,EAAE,CAAC;SACP,EACD,aAAa,EAAE,aAAa,EAC5B,EAAE,EAAE,gBAAgB,EACpB,WAAW,EAAE,EAAE,EACf,GAAG,EAAE,GAAG,iBAER,MAAC,IAAI,kBACH,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,EAClD,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,EAC5B,EAAE,EAAE,gBAAgB,iBAEnB,IAAI,IAAI,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,KAAC,WAAW,IAAC,IAAI,EAAK,IAAI,WAAI,EAEzD,MAAM,IAAI,CACT,KAAC,WAAW,IACV,MAAM,EACJ,IAAI,IAAI,CACN,KAAC,cAAc,kBAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,OAAO,EAAE,QAAQ,EAAE,gBACpE,KAAC,IAAI,IAAC,IAAI,EAAE,IAAI,WAAI,YACL,CAClB,EAEH,OAAO,EAAE,KAAC,IAAI,kBAAC,OAAO,EAAC,IAAI,gBAAE,KAAK,YAAQ,EAC1C,OAAO,EAAE,OAAO,WAChB,CACH,EAEA,OAAO,EACP,IAAI,aACA,EAEP,KAAC,IAAI,kBACH,SAAS,QACT,IAAI,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,EACjB,EAAE,EAAE,aAAa,EACjB,GAAG,EAAE,aAAa,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,SAAS,gBAE7C,KAAC,IAAI,kBACH,SAAS,EAAE;wBACT,IAAI,EAAE,KAAK;wBACX,UAAU,EAAE,OAAO;wBACnB,GAAG,EAAE,CAAC;wBACN,GAAG,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;qBACf,EACD,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,IAAI,EAAE,EAAE,EAC3B,EAAE,EAAE,aAAa,EACjB,GAAG,EAAE,UAAU,gBAEd,OAAO,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,CAAC,EAAE,EAAE;wBAC3B,OAAO,CACL,KAAC,IAAI,kBACH,SAAS,EAAE;gCACT,SAAS,EAAE,QAAQ;gCACnB,GAAG,EAAE,CAAC;6BACP,EACD,EAAE,EAAE,YAAY,EAGhB,GAAG,EAAE,CAAC,EAAyB,EAAE,EAAE;gCACjC,IAAI,EAAE,EAAE;oCACN,kBAAkB,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,GAAG,EAAE,CAAC;iCAC7C;4BACH,CAAC,gBAEA,QAAQ,KAPJ,CAAC,CAQD,CACR,CAAC;oBACJ,CAAC,CAAC,YACG,YACF,aACF,CACR,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAsD,UAAU,CACrF,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,SAAS,EAAoC,EAAE,GAAwB,EAAE,EAAE;IACxF,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC;IAE1E,OAAO,CACL,KAAC,UAAU,oBACL,SAAS,IACb,IAAI,EACF,KAAC,IAAI,oBACC,IAAI,IACR,UAAU,EAAE,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE;gBACpB,QAAQ,CAAC,EAAE,CAAC,CAAC;gBACb,IAAI,CAAC,UAAU,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC;YAC3B,CAAC,YACD,EAEJ,OAAO,EAAE;YACP,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,gBACzE,CAAC,YACG;SACR,EACD,GAAG,EAAE,GAAG,YACR,CACH,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAyD,UAAU,CAC3F,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAuC,EAAE,GAAwB,EAAE,EAAE;IACrF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AAC/D,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,aAAa,GAAyD,UAAU,CAC3F,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAuC,EAAE,GAAwB,EAAE,EAAE;IACxF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AAClE,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,eAAe,GAA2D,UAAU,CAC/F,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAyC,EAAE,GAAwB,EAAE,EAAE;IAC7F,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACrE,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAA0D,UAAU,CAC7F,CACE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAwC,EAClE,GAAwB,EACxB,EAAE;IACF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACxE,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAA0D,UAAU,CAC7F,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAwC,EAAE,GAAwB,EAAE,EAAE;IACzF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACjF,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAA0D,UAAU,CAC7F,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAAwC,EAAE,GAAwB,EAAE,EAAE;IACzF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAC,SAAS,EAAC,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACjF,CAAC,CACF,CAAC;AAEF,MAAM,CAAC,MAAM,kBAAkB,GAC7B,UAAU,CACR,CACE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAA4C,EACnE,GAAwB,EACxB,EAAE;IACF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAC,aAAa,EAAC,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACxF,CAAC,CACF,CAAC;AAEJ,MAAM,CAAC,MAAM,kBAAkB,GAC7B,UAAU,CACR,CACE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAA4C,EACnE,GAAwB,EACxB,EAAE;IACF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAC,aAAa,EAAC,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACxF,CAAC,CACF,CAAC;AAEJ,MAAM,CAAC,MAAM,oBAAoB,GAC/B,UAAU,CACR,CACE,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,EAA8C,EACrE,GAAwB,EACxB,EAAE;IACF,OAAO,KAAC,UAAU,kBAAC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,IAAI,EAAC,aAAa,EAAC,GAAG,EAAE,GAAG,IAAM,SAAS,UAAI,CAAC;AACxF,CAAC,CACF,CAAC","sourcesContent":["import {\n forwardRef,\n useState,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n ReactNode,\n useRef,\n ReactElement,\n useContext\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor } from 'polished';\n\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, NoChildrenProp, AsProp } from '../../types';\nimport Grid from '../Grid';\nimport Text from '../Text';\nimport SummaryItem from '../SummaryItem';\nimport Icon from '../Icon';\nimport { tryCatch } from '../../utils';\nimport Tabs, { TabPanel, TabsProps } from '../Tabs';\nimport Flex from '../Flex';\nimport { useBreakpoint, useElement, useScrollStick } from '../../hooks';\nimport type { ScrollStickOptions } from '../../hooks/useScrollStick';\nimport Breadcrumbs, { BreadcrumbsProps, StyledBreadcrumbs } from '../Breadcrumbs';\nimport AppShellContext from '../AppShell/AppShellContext';\nimport { StyledBanner } from '../Banner/Banner';\nimport { StyledTabs } from '../Tabs/Tabs';\n\nexport interface PageTemplateProps extends BaseProps, AsProp, NoChildrenProp {\n title: string;\n icon?: string;\n actions?: ReactNode;\n banners?: ReactNode;\n path?: BreadcrumbsProps['path'];\n header?: ReactNode;\n scrollContent?: boolean;\n ref?: Ref<HTMLDivElement>;\n}\n\nexport interface TabbedPageProps extends PageTemplateProps {\n tabs: TabsProps;\n a: ReactNode;\n}\n\nexport interface OneColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n}\n\nexport interface TwoColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface ThreeColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface FourColumnPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n d: ReactNode;\n}\n\nexport interface WideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface NarrowWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n}\n\nexport interface WideWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideWidePageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface NarrowWideNarrowPageProps extends PageTemplateProps {\n a: ReactNode;\n b: ReactNode;\n c: ReactNode;\n}\n\nexport interface PageLayoutProps extends PageTemplateProps {\n tabs?: ReactElement<typeof Tabs>;\n regions: ReactNode[];\n regionsRef?: Ref<HTMLDivElement>;\n cols?: string;\n}\n\nexport const StyledPageIcon = styled(Flex)(({ theme }) => {\n const bgColor = theme.base.palette['brand-primary'];\n const color = tryCatch(() => readableColor(bgColor));\n return css`\n height: calc(4 * ${theme.base.spacing});\n width: calc(4 * ${theme.base.spacing});\n background: ${bgColor};\n color: ${color};\n border-radius: calc(0.5 * ${theme.base['border-radius']});\n `;\n});\n\nStyledPageIcon.defaultProps = defaultThemeProp;\n\nexport const StyledPageHeader = styled.header(({ theme }) => {\n return css`\n ${StyledBreadcrumbs} {\n margin-block-end: ${theme.base.spacing};\n }\n\n ${StyledBanner},\n ${StyledTabs} {\n margin-block-start: calc(2 * ${theme.base.spacing});\n }\n `;\n});\n\nStyledPageHeader.defaultProps = defaultThemeProp;\n\nexport const StyledRegion = styled.div``;\nStyledRegion.defaultProps = defaultThemeProp;\n\nexport const StyledRegions = styled.div`\n flex-grow: 1;\n`;\nStyledRegions.defaultProps = defaultThemeProp;\n\nexport const StyledContent = styled.div``;\nStyledContent.defaultProps = defaultThemeProp;\n\nexport const StyledScrollableTabPanel: typeof TabPanel = styled(TabPanel)(() => {\n return css`\n height: 100%;\n overflow: auto;\n `;\n});\n\nStyledScrollableTabPanel.defaultProps = defaultThemeProp;\n\nexport const StyledPageLayout = styled.div<{\n scrollContent: PageLayoutProps['scrollContent'];\n}>(\n ({ theme, scrollContent }) => css`\n position: relative;\n min-height: inherit;\n background-color: ${theme.base.palette['app-background']};\n\n ${scrollContent &&\n css`\n ${StyledContent} {\n position: relative;\n }\n\n ${StyledRegions} {\n position: absolute;\n height: 100%;\n width: 100%;\n overflow: auto;\n }\n `}\n `\n);\n\nStyledPageLayout.defaultProps = defaultThemeProp;\n\nconst PageLayout: FunctionComponent<PageLayoutProps & ForwardProps> = forwardRef(\n (\n {\n regions,\n cols = `repeat(${regions.length}, minmax(0, 1fr))`,\n title,\n icon,\n path,\n actions,\n banners,\n tabs,\n as,\n header,\n regionsRef,\n scrollContent = false,\n ...restProps\n }: PropsWithoutRef<PageLayoutProps>,\n ref: PageLayoutProps['ref']\n ) => {\n const [contentEl, setContentEl] = useElement<HTMLElement>();\n const isMediumOrAbove = useBreakpoint('md');\n const hasSideBySideColumns = regions.length > 1 && isMediumOrAbove;\n const { headerEl } = useContext(AppShellContext);\n\n const scrollStickOptions = useRef<ScrollStickOptions & { elements: HTMLElement[] }>({\n elements: []\n });\n\n scrollStickOptions.current.scrollContainer = scrollContent && contentEl ? contentEl : undefined;\n scrollStickOptions.current.offset = (headerEl?.offsetHeight ?? 0) + 16;\n\n useScrollStick(hasSideBySideColumns ? scrollStickOptions.current : undefined);\n\n return (\n <Flex\n {...restProps}\n container={{\n direction: 'column',\n gap: 2\n }}\n scrollContent={scrollContent}\n as={StyledPageLayout}\n forwardedAs={as}\n ref={ref}\n >\n <Flex\n container={{ direction: 'column', pad: [2, 2, 0] }}\n item={{ grow: 0, shrink: 0 }}\n as={StyledPageHeader}\n >\n {path && path.length > 0 && <Breadcrumbs path={...path} />}\n\n {header \|\| (\n <SummaryItem\n visual={\n icon && (\n <StyledPageIcon container={{ alignItems: 'center', justify: 'center' }}>\n <Icon name={icon} />\n </StyledPageIcon>\n )\n }\n primary={<Text variant='h1'>{title}</Text>}\n actions={actions}\n />\n )}\n\n {banners}\n {tabs}\n </Flex>\n\n <Flex\n container\n item={{ grow: 1 }}\n as={StyledContent}\n ref={scrollContent ? setContentEl : undefined}\n >\n <Grid\n container={{\n cols: '1fr',\n alignItems: 'start',\n gap: 2,\n pad: [0, 2, 2]\n }}\n md={{ container: { cols } }}\n as={StyledRegions}\n ref={regionsRef}\n >\n {regions.map((colItems, i) => {\n return (\n <Flex\n container={{\n direction: 'column',\n gap: 2\n }}\n as={StyledRegion}\n // eslint-disable-next-line react/no-array-index-key\n key={i}\n ref={(el: HTMLDivElement \| null) => {\n if (el) {\n scrollStickOptions.current.elements[i] = el;\n }\n }}\n >\n {colItems}\n </Flex>\n );\n })}\n </Grid>\n </Flex>\n </Flex>\n );\n }\n);\n\nexport const TabbedPage: FunctionComponent<TabbedPageProps & ForwardProps> = forwardRef(\n ({ tabs, a, ...restProps }: PropsWithoutRef<TabbedPageProps>, ref: Ref<HTMLDivElement>) => {\n const [tabId, setTabId] = useState(tabs.currentTabId ?? tabs.tabs[0]?.id);\n\n return (\n <PageLayout\n {...restProps}\n tabs={\n <Tabs\n {...tabs}\n onTabClick={(id, e) => {\n setTabId(id);\n tabs.onTabClick?.(id, e);\n }}\n />\n }\n regions={[\n <Flex container={{ direction: 'column', gap: 2 }} as={TabPanel} tabId={tabId}>\n {a}\n </Flex>\n ]}\n ref={ref}\n />\n );\n }\n);\n\nexport const OneColumnPage: FunctionComponent<OneColumnPageProps & ForwardProps> = forwardRef(\n ({ a, ...restProps }: PropsWithoutRef<OneColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a]} ref={ref} {...restProps} />;\n }\n);\n\nexport const TwoColumnPage: FunctionComponent<TwoColumnPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<TwoColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} ref={ref} {...restProps} />;\n }\n);\n\nexport const ThreeColumnPage: FunctionComponent<ThreeColumnPageProps & ForwardProps> = forwardRef(\n ({ a, b, c, ...restProps }: PropsWithoutRef<ThreeColumnPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b, c]} ref={ref} {...restProps} />;\n }\n);\n\nexport const FourColumnPage: FunctionComponent<FourColumnPageProps & ForwardProps> = forwardRef(\n (\n { a, b, c, d, ...restProps }: PropsWithoutRef<FourColumnPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c, d]} ref={ref} {...restProps} />;\n }\n);\n\nexport const WideNarrowPage: FunctionComponent<WideNarrowPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} cols='2fr 1fr' ref={ref} {...restProps} />;\n }\n);\n\nexport const NarrowWidePage: FunctionComponent<WideNarrowPageProps & ForwardProps> = forwardRef(\n ({ a, b, ...restProps }: PropsWithoutRef<WideNarrowPageProps>, ref: Ref<HTMLDivElement>) => {\n return <PageLayout regions={[a, b]} cols='1fr 2fr' ref={ref} {...restProps} />;\n }\n);\n\nexport const WideWideNarrowPage: FunctionComponent<WideWideNarrowPageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<WideWideNarrowPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='2fr 2fr 1fr' ref={ref} {...restProps} />;\n }\n );\n\nexport const NarrowWideWidePage: FunctionComponent<NarrowWideWidePageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideWidePageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='1fr 2fr 2fr' ref={ref} {...restProps} />;\n }\n );\n\nexport const NarrowWideNarrowPage: FunctionComponent<NarrowWideNarrowPageProps & ForwardProps> =\n forwardRef(\n (\n { a, b, c, ...restProps }: PropsWithoutRef<NarrowWideNarrowPageProps>,\n ref: Ref<HTMLDivElement>\n ) => {\n return <PageLayout regions={[a, b, c]} cols='1fr 3fr 1fr' ref={ref} {...restProps} />;\n }\n );\n"]}

package/lib/components/PageTemplates/index.d.ts CHANGED Viewed

@@ -22,4 +22,6 @@ export { StyledPageHeader } from './PageTemplates';
 export { default as DashboardPage } from './DashboardPage';
 export { DashboardPageProps } from './DashboardPage';
 export { default as CategorySubPage } from './CategorySubPage';
+export { TabbedPageProps } from './PageTemplates';
+export { PageTemplateProps } from './PageTemplates';
 //# sourceMappingURL=index.d.ts.map

package/lib/components/PageTemplates/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/PageTemplates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iBAAiB,CAAC;AACtD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,iBAAiB,CAAC;AAC1D,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AACvD,OAAO,EAAE,yBAAyB,EAAE,MAAM,iBAAiB,CAAC;AAC5D,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,EAAE,iBAAiB,EAAE,MAAM,iBAAiB,CAAC"}

package/lib/components/PageTemplates/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { OneColumnPage } from './PageTemplates';\nexport { OneColumnPageProps } from './PageTemplates';\nexport { TwoColumnPage } from './PageTemplates';\nexport { TwoColumnPageProps } from './PageTemplates';\nexport { ThreeColumnPage } from './PageTemplates';\nexport { ThreeColumnPageProps } from './PageTemplates';\nexport { FourColumnPage } from './PageTemplates';\nexport { FourColumnPageProps } from './PageTemplates';\nexport { WideNarrowPage } from './PageTemplates';\nexport { WideNarrowPageProps } from './PageTemplates';\nexport { NarrowWidePage } from './PageTemplates';\nexport { NarrowWidePageProps } from './PageTemplates';\nexport { NarrowWideWidePage } from './PageTemplates';\nexport { NarrowWideWidePageProps } from './PageTemplates';\nexport { WideWideNarrowPage } from './PageTemplates';\nexport { WideWideNarrowPageProps } from './PageTemplates';\nexport { NarrowWideNarrowPage } from './PageTemplates';\nexport { NarrowWideNarrowPageProps } from './PageTemplates';\nexport { TabbedPage } from './PageTemplates';\nexport { StyledPageLayout } from './PageTemplates';\nexport { StyledPageHeader } from './PageTemplates';\nexport { default as DashboardPage } from './DashboardPage';\nexport { DashboardPageProps } from './DashboardPage';\nexport { default as CategorySubPage } from './CategorySubPage';\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/PageTemplates/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAEhD,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAElD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,cAAc,EAAE,MAAM,iBAAiB,CAAC;AAEjD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,OAAO,EAAE,kBAAkB,EAAE,MAAM,iBAAiB,CAAC;AAErD,OAAO,EAAE,oBAAoB,EAAE,MAAM,iBAAiB,CAAC;AAEvD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,gBAAgB,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAE3D,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC","sourcesContent":["export { OneColumnPage } from './PageTemplates';\nexport { OneColumnPageProps } from './PageTemplates';\nexport { TwoColumnPage } from './PageTemplates';\nexport { TwoColumnPageProps } from './PageTemplates';\nexport { ThreeColumnPage } from './PageTemplates';\nexport { ThreeColumnPageProps } from './PageTemplates';\nexport { FourColumnPage } from './PageTemplates';\nexport { FourColumnPageProps } from './PageTemplates';\nexport { WideNarrowPage } from './PageTemplates';\nexport { WideNarrowPageProps } from './PageTemplates';\nexport { NarrowWidePage } from './PageTemplates';\nexport { NarrowWidePageProps } from './PageTemplates';\nexport { NarrowWideWidePage } from './PageTemplates';\nexport { NarrowWideWidePageProps } from './PageTemplates';\nexport { WideWideNarrowPage } from './PageTemplates';\nexport { WideWideNarrowPageProps } from './PageTemplates';\nexport { NarrowWideNarrowPage } from './PageTemplates';\nexport { NarrowWideNarrowPageProps } from './PageTemplates';\nexport { TabbedPage } from './PageTemplates';\nexport { StyledPageLayout } from './PageTemplates';\nexport { StyledPageHeader } from './PageTemplates';\nexport { default as DashboardPage } from './DashboardPage';\nexport { DashboardPageProps } from './DashboardPage';\nexport { default as CategorySubPage } from './CategorySubPage';\nexport { TabbedPageProps } from './PageTemplates';\nexport { PageTemplateProps } from './PageTemplates';\n"]}

package/lib/components/Pagination/Pagination.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;~~AAMtD~~,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7C;AAOD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CA4DjE,CAAC;AAIF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"Pagination.d.ts","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAe,MAAM,OAAO,CAAC;AAEvD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAUtD,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD,6BAA6B;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sCAAsC;IACtC,YAAY,CAAC,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;CAC7C;AAOD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CA4DjE,CAAC;AAIF,eAAe,UAAU,CAAC"}

package/lib/components/Pagination/Pagination.js CHANGED Viewed

@@ -1,9 +1,12 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback } from 'react';
 import { useDirection, useI18n } from '../../hooks';
-import Icon from '../Icon';
+import Icon, { registerIcon } from '../Icon';
+import * as caretLeftIcon from '../Icon/icons/caret-left.icon';
+import * as caretRightIcon from '../Icon/icons/caret-right.icon';
 import Button from '../Button';
 import Flex from '../Flex';
+registerIcon(caretLeftIcon, caretRightIcon);
 const defaultProps = {
     pageNumber: 1,
     pageSize: 10
@@ -25,7 +28,7 @@ const Pagination = (props) => {
     const { start, end } = useDirection();
     return (_jsxs(Flex, Object.assign({ container: {
             gap: 1
-        }, "aria-label": t('pagination_page_of', pageNumber, pageCount).toString(), role: 'tablist', total: total }, restProps, { children: [_jsx(Flex, Object.assign({ container: { alignItems: 'center' }, "aria-hidden": 'true' }, { children: t('pagination_page_of', pageNumber, pageCount) }), void 0), _jsxs(Flex, Object.assign({ container: {
+        }, "aria-label": t('pagination_page_of', [pageNumber, pageCount]), role: 'tablist', total: total }, restProps, { children: [_jsx(Flex, Object.assign({ container: { alignItems: 'center' }, "aria-hidden": 'true' }, { children: t('pagination_page_of', [pageNumber, pageCount]) }), void 0), _jsxs(Flex, Object.assign({ container: {
                     gap: 1
                 }, role: 'group' }, { children: [_jsx(Button, Object.assign({ variant: 'simple', label: t('pagination_prev'), disabled: pageNumber === 1, onClick: () => handlePageChange(pageNumber - 1), icon: true }, { children: _jsx(Icon, { name: `caret-${start}` }, void 0) }), void 0), _jsx(Button, Object.assign({ variant: 'simple', label: t('pagination_next'), disabled: pageNumber === pageCount, onClick: () => handlePageChange(pageNumber + 1), icon: true }, { children: _jsx(Icon, { name: `caret-${end}` }, void 0) }), void 0)] }), void 0)] }), void 0));
 };

package/lib/components/Pagination/Pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,WAAW,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,IAAI,MAAM,SAAS,CAAC;~~AAC3B~~,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;~~AAmB3B~~,MAAM,YAAY,GAA6B;IAC7C,UAAU,EAAE,CAAC;IACb,QAAQ,EAAE,EAAE;CACb,CAAC;AAEF,MAAM,UAAU,GAAsD,CAAC,KAAsB,EAAE,EAAE;IAC/F,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACpD,IAAI,EAAE,QAAQ,GAAG,EAAE,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC;IAE9C,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;IACjC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAC;IAC9C,IAAI,UAAU,GAAG,CAAC;QAAE,UAAU,GAAG,CAAC,CAAC;IACnC,IAAI,UAAU,GAAG,SAAS;QAAE,UAAU,GAAG,SAAS,CAAC;IAEnD,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,YAAoB,EAAE,EAAE;QACvB,IAAI,YAAY;YAAE,YAAY,CAAC,YAAY,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,YAAY,CAAC,CACf,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAEtC,OAAO,CACL,MAAC,IAAI,kBACH,SAAS,EAAE;YACT,GAAG,EAAE,CAAC;SACP,gBACW,CAAC,CAAC,oBAAoB,EAAE,UAAU,EAAE,SAAS,CAAC,CAAC,~~QAAQ~~,~~EAAE,EACrE,~~IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,IACR,SAAS,eAEb,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,iBAAc,MAAM,gBAC1D,CAAC,CAAC,oBAAoB,EAAE,UAAU,EAAE,SAAS,CAAC,~~YAC1C~~,EACP,MAAC,IAAI,kBACH,SAAS,EAAE;oBACT,GAAG,EAAE,CAAC;iBACP,EACD,IAAI,EAAC,OAAO,iBAEZ,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC3B,QAAQ,EAAE,UAAU,KAAK,CAAC,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,UAAU,GAAG,CAAC,CAAC,EAC/C,IAAI,sBAEJ,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,KAAK,EAAE,WAAI,YACzB,EACT,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC3B,QAAQ,EAAE,UAAU,KAAK,SAAS,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,UAAU,GAAG,CAAC,CAAC,EAC/C,IAAI,sBAEJ,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,GAAG,EAAE,WAAI,YACvB,aACJ,aACF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,YAAY,CAAC;AAEvC,eAAe,UAAU,CAAC","sourcesContent":["import { FunctionComponent, useCallback } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useDirection, useI18n } from '../../hooks';\nimport Icon from '../Icon';\nimport Button from '../Button';\nimport Flex from '../Flex';\n\nexport interface PaginationProps extends BaseProps {\n /** Total number of items. /\n total: number;\n /\n Size of each page.\n * @default 10\n /\n pageSize?: number;\n /\n Current page number.\n * @default 1\n /\n pageNumber?: number;\n /* Function to handle page change. */\n onPageChange?: (pageNumber: number) => void;\n}\n\nconst defaultProps: Partial<PaginationProps> = {\n pageNumber: 1,\n pageSize: 10\n};\n\nconst Pagination: FunctionComponent<PaginationProps & ForwardProps> = (props: PaginationProps) => {\n const { total, onPageChange, ...restProps } = props;\n let { pageSize = 10, pageNumber = 1 } = props;\n\n const t = useI18n();\n\n pageSize = Math.max(1, pageSize);\n const pageCount = Math.ceil(total / pageSize);\n if (pageNumber < 1) pageNumber = 1;\n if (pageNumber > pageCount) pageNumber = pageCount;\n\n const handlePageChange = useCallback(\n (currentValue: number) => {\n if (onPageChange) onPageChange(currentValue);\n },\n [onPageChange]\n );\n\n const { start, end } = useDirection();\n\n return (\n <Flex\n container={{\n gap: 1\n }}\n aria-label={t('pagination_page_of', pageNumber, pageCount)~~.toString()~~}\n role='tablist'\n total={total}\n {...restProps}\n >\n <Flex container={{ alignItems: 'center' }} aria-hidden='true'>\n {t('pagination_page_of', pageNumber, pageCount)}\n </Flex>\n <Flex\n container={{\n gap: 1\n }}\n role='group'\n >\n <Button\n variant='simple'\n label={t('pagination_prev')}\n disabled={pageNumber === 1}\n onClick={() => handlePageChange(pageNumber - 1)}\n icon\n >\n <Icon name={`caret-${start}`} />\n </Button>\n <Button\n variant='simple'\n label={t('pagination_next')}\n disabled={pageNumber === pageCount}\n onClick={() => handlePageChange(pageNumber + 1)}\n icon\n >\n <Icon name={`caret-${end}`} />\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nPagination.defaultProps = defaultProps;\n\nexport default Pagination;\n"]}
1	+ {"version":3,"file":"Pagination.js","sourceRoot":"","sources":["../../../src/components/Pagination/Pagination.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAqB,WAAW,EAAE,MAAM,OAAO,CAAC;AAGvD,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,aAAa,CAAC;AACpD,OAAO,IAAI,EAAE,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAC7C,OAAO,KAAK,aAAa,MAAM,+BAA+B,CAAC;AAC/D,OAAO,KAAK,cAAc,MAAM,gCAAgC,CAAC;AACjE,OAAO,MAAM,MAAM,WAAW,CAAC;AAC/B,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,YAAY,CAAC,aAAa,EAAE,cAAc,CAAC,CAAC;AAmB5C,MAAM,YAAY,GAA6B;IAC7C,UAAU,EAAE,CAAC;IACb,QAAQ,EAAE,EAAE;CACb,CAAC;AAEF,MAAM,UAAU,GAAsD,CAAC,KAAsB,EAAE,EAAE;IAC/F,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,SAAS,EAAE,GAAG,KAAK,CAAC;IACpD,IAAI,EAAE,QAAQ,GAAG,EAAE,EAAE,UAAU,GAAG,CAAC,EAAE,GAAG,KAAK,CAAC;IAE9C,MAAM,CAAC,GAAG,OAAO,EAAE,CAAC;IAEpB,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,QAAQ,CAAC,CAAC;IACjC,MAAM,SAAS,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,GAAG,QAAQ,CAAC,CAAC;IAC9C,IAAI,UAAU,GAAG,CAAC;QAAE,UAAU,GAAG,CAAC,CAAC;IACnC,IAAI,UAAU,GAAG,SAAS;QAAE,UAAU,GAAG,SAAS,CAAC;IAEnD,MAAM,gBAAgB,GAAG,WAAW,CAClC,CAAC,YAAoB,EAAE,EAAE;QACvB,IAAI,YAAY;YAAE,YAAY,CAAC,YAAY,CAAC,CAAC;IAC/C,CAAC,EACD,CAAC,YAAY,CAAC,CACf,CAAC;IAEF,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IAEtC,OAAO,CACL,MAAC,IAAI,kBACH,SAAS,EAAE;YACT,GAAG,EAAE,CAAC;SACP,gBACW,CAAC,CAAC,oBAAoB,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,EAC5D,IAAI,EAAC,SAAS,EACd,KAAK,EAAE,KAAK,IACR,SAAS,eAEb,KAAC,IAAI,kBAAC,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,iBAAc,MAAM,gBAC1D,CAAC,CAAC,oBAAoB,EAAE,CAAC,UAAU,EAAE,SAAS,CAAC,CAAC,YAC5C,EACP,MAAC,IAAI,kBACH,SAAS,EAAE;oBACT,GAAG,EAAE,CAAC;iBACP,EACD,IAAI,EAAC,OAAO,iBAEZ,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC3B,QAAQ,EAAE,UAAU,KAAK,CAAC,EAC1B,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,UAAU,GAAG,CAAC,CAAC,EAC/C,IAAI,sBAEJ,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,KAAK,EAAE,WAAI,YACzB,EACT,KAAC,MAAM,kBACL,OAAO,EAAC,QAAQ,EAChB,KAAK,EAAE,CAAC,CAAC,iBAAiB,CAAC,EAC3B,QAAQ,EAAE,UAAU,KAAK,SAAS,EAClC,OAAO,EAAE,GAAG,EAAE,CAAC,gBAAgB,CAAC,UAAU,GAAG,CAAC,CAAC,EAC/C,IAAI,sBAEJ,KAAC,IAAI,IAAC,IAAI,EAAE,SAAS,GAAG,EAAE,WAAI,YACvB,aACJ,aACF,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,YAAY,GAAG,YAAY,CAAC;AAEvC,eAAe,UAAU,CAAC","sourcesContent":["import { FunctionComponent, useCallback } from 'react';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useDirection, useI18n } from '../../hooks';\nimport Icon, { registerIcon } from '../Icon';\nimport * as caretLeftIcon from '../Icon/icons/caret-left.icon';\nimport * as caretRightIcon from '../Icon/icons/caret-right.icon';\nimport Button from '../Button';\nimport Flex from '../Flex';\n\nregisterIcon(caretLeftIcon, caretRightIcon);\n\nexport interface PaginationProps extends BaseProps {\n /** Total number of items. /\n total: number;\n /\n Size of each page.\n * @default 10\n /\n pageSize?: number;\n /\n Current page number.\n * @default 1\n /\n pageNumber?: number;\n /* Function to handle page change. */\n onPageChange?: (pageNumber: number) => void;\n}\n\nconst defaultProps: Partial<PaginationProps> = {\n pageNumber: 1,\n pageSize: 10\n};\n\nconst Pagination: FunctionComponent<PaginationProps & ForwardProps> = (props: PaginationProps) => {\n const { total, onPageChange, ...restProps } = props;\n let { pageSize = 10, pageNumber = 1 } = props;\n\n const t = useI18n();\n\n pageSize = Math.max(1, pageSize);\n const pageCount = Math.ceil(total / pageSize);\n if (pageNumber < 1) pageNumber = 1;\n if (pageNumber > pageCount) pageNumber = pageCount;\n\n const handlePageChange = useCallback(\n (currentValue: number) => {\n if (onPageChange) onPageChange(currentValue);\n },\n [onPageChange]\n );\n\n const { start, end } = useDirection();\n\n return (\n <Flex\n container={{\n gap: 1\n }}\n aria-label={t('pagination_page_of', [pageNumber, pageCount])}\n role='tablist'\n total={total}\n {...restProps}\n >\n <Flex container={{ alignItems: 'center' }} aria-hidden='true'>\n {t('pagination_page_of', [pageNumber, pageCount])}\n </Flex>\n <Flex\n container={{\n gap: 1\n }}\n role='group'\n >\n <Button\n variant='simple'\n label={t('pagination_prev')}\n disabled={pageNumber === 1}\n onClick={() => handlePageChange(pageNumber - 1)}\n icon\n >\n <Icon name={`caret-${start}`} />\n </Button>\n <Button\n variant='simple'\n label={t('pagination_next')}\n disabled={pageNumber === pageCount}\n onClick={() => handlePageChange(pageNumber + 1)}\n icon\n >\n <Icon name={`caret-${end}`} />\n </Button>\n </Flex>\n </Flex>\n );\n};\n\nPagination.defaultProps = defaultProps;\n\nexport default Pagination;\n"]}

package/lib/components/Phone/PhoneInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EAKJ,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAqB,MAAM,aAAa,CAAC;AAEzE,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAerE,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS;IAClE;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAwBD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,~~CAgIjE~~,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"PhoneInput.d.ts","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EAGL,iBAAiB,EAEjB,GAAG,EAKJ,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,SAAS,EAAE,YAAY,EAAqB,MAAM,aAAa,CAAC;AAEzE,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAerE,MAAM,WAAW,eAAgB,SAAQ,gBAAgB,EAAE,SAAS;IAClE;;;OAGG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,+CAA+C;IAC/C,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,oDAAoD;IACpD,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,oDAAoD;IACpD,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,oCAAoC;IACpC,GAAG,CAAC,EAAE,GAAG,CAAC,cAAc,CAAC,CAAC;CAC3B;AAwBD,QAAA,MAAM,UAAU,EAAE,iBAAiB,CAAC,eAAe,GAAG,YAAY,CAkIjE,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/Phone/PhoneInput.js CHANGED Viewed

@@ -19,13 +19,13 @@ const StyledPhoneInput = styled.div(() => {
     > ${StyledSelect} {
       max-width: max-content;
       border-inline-end: none;
-      border-top-${end}-radius: 0;
-      border-bottom-${end}-radius: 0;
+      ${`border-top-${end}-radius`}: 0;
+      ${`border-bottom-${end}-radius`}: 0;
     }
     > ${StyledSelect} + ${StyledInput} {
-      border-top-${start}-radius: 0;
-      border-bottom-${start}-radius: 0;
+      ${`border-top-${start}-radius`}: 0;
+      ${`border-bottom-${start}-radius`}: 0;
     }
   `;
 });
@@ -35,7 +35,7 @@ const PhoneInput = forwardRef((props, ref) => {
     const phoneNumberParts = useMemo(() => {
         return value ? getPhoneNumberParts(value, callingCodesList) : undefined;
     }, [callingCodesList, value]);
-    const [countryCode, setCountryCode] = useState(phoneNumberParts?.[0]);
+    const [countryCode, setCountryCode] = useState(showCountryCode ? phoneNumberParts?.[0] || callingCodesList[0] : phoneNumberParts?.[0]);
     const [phoneNumber, setPhoneNumber] = useState(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');
     useAfterInitialEffect(() => {
         setCountryCode(phoneNumberParts?.[0]);

package/lib/components/Phone/PhoneInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n ChangeEvent,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport {\n calculateCursorPosition,\n convertToCallbackParameter,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps {\n /*\n Display select with countries calling codes\n * @default false\n /\n showCountryCode?: boolean;\n /* Changes lists of countries calling codes /\n callingCodesList?: string[];\n /* Callback fired on input value change /\n onChange?: (value: string) => void;\n /* Callback fired when the component loses focus /\n onBlur?: (value: string) => void;\n /* CCallback fired when the component gets focus /\n onFocus?: (value: string) => void;\n /* Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n const { start, end } = useDirection();\n return css`\n border: 0;\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n border-top-${end}-radius: 0;\n border-bottom-${end}-radius: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n border-top-${start}-radius: 0;\n border-bottom-${start}-radius: 0;\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n const {\n defaultValue,\n value = defaultValue,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n ...restProps\n } = props;\n\n const phoneNumberParts = useMemo(() => {\n return value ? getPhoneNumberParts(value, callingCodesList) : undefined;\n }, [callingCodesList, value]);\n\n const [countryCode, setCountryCode] = useState(phoneNumberParts?.[0]);\n\n const [phoneNumber, setPhoneNumber] = useState(\n phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : ''\n );\n\n useAfterInitialEffect(() => {\n setCountryCode(phoneNumberParts?.[0]);\n setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');\n }, [phoneNumberParts]);\n\n const [cursor, setCursor] = useState<number \| undefined>(undefined);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (cursor !== undefined) inputRef.current?.setSelectionRange(cursor, cursor);\n }, [cursor, inputRef.current]);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const selectionStart = e.target.selectionStart;\n const formatted = formatPhoneNumber(inputValue, countryCode);\n setPhoneNumber(formatted);\n if (countryCode) {\n setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));\n }\n onChange?.(convertToCallbackParameter(countryCode, formatted));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n const selectValue = e.target.value;\n setCountryCode(selectValue);\n setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));\n onChange?.(convertToCallbackParameter(selectValue, phoneNumber));\n };\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && (\n <Select\n value={countryCode}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {codesOptions}\n </Select>\n )}\n <Input\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={phoneNumber}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n />\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n as='fieldset'\n labelAs='legend'\n {...{ label, labelHidden, id, info, ref, status, required, disabled }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default PhoneInput;\n"]}
1	+ {"version":3,"file":"PhoneInput.js","sourceRoot":"","sources":["../../../src/components/Phone/PhoneInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAEL,UAAU,EAIV,SAAS,EACT,OAAO,EACP,MAAM,EACN,QAAQ,EACT,MAAM,OAAO,CAAC;AACf,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAEhD,OAAO,EAAE,qBAAqB,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,aAAa,CAAC;AAClF,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAE/C,OAAO,SAAS,MAAM,cAAc,CAAC;AACrC,OAAO,EAAoB,iBAAiB,EAAE,MAAM,gBAAgB,CAAC;AACrE,OAAO,WAAW,MAAM,uBAAuB,CAAC;AAChD,OAAO,MAAM,EAAE,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AAC3C,OAAO,KAAK,MAAM,UAAU,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAChD,OAAO,IAAI,MAAM,SAAS,CAAC;AAE3B,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EACL,uBAAuB,EACvB,0BAA0B,EAC1B,iBAAiB,EACjB,mBAAmB,EACpB,MAAM,SAAS,CAAC;AAsBjB,MAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,CAA8B,GAAG,EAAE;IACpE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,YAAY,EAAE,CAAC;IACtC,OAAO,GAAG,CAAA;;QAEJ,YAAY;;;QAGZ,cAAc,GAAG,SAAS;QAC1B,iBAAiB,GAAG,SAAS;;;QAG7B,YAAY,MAAM,WAAW;QAC7B,cAAc,KAAK,SAAS;QAC5B,iBAAiB,KAAK,SAAS;;GAEpC,CAAC;AACJ,CAAC,CAAC,CAAC;AAEH,gBAAgB,CAAC,YAAY,GAAG,gBAAgB,CAAC;AAEjD,MAAM,UAAU,GAAsD,UAAU,CAC9E,CAAC,KAAuC,EAAE,GAA2B,EAAE,EAAE;IACvE,MAAM,EACJ,YAAY,EACZ,KAAK,GAAG,YAAY,EACpB,EAAE,EACF,KAAK,EACL,WAAW,EACX,IAAI,EACJ,MAAM,EACN,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,eAAe,GAAG,KAAK,EACvB,gBAAgB,GAAG,YAAY,EAC/B,QAAQ,EACR,MAAM,EACN,OAAO,EACP,GAAG,SAAS,EACb,GAAG,KAAK,CAAC;IAEV,MAAM,gBAAgB,GAAG,OAAO,CAAC,GAAG,EAAE;QACpC,OAAO,KAAK,CAAC,CAAC,CAAC,mBAAmB,CAAC,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC;IAC1E,CAAC,EAAE,CAAC,gBAAgB,EAAE,KAAK,CAAC,CAAC,CAAC;IAE9B,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAC5C,eAAe,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,IAAI,gBAAgB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CACvF,CAAC;IAEF,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAC5C,gBAAgB,CAAC,CAAC,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,CAC5E,CAAC;IAEF,qBAAqB,CAAC,GAAG,EAAE;QACzB,cAAc,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC;QACtC,cAAc,CAAC,gBAAgB,CAAC,CAAC,CAAC,iBAAiB,CAAC,gBAAgB,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;IAC9F,CAAC,EAAE,CAAC,gBAAgB,CAAC,CAAC,CAAC;IAEvB,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAqB,SAAS,CAAC,CAAC;IACpE,MAAM,QAAQ,GAAG,MAAM,CAAmB,IAAI,CAAC,CAAC;IAEhD,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,MAAM,KAAK,SAAS;YAAE,QAAQ,CAAC,OAAO,EAAE,iBAAiB,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChF,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAC;IAE/B,MAAM,aAAa,GAAG,CAAC,OAAgB,EAAE,EAAE;QACzC,MAAM,aAAa,GAAG,0BAA0B,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QAC3E,IAAI,OAAO;YAAE,OAAO,EAAE,CAAC,aAAa,CAAC,CAAC;;YACjC,MAAM,EAAE,CAAC,aAAa,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,MAAM,CAAc,IAAI,CAAC,CAAC;IAC/C,cAAc,CAAC,CAAC,YAAY,CAAC,EAAE,aAAa,CAAC,CAAC;IAE9C,MAAM,aAAa,GAAG,CAAC,CAAgC,EAAE,EAAE;QACzD,MAAM,UAAU,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAClC,MAAM,cAAc,GAAG,CAAC,CAAC,MAAM,CAAC,cAAc,CAAC;QAC/C,MAAM,SAAS,GAAG,iBAAiB,CAAC,UAAU,EAAE,WAAW,CAAC,CAAC;QAC7D,cAAc,CAAC,SAAS,CAAC,CAAC;QAC1B,IAAI,WAAW,EAAE;YACf,SAAS,CAAC,uBAAuB,CAAC,SAAS,EAAE,WAAW,EAAE,WAAW,EAAE,cAAc,CAAC,CAAC,CAAC;SACzF;QACD,QAAQ,EAAE,CAAC,0BAA0B,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC,CAAC;IACjE,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,CAAiC,EAAE,EAAE;QAC3D,MAAM,WAAW,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QACnC,cAAc,CAAC,WAAW,CAAC,CAAC;QAC5B,cAAc,CAAC,iBAAiB,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC;QAC5D,QAAQ,EAAE,CAAC,0BAA0B,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC,CAAC;IACnE,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CACnB,4BACG,gBAAgB,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAC5B,KAAC,MAAM,kBAAY,KAAK,EAAE,IAAI,gBAC3B,IAAI,KADM,IAAI,CAER,CACV,CAAC,WACD,CACJ,CAAC;IAEF,MAAM,IAAI,GAAG,CACX,MAAC,gBAAgB,kBACf,EAAE,EAAE,iBAAiB,EACrB,WAAW,EAAE,IAAW,EACxB,SAAS,EAAE,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,EAAE,QAAQ,EAAE,EACnD,GAAG,EAAE,YAAY,EACjB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,iBAEjB,eAAe,IAAI,CAClB,KAAC,MAAM,kBACL,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,cAAc,EACxB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,gBAEjB,YAAY,YACN,CACV,EACD,KAAC,KAAK,oBACA,SAAS,IACb,SAAS,EAAC,KAAK,EACf,GAAG,EAAE,QAAQ,EACb,KAAK,EAAE,WAAW,EAClB,QAAQ,EAAE,aAAa,EACvB,QAAQ,EAAE,QAAQ,EAClB,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,YAClB,aACe,CACpB,CAAC;IAEF,OAAO,KAAK,CAAC,CAAC,CAAC,CACb,KAAC,SAAS,kBACR,EAAE,EAAC,UAAU,EACb,OAAO,EAAC,QAAQ,IACZ,EAAE,KAAK,EAAE,WAAW,EAAE,EAAE,EAAE,IAAI,EAAE,GAAG,EAAE,MAAM,EAAE,QAAQ,EAAE,QAAQ,EAAE,cAEpE,IAAI,YACK,CACb,CAAC,CAAC,CAAC,CACF,IAAI,CACL,CAAC;AACJ,CAAC,CACF,CAAC;AAEF,eAAe,UAAU,CAAC","sourcesContent":["import {\n ChangeEvent,\n forwardRef,\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n useEffect,\n useMemo,\n useRef,\n useState\n} from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { useAfterInitialEffect, useDirection, useFocusWithin } from '../../hooks';\nimport { defaultThemeProp } from '../../theme';\nimport { BaseProps, ForwardProps, PropsWithDefaults } from '../../types';\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport StyledInput from '../Input/Input.styles';\nimport Select, { Option } from '../Select';\nimport Input from '../Input';\nimport { StyledSelect } from '../Select/Select';\nimport Flex from '../Flex';\n\nimport callingCodes from './callingCodes';\nimport {\n calculateCursorPosition,\n convertToCallbackParameter,\n formatPhoneNumber,\n getPhoneNumberParts\n} from './utils';\n\nexport interface PhoneInputProps extends FormControlProps, BaseProps {\n /*\n Display select with countries calling codes\n * @default false\n /\n showCountryCode?: boolean;\n /* Changes lists of countries calling codes /\n callingCodesList?: string[];\n /* Callback fired on input value change /\n onChange?: (value: string) => void;\n /* Callback fired when the component loses focus /\n onBlur?: (value: string) => void;\n /* CCallback fired when the component gets focus /\n onFocus?: (value: string) => void;\n /* Ref for the wrapping element. */\n ref?: Ref<HTMLDivElement>;\n}\n\ntype PhoneInputPropsWithDefaults = PropsWithDefaults<PhoneInputProps>;\n\nconst StyledPhoneInput = styled.div<PhoneInputPropsWithDefaults>(() => {\n const { start, end } = useDirection();\n return css`\n border: 0;\n > ${StyledSelect} {\n max-width: max-content;\n border-inline-end: none;\n ${`border-top-${end}-radius`}: 0;\n ${`border-bottom-${end}-radius`}: 0;\n }\n\n > ${StyledSelect} + ${StyledInput} {\n ${`border-top-${start}-radius`}: 0;\n ${`border-bottom-${start}-radius`}: 0;\n }\n `;\n});\n\nStyledPhoneInput.defaultProps = defaultThemeProp;\n\nconst PhoneInput: FunctionComponent<PhoneInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<PhoneInputProps>, ref: PhoneInputProps['ref']) => {\n const {\n defaultValue,\n value = defaultValue,\n id,\n label,\n labelHidden,\n info,\n status,\n required,\n readOnly,\n disabled,\n showCountryCode = false,\n callingCodesList = callingCodes,\n onChange,\n onBlur,\n onFocus,\n ...restProps\n } = props;\n\n const phoneNumberParts = useMemo(() => {\n return value ? getPhoneNumberParts(value, callingCodesList) : undefined;\n }, [callingCodesList, value]);\n\n const [countryCode, setCountryCode] = useState(\n showCountryCode ? phoneNumberParts?.[0] \|\| callingCodesList[0] : phoneNumberParts?.[0]\n );\n\n const [phoneNumber, setPhoneNumber] = useState(\n phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : ''\n );\n\n useAfterInitialEffect(() => {\n setCountryCode(phoneNumberParts?.[0]);\n setPhoneNumber(phoneNumberParts ? formatPhoneNumber(phoneNumberParts[1], countryCode) : '');\n }, [phoneNumberParts]);\n\n const [cursor, setCursor] = useState<number \| undefined>(undefined);\n const inputRef = useRef<HTMLInputElement>(null);\n\n useEffect(() => {\n if (cursor !== undefined) inputRef.current?.setSelectionRange(cursor, cursor);\n }, [cursor, inputRef.current]);\n\n const onFocusChange = (focused: boolean) => {\n const callbackParam = convertToCallbackParameter(countryCode, phoneNumber);\n if (focused) onFocus?.(callbackParam);\n else onBlur?.(callbackParam);\n };\n\n const containerRef = useRef<HTMLElement>(null);\n useFocusWithin([containerRef], onFocusChange);\n\n const onInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n const inputValue = e.target.value;\n const selectionStart = e.target.selectionStart;\n const formatted = formatPhoneNumber(inputValue, countryCode);\n setPhoneNumber(formatted);\n if (countryCode) {\n setCursor(calculateCursorPosition(formatted, phoneNumber, countryCode, selectionStart));\n }\n onChange?.(convertToCallbackParameter(countryCode, formatted));\n };\n\n const onSelectChange = (e: ChangeEvent<HTMLSelectElement>) => {\n const selectValue = e.target.value;\n setCountryCode(selectValue);\n setPhoneNumber(formatPhoneNumber(phoneNumber, selectValue));\n onChange?.(convertToCallbackParameter(selectValue, phoneNumber));\n };\n\n const codesOptions = (\n <>\n {callingCodesList.map(code => (\n <Option key={code} value={code}>\n {code}\n </Option>\n ))}\n </>\n );\n\n const Comp = (\n <StyledPhoneInput\n as={StyledFormControl}\n forwardedAs={Flex as any}\n container={{ alignItems: 'center', wrap: 'nowrap' }}\n ref={containerRef}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {showCountryCode && (\n <Select\n value={countryCode}\n onChange={onSelectChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n >\n {codesOptions}\n </Select>\n )}\n <Input\n {...restProps}\n inputMode='tel'\n ref={inputRef}\n value={phoneNumber}\n onChange={onInputChange}\n required={required}\n status={status}\n readOnly={readOnly}\n disabled={disabled}\n />\n </StyledPhoneInput>\n );\n\n return label ? (\n <FormField\n as='fieldset'\n labelAs='legend'\n {...{ label, labelHidden, id, info, ref, status, required, disabled }}\n >\n {Comp}\n </FormField>\n ) : (\n Comp\n );\n }\n);\n\nexport default PhoneInput;\n"]}

package/lib/components/RadioCheck/RadioCheck.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EACF,GAAG,EAKH,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAGrE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAKtD,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,sBAAsB,mJAiDlC,CAAC;AAIF,eAAO,MAAM,qBAAqB,2GAgGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,qJA6C5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,kKA2DhC,CAAC;AAIF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,YAAY,~~CAgFlD~~,CAAC;AAEF,eAAe,UAAU,CAAC"}
1	+ {"version":3,"file":"RadioCheck.d.ts","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,EAAE,EACF,GAAG,EAKH,iBAAiB,EACjB,oBAAoB,EACrB,MAAM,OAAO,CAAC;AAKf,OAAO,EAAE,gBAAgB,EAAqB,MAAM,gBAAgB,CAAC;AAGrE,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAKtD,MAAM,WAAW,eAAgB,SAAQ,SAAS;IAChD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,8BAA8B;IAC9B,IAAI,EAAE,OAAO,GAAG,UAAU,CAAC;IAC3B,yEAAyE;IACzE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,oEAAoE;IACpE,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB;;;OAGG;IACH,OAAO,CAAC,EAAE,QAAQ,GAAG,MAAM,CAAC;IAC5B,4CAA4C;IAC5C,OAAO,CAAC,EAAE,iBAAiB,CAAC,gBAAgB,CAAC,CAAC;IAC9C,8CAA8C;IAC9C,SAAS,CAAC,EAAE,oBAAoB,CAAC,gBAAgB,CAAC,CAAC;IACnD,6CAA6C;IAC7C,GAAG,CAAC,EAAE,GAAG,CAAC,gBAAgB,CAAC,CAAC;CAC7B;AAED,eAAO,MAAM,sBAAsB,mJAiDlC,CAAC;AAIF,eAAO,MAAM,qBAAqB,2GAgGhC,CAAC;AAIH,eAAO,MAAM,gBAAgB,qJA6C5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,kKA2DhC,CAAC;AAIF,QAAA,MAAM,UAAU,EAAE,EAAE,CAAC,eAAe,GAAG,YAAY,CAiFlD,CAAC;AAEF,eAAe,UAAU,CAAC"}

package/lib/components/RadioCheck/RadioCheck.js CHANGED Viewed

@@ -194,7 +194,7 @@ const RadioCheck = forwardRef((props, ref) => {
             newRef.current.indeterminate = !!indeterminate;
         }
     }, [newRef, indeterminate, isRadio]);
-    return (_jsx(FormField, Object.assign({ as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }, void 0), label] }, void 0), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, inline: true }, { children: _jsx(StyledRadioCheckInput, Object.assign({}, restProps, { id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, "aria-readonly": readOnly, onClick: (e) => {
+    return (_jsx(FormField, Object.assign({ as: card ? StyledRadioCheckCard : StyledRadioCheck, label: _jsxs(_Fragment, { children: [_jsx(StyledPseudoRadioCheck, { status: status, isRadio: isRadio, as: StyledFormControl, required: required, disabled: disabled, readOnly: readOnly }, void 0), label] }, void 0), labelAs: card ? 'div' : undefined, id: id, required: required, disabled: disabled, readOnly: readOnly, status: status, inline: true, labelAfter: true }, { children: _jsx(StyledRadioCheckInput, Object.assign({}, restProps, { id: id, type: type, required: required, disabled: disabled, readOnly: readOnly, "aria-readonly": readOnly, onClick: (e) => {
                 if (readOnly)
                     e.preventDefault();
                 onClick?.(e);

package/lib/components/RadioCheck/RadioCheck.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FC,\n Ref,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n PropsWithoutRef,\n MouseEventHandler,\n KeyboardEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, hideVisually, mix } from 'polished';\n\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils/utils';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConsolidatedRef, useDirection, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\n\nexport interface RadioCheckProps extends BaseProps {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Makes the input non editable and non clickable. The browser defaults to false. /\n readOnly?: FormControlProps['readOnly'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /* Sets the type of input. /\n type: 'radio' \| 'checkbox';\n /* Sets checked prop via onChange when using as controlled component. /\n checked?: boolean;\n /* Initialize checked prop when using as uncontrolled component. /\n defaultChecked?: boolean;\n /\n Sets control to an an indeterminate state.\n * @default false\n /\n indeterminate?: boolean;\n /\n Controls the styling of the RadioCheck.\n * @default 'simple'\n /\n variant?: 'simple' \| 'card';\n /* Callback function for onClick events. /\n onClick?: MouseEventHandler<HTMLInputElement>;\n /* Callback function for onKeyDown events. /\n onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n /* Ref forwarded to the underlying input. /\n ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledPseudoRadioCheck = styled.div<Pick<RadioCheckProps, 'readOnly' \| 'status'>>(\n props => {\n const {\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n },\n components: {\n 'form-field': formField,\n 'radio-check': {\n size,\n 'touch-size': touchSize,\n 'background-color': backgroundColor,\n 'border-color': borderColor,\n 'border-width': borderWidth\n }\n }\n },\n status\n } = props;\n\n const useBorderColor = status === 'error' ? formField.error['status-color'] : borderColor;\n const useBackgroundColor =\n status && formField[status]\n ? tryCatch(() => mix(0.8, primaryBackground, formField[status]['status-color']))\n : backgroundColor;\n\n return css`\n display: flex;\n flex-shrink: 0;\n position: relative;\n width: ${size};\n height: ${size};\n margin-inline-end: ${spacing};\n border: ${borderWidth} solid ${useBorderColor};\n background-color: ${useBackgroundColor};\n\n @media (pointer: coarse) {\n width: ${touchSize};\n height: ${touchSize};\n }\n\n &::after {\n content: '';\n display: none;\n }\n `;\n }\n);\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(props => {\n const {\n theme: {\n base: { 'border-radius': baseBorderRadius },\n components: {\n 'form-control': {\n ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n ':read-only': { 'background-color': readOnlyBackgroundColor }\n },\n 'radio-check': {\n ':checked': {\n 'background-color': checkedBackgroundColor,\n 'border-color': checkedBorderColor\n }\n },\n checkbox: { 'border-radius': checkRadius },\n 'radio-button': { 'border-radius': radioRadius }\n }\n }\n } = props;\n\n const backgroundColor = props.readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n const foreground = tryCatch(() => readableColor(backgroundColor));\n\n const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n const { ltr } = useDirection();\n\n return css`\n ${hideVisually}\n\n ${!(props.disabled \|\| props.readOnly) &&\n css`\n &:focus ${prcSelector} {\n box-shadow: ${shadow};\n border-color: ${focusBorderColor};\n }\n `}\n\n &:checked\n ${prcSelector},\n &:checked:disabled\n ${prcSelector},\n &[type='checkbox']:indeterminate\n ${prcSelector},\n &[type='checkbox']:indeterminate:disabled\n ${prcSelector} {\n border-color: ${props.readOnly ? 'inherit' : checkedBorderColor};\n background-color: ${backgroundColor};\n\n &::after {\n display: block;\n }\n }\n\n &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n border-radius: ${radioRadius};\n }\n\n &[type='radio'] ${prcSelector}::after {\n margin: auto;\n width: 100%;\n height: 100%;\n background-color: ${foreground};\n transform: scale(0.4);\n }\n\n &[type='checkbox'] ${prcSelector} {\n border-radius: min(calc(${baseBorderRadius} ${checkRadius}), 0.25rem);\n }\n\n &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n &::after {\n width: 40%;\n height: 75%;\n ${ltr\n ? css`\n transform: rotate(45deg) translate(50%, -30%);\n `\n : css`\n transform: rotate(45deg) translate(-50%, 30%);\n `}\n border-right: 0.15em solid ${foreground};\n border-bottom: 0.15em solid ${foreground};\n }\n }\n\n &[type='checkbox']:indeterminate ${prcSelector} {\n display: flex;\n &::after {\n width: 90%;\n height: 0.15em;\n margin: auto;\n background-color: ${foreground};\n }\n }\n `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' \| 'readOnly'>>(\n props => {\n const {\n disabled,\n readOnly,\n theme: {\n base,\n components: {\n 'radio-check': {\n label: { color: labelColor, 'font-weight': labelFontWeight }\n },\n 'form-control': {\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n } = props;\n\n const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n return css`\n > ${StyledLabel} {\n cursor: pointer;\n display: flex;\n align-items: center;\n font-weight: ${labelFontWeight};\n word-break: break-word;\n font-size: ${fontSize.s};\n color: ${labelColor};\n margin: 0;\n min-height: ${base['hit-area']['mouse-min']};\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n }\n\n ${!(disabled \|\| readOnly) &&\n css`\n &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n border-color: ${hoverBorderColor};\n }\n `}\n `;\n }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n Pick<RadioCheckProps, 'disabled' \| 'readOnly' \| 'status'>\n>(\n ({\n disabled,\n readOnly,\n status,\n theme: {\n base: { palette, shadow, spacing },\n components: {\n card,\n 'form-field': formField,\n 'radio-check': { label },\n 'form-control': {\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n }) => {\n const useBorderColor =\n status === 'error' ? formField.error['status-color'] : palette['border-line'];\n\n return css`\n min-width: min-content;\n align-items: start;\n cursor: pointer;\n background-color: ${card.background};\n border-radius: ${card['border-radius']};\n border: 0.0625rem solid ${useBorderColor};\n padding: ${spacing};\n\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n\n ${!(disabled \|\| readOnly) &&\n css`\n :hover:not(:focus-within) {\n border-color: ${hoverBorderColor};\n ${StyledLabel} ${StyledPseudoRadioCheck} {\n border-color: ${hoverBorderColor};\n }\n }\n\n :focus-within {\n box-shadow: ${shadow.focus};\n border-color: transparent;\n }\n `}\n\n > ${StyledLabel} {\n display: grid;\n grid-template-columns: auto 1fr;\n color: ${label.color};\n font-weight: ${label['font-weight']};\n }\n `;\n }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckProps>, ref: RadioCheckProps['ref']) => {\n const uid = useUID();\n const {\n type,\n id = uid,\n label,\n required = false,\n disabled = false,\n indeterminate = false,\n readOnly = false,\n variant = 'simple',\n onClick,\n onKeyDown,\n status,\n ...restProps\n } = props;\n\n const isRadio = type === 'radio';\n const card = variant === 'card';\n const newRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n if (!isRadio && newRef.current) {\n newRef.current.indeterminate = !!indeterminate;\n }\n }, [newRef, indeterminate, isRadio]);\n\n return (\n <FormField\n as={card ? StyledRadioCheckCard : StyledRadioCheck}\n label={\n <>\n <StyledPseudoRadioCheck\n status={status}\n isRadio={isRadio}\n as={StyledFormControl}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n />\n {label}\n </>\n }\n labelAs={card ? 'div' : undefined}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n inline\n >\n <StyledRadioCheckInput\n {...restProps}\n id={id}\n type={type}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n aria-readonly={readOnly}\n onClick={(e: MouseEvent<HTMLInputElement>) => {\n if (readOnly) e.preventDefault();\n\n onClick?.(e);\n }}\n onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n if (type === 'checkbox' && readOnly && e.key === ' ') {\n e.preventDefault();\n }\n if (type === 'radio' && readOnly && e.key.includes('Arrow')) {\n e.preventDefault();\n }\n\n onKeyDown?.(e);\n }}\n ref={newRef}\n />\n </FormField>\n );\n }\n);\n\nexport default RadioCheck;\n"]}
1	+ {"version":3,"file":"RadioCheck.js","sourceRoot":"","sources":["../../../src/components/RadioCheck/RadioCheck.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n forwardRef,\n FC,\n Ref,\n useEffect,\n MouseEvent,\n KeyboardEvent,\n PropsWithoutRef,\n MouseEventHandler,\n KeyboardEventHandler\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { readableColor, hideVisually, mix } from 'polished';\n\nimport FormField from '../FormField';\nimport { FormControlProps, StyledFormControl } from '../FormControl';\nimport { defaultThemeProp } from '../../theme';\nimport { tryCatch } from '../../utils/utils';\nimport { BaseProps, ForwardProps } from '../../types';\nimport { useConsolidatedRef, useDirection, useUID } from '../../hooks';\nimport { StyledLabel } from '../Label';\nimport { calculateFontSize } from '../../styles';\n\nexport interface RadioCheckProps extends BaseProps {\n /*\n Sets DOM id for the control and associates label element via 'for' attribute.\n * If an id is not pass, a random id will be generated for any render.\n /\n id?: FormControlProps['id'];\n /* Pass a string or a fragment with an Icon and string. /\n label?: FormControlProps['label'];\n /* Indicate if the field is required. The browser defaults to false. /\n required?: FormControlProps['required'];\n /* Disable the control. The browser defaults to false. /\n disabled?: FormControlProps['disabled'];\n /* Makes the input non editable and non clickable. The browser defaults to false. /\n readOnly?: FormControlProps['readOnly'];\n /* Set visual state based on a validation state. /\n status?: FormControlProps['status'];\n /* Sets html name attribute for the underlying control. Useful for mapping to a data field. /\n name?: FormControlProps['name'];\n /* Sets the type of input. /\n type: 'radio' \| 'checkbox';\n /* Sets checked prop via onChange when using as controlled component. /\n checked?: boolean;\n /* Initialize checked prop when using as uncontrolled component. /\n defaultChecked?: boolean;\n /\n Sets control to an an indeterminate state.\n * @default false\n /\n indeterminate?: boolean;\n /\n Controls the styling of the RadioCheck.\n * @default 'simple'\n /\n variant?: 'simple' \| 'card';\n /* Callback function for onClick events. /\n onClick?: MouseEventHandler<HTMLInputElement>;\n /* Callback function for onKeyDown events. /\n onKeyDown?: KeyboardEventHandler<HTMLInputElement>;\n /* Ref forwarded to the underlying input. /\n ref?: Ref<HTMLInputElement>;\n}\n\nexport const StyledPseudoRadioCheck = styled.div<Pick<RadioCheckProps, 'readOnly' \| 'status'>>(\n props => {\n const {\n theme: {\n base: {\n spacing,\n palette: { 'primary-background': primaryBackground }\n },\n components: {\n 'form-field': formField,\n 'radio-check': {\n size,\n 'touch-size': touchSize,\n 'background-color': backgroundColor,\n 'border-color': borderColor,\n 'border-width': borderWidth\n }\n }\n },\n status\n } = props;\n\n const useBorderColor = status === 'error' ? formField.error['status-color'] : borderColor;\n const useBackgroundColor =\n status && formField[status]\n ? tryCatch(() => mix(0.8, primaryBackground, formField[status]['status-color']))\n : backgroundColor;\n\n return css`\n display: flex;\n flex-shrink: 0;\n position: relative;\n width: ${size};\n height: ${size};\n margin-inline-end: ${spacing};\n border: ${borderWidth} solid ${useBorderColor};\n background-color: ${useBackgroundColor};\n\n @media (pointer: coarse) {\n width: ${touchSize};\n height: ${touchSize};\n }\n\n &::after {\n content: '';\n display: none;\n }\n `;\n }\n);\n\nStyledPseudoRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckInput = styled.input(props => {\n const {\n theme: {\n base: { 'border-radius': baseBorderRadius },\n components: {\n 'form-control': {\n ':focus': { 'box-shadow': shadow, 'border-color': focusBorderColor },\n ':read-only': { 'background-color': readOnlyBackgroundColor }\n },\n 'radio-check': {\n ':checked': {\n 'background-color': checkedBackgroundColor,\n 'border-color': checkedBorderColor\n }\n },\n checkbox: { 'border-radius': checkRadius },\n 'radio-button': { 'border-radius': radioRadius }\n }\n }\n } = props;\n\n const backgroundColor = props.readOnly ? readOnlyBackgroundColor : checkedBackgroundColor;\n const foreground = tryCatch(() => readableColor(backgroundColor));\n\n const prcSelector = `+ ${StyledLabel} ${StyledPseudoRadioCheck}`;\n const { ltr } = useDirection();\n\n return css`\n ${hideVisually}\n\n ${!(props.disabled \|\| props.readOnly) &&\n css`\n &:focus ${prcSelector} {\n box-shadow: ${shadow};\n border-color: ${focusBorderColor};\n }\n `}\n\n &:checked\n ${prcSelector},\n &:checked:disabled\n ${prcSelector},\n &[type='checkbox']:indeterminate\n ${prcSelector},\n &[type='checkbox']:indeterminate:disabled\n ${prcSelector} {\n border-color: ${props.readOnly ? 'inherit' : checkedBorderColor};\n background-color: ${backgroundColor};\n\n &::after {\n display: block;\n }\n }\n\n &[type='radio'] ${prcSelector}, &[type='radio'] ${prcSelector}::after {\n border-radius: ${radioRadius};\n }\n\n &[type='radio'] ${prcSelector}::after {\n margin: auto;\n width: 100%;\n height: 100%;\n background-color: ${foreground};\n transform: scale(0.4);\n }\n\n &[type='checkbox'] ${prcSelector} {\n border-radius: min(calc(${baseBorderRadius} ${checkRadius}), 0.25rem);\n }\n\n &[type='checkbox']:not(:indeterminate) ${prcSelector} {\n &::after {\n width: 40%;\n height: 75%;\n ${ltr\n ? css`\n transform: rotate(45deg) translate(50%, -30%);\n `\n : css`\n transform: rotate(45deg) translate(-50%, 30%);\n `}\n border-right: 0.15em solid ${foreground};\n border-bottom: 0.15em solid ${foreground};\n }\n }\n\n &[type='checkbox']:indeterminate ${prcSelector} {\n display: flex;\n &::after {\n width: 90%;\n height: 0.15em;\n margin: auto;\n background-color: ${foreground};\n }\n }\n `;\n});\n\nStyledRadioCheckInput.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheck = styled.div<Pick<RadioCheckProps, 'disabled' \| 'readOnly'>>(\n props => {\n const {\n disabled,\n readOnly,\n theme: {\n base,\n components: {\n 'radio-check': {\n label: { color: labelColor, 'font-weight': labelFontWeight }\n },\n 'form-control': {\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n } = props;\n\n const fontSize = calculateFontSize(base['font-size'], base['font-scale']);\n\n return css`\n > ${StyledLabel} {\n cursor: pointer;\n display: flex;\n align-items: center;\n font-weight: ${labelFontWeight};\n word-break: break-word;\n font-size: ${fontSize.s};\n color: ${labelColor};\n margin: 0;\n min-height: ${base['hit-area']['mouse-min']};\n\n @media (pointer: coarse) {\n min-height: ${base['hit-area']['finger-min']};\n }\n }\n\n ${!(disabled \|\| readOnly) &&\n css`\n &:not(:focus-within) > ${StyledLabel}:hover ${StyledPseudoRadioCheck} {\n border-color: ${hoverBorderColor};\n }\n `}\n `;\n }\n);\n\nStyledRadioCheck.defaultProps = defaultThemeProp;\n\nexport const StyledRadioCheckCard = styled.label<\n Pick<RadioCheckProps, 'disabled' \| 'readOnly' \| 'status'>\n>(\n ({\n disabled,\n readOnly,\n status,\n theme: {\n base: { palette, shadow, spacing },\n components: {\n card,\n 'form-field': formField,\n 'radio-check': { label },\n 'form-control': {\n ':hover': { 'border-color': hoverBorderColor }\n }\n }\n }\n }) => {\n const useBorderColor =\n status === 'error' ? formField.error['status-color'] : palette['border-line'];\n\n return css`\n min-width: min-content;\n align-items: start;\n cursor: pointer;\n background-color: ${card.background};\n border-radius: ${card['border-radius']};\n border: 0.0625rem solid ${useBorderColor};\n padding: ${spacing};\n\n ${disabled &&\n css`\n cursor: not-allowed;\n `}\n\n ${!(disabled \|\| readOnly) &&\n css`\n :hover:not(:focus-within) {\n border-color: ${hoverBorderColor};\n ${StyledLabel} ${StyledPseudoRadioCheck} {\n border-color: ${hoverBorderColor};\n }\n }\n\n :focus-within {\n box-shadow: ${shadow.focus};\n border-color: transparent;\n }\n `}\n\n > ${StyledLabel} {\n display: grid;\n grid-template-columns: auto 1fr;\n color: ${label.color};\n font-weight: ${label['font-weight']};\n }\n `;\n }\n);\n\nStyledRadioCheckCard.defaultProps = defaultThemeProp;\n\nconst RadioCheck: FC<RadioCheckProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<RadioCheckProps>, ref: RadioCheckProps['ref']) => {\n const uid = useUID();\n const {\n type,\n id = uid,\n label,\n required = false,\n disabled = false,\n indeterminate = false,\n readOnly = false,\n variant = 'simple',\n onClick,\n onKeyDown,\n status,\n ...restProps\n } = props;\n\n const isRadio = type === 'radio';\n const card = variant === 'card';\n const newRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n if (!isRadio && newRef.current) {\n newRef.current.indeterminate = !!indeterminate;\n }\n }, [newRef, indeterminate, isRadio]);\n\n return (\n <FormField\n as={card ? StyledRadioCheckCard : StyledRadioCheck}\n label={\n <>\n <StyledPseudoRadioCheck\n status={status}\n isRadio={isRadio}\n as={StyledFormControl}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n />\n {label}\n </>\n }\n labelAs={card ? 'div' : undefined}\n id={id}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n status={status}\n inline\n labelAfter\n >\n <StyledRadioCheckInput\n {...restProps}\n id={id}\n type={type}\n required={required}\n disabled={disabled}\n readOnly={readOnly}\n aria-readonly={readOnly}\n onClick={(e: MouseEvent<HTMLInputElement>) => {\n if (readOnly) e.preventDefault();\n\n onClick?.(e);\n }}\n onKeyDown={(e: KeyboardEvent<HTMLInputElement>) => {\n if (type === 'checkbox' && readOnly && e.key === ' ') {\n e.preventDefault();\n }\n if (type === 'radio' && readOnly && e.key.includes('Arrow')) {\n e.preventDefault();\n }\n\n onKeyDown?.(e);\n }}\n ref={newRef}\n />\n </FormField>\n );\n }\n);\n\nexport default RadioCheck;\n"]}

package/lib/components/Rating/Rating.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;~~AAItD~~,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8DAA8D;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAgCD,UAAU,wBAAwB;IAChC,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,mBAAmB,+HAU9B,CAAC;AAkCH,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAwBzD,CAAC;AAIF,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Rating.d.ts","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAQtD,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8DAA8D;IAC9D,KAAK,EAAE,MAAM,CAAC;IACd,0EAA0E;IAC1E,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qCAAqC;IACrC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAgCD,UAAU,wBAAwB;IAChC,gBAAgB,EAAE,MAAM,CAAC;CAC1B;AAED,eAAO,MAAM,mBAAmB,+HAU9B,CAAC;AAkCH,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAwBzD,CAAC;AAIF,eAAe,MAAM,CAAC"}

package/lib/components/Rating/Rating.js CHANGED Viewed

@@ -1,7 +1,10 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import styled, { css } from 'styled-components';
 import { defaultThemeProp } from '../../theme';
-import Icon from '../Icon';
+import Icon, { registerIcon } from '../Icon';
+import * as starIcon from '../Icon/icons/star.icon';
+import * as starSolidIcon from '../Icon/icons/star-solid.icon';
+registerIcon(starIcon, starSolidIcon);
 const DEFAULT_MAX_RATING = 5;
 const defaultProps = {
     readOnly: false,

package/lib/components/Rating/Rating.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Rating.js","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":";AACA,OAAO,MAAM,EAAE,EAAE,GAAG,EAAE,MAAM,mBAAmB,CAAC;AAGhD,OAAO,EAAE,gBAAgB,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,IAAI,MAAM,SAAS,CAAC;~~AA0B3B~~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","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Icon from '../Icon';\n\nexport interface RatingProps extends BaseProps {\n /*\n Sets the rating to read only.\n * @default false\n /\n readOnly?: boolean;\n /\n The maximum rating allowed. Must be an integer greater than 1.\n * @default 5\n /\n maxRating?: number;\n /* The value of the Rating. Could be a decimal or integer. /\n value: number;\n /* Text that is displayed in parentheses inline with the Rating stars. /\n metaInfo?: string;\n /* Aria label for screen readers. /\n 'aria-label'?: string;\n /\n The tabIndex to control focus.\n * @default 0\n /\n tabIndex?: number;\n}\n\nconst DEFAULT_MAX_RATING = 5;\n\nconst defaultProps: Partial<RatingProps> = {\n readOnly: false,\n maxRating: DEFAULT_MAX_RATING,\n tabIndex: 0\n};\n\nconst StyledRating = styled.div`\n display: inline-block;\n vertical-align: middle;\n`;\n\nconst StyledRatingItemsContainer = styled.div(props => {\n const { theme } = props;\n return css`\n color: ${theme.components.rating.color};\n line-height: 1;\n vertical-align: middle;\n display: inline-block;\n `;\n});\n\nStyledRatingItemsContainer.defaultProps = defaultThemeProp;\n\nconst StyledPartialRatingContainer = styled.div`\n position: relative;\n display: inline-block;\n`;\n\ninterface StyledPartialRatingProps {\n ratingPercentage: number;\n}\n\nexport const StyledPartialRating = styled.div<StyledPartialRatingProps>(props => {\n const { ratingPercentage } = props;\n return css`\n display: inline-block;\n position: absolute;\n inset-inline-start: 0;\n width: ${ratingPercentage}%;\n overflow: hidden;\n white-space: nowrap;\n `;\n});\n\nconst StyledRatingMetaInfo = styled.span(props => {\n const { theme } = props;\n return css`\n margin-inline-start: ${theme.base.spacing};\n `;\n});\n\nStyledRatingMetaInfo.defaultProps = defaultThemeProp;\n\ninterface RatingItemProps {\n fill: number;\n}\n\nconst RatingItem: FunctionComponent<RatingItemProps> = (props: RatingItemProps) => {\n const { fill, ...restProps } = props;\n const fillPercentage = Math.round((100 / 1) fill);\n return (\n <>\n {fillPercentage === 0 && <Icon {...restProps} name='star' />}\n {fillPercentage === 100 && <Icon {...restProps} name='star-solid' />}\n {fillPercentage > 0 && fillPercentage < 100 && (\n <StyledPartialRatingContainer>\n <Icon {...restProps} name='star' />\n <StyledPartialRating ratingPercentage={fillPercentage}>\n <Icon {...restProps} name='star-solid' />\n </StyledPartialRating>\n </StyledPartialRatingContainer>\n )}\n </>\n );\n};\n\nconst Rating: FunctionComponent<RatingProps & ForwardProps> = (props: RatingProps) => {\n const starsOutline = [];\n const { 'aria-label': ariaLabel, metaInfo, tabIndex, readOnly, ...restProps } = props;\n\n let { maxRating, value } = props;\n maxRating = typeof maxRating !== 'number' ? DEFAULT_MAX_RATING : maxRating;\n maxRating = Math.max(1, maxRating);\n value = Math.min(maxRating, value);\n\n const isDecimalValue = Math.round(value) !== value;\n for (let i = 1; i <= maxRating; i += 1) {\n let fillValue = i <= value ? 1 : 0;\n if (isDecimalValue && Math.ceil(value) === i) {\n fillValue = value - Math.floor(value);\n }\n starsOutline.push(<RatingItem key={`star-${i}`} fill={fillValue} />);\n }\n\n return (\n <StyledRating aria-label={ariaLabel} tabIndex={tabIndex} {...restProps}>\n <StyledRatingItemsContainer>{starsOutline}</StyledRatingItemsContainer>\n {metaInfo && <StyledRatingMetaInfo>({metaInfo})</StyledRatingMetaInfo>}{' '}\n </StyledRating>\n );\n};\n\nRating.defaultProps = defaultProps;\n\nexport default Rating;\n"]}
1	+ {"version":3,"file":"Rating.js","sourceRoot":"","sources":["../../../src/components/Rating/Rating.tsx"],"names":[],"mappings":"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","sourcesContent":["import { FunctionComponent } from 'react';\nimport styled, { css } from 'styled-components';\n\nimport { BaseProps, ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Icon, { registerIcon } from '../Icon';\nimport * as starIcon from '../Icon/icons/star.icon';\nimport * as starSolidIcon from '../Icon/icons/star-solid.icon';\n\nregisterIcon(starIcon, starSolidIcon);\n\nexport interface RatingProps extends BaseProps {\n /*\n Sets the rating to read only.\n * @default false\n /\n readOnly?: boolean;\n /\n The maximum rating allowed. Must be an integer greater than 1.\n * @default 5\n /\n maxRating?: number;\n /* The value of the Rating. Could be a decimal or integer. /\n value: number;\n /* Text that is displayed in parentheses inline with the Rating stars. /\n metaInfo?: string;\n /* Aria label for screen readers. /\n 'aria-label'?: string;\n /\n The tabIndex to control focus.\n * @default 0\n /\n tabIndex?: number;\n}\n\nconst DEFAULT_MAX_RATING = 5;\n\nconst defaultProps: Partial<RatingProps> = {\n readOnly: false,\n maxRating: DEFAULT_MAX_RATING,\n tabIndex: 0\n};\n\nconst StyledRating = styled.div`\n display: inline-block;\n vertical-align: middle;\n`;\n\nconst StyledRatingItemsContainer = styled.div(props => {\n const { theme } = props;\n return css`\n color: ${theme.components.rating.color};\n line-height: 1;\n vertical-align: middle;\n display: inline-block;\n `;\n});\n\nStyledRatingItemsContainer.defaultProps = defaultThemeProp;\n\nconst StyledPartialRatingContainer = styled.div`\n position: relative;\n display: inline-block;\n`;\n\ninterface StyledPartialRatingProps {\n ratingPercentage: number;\n}\n\nexport const StyledPartialRating = styled.div<StyledPartialRatingProps>(props => {\n const { ratingPercentage } = props;\n return css`\n display: inline-block;\n position: absolute;\n inset-inline-start: 0;\n width: ${ratingPercentage}%;\n overflow: hidden;\n white-space: nowrap;\n `;\n});\n\nconst StyledRatingMetaInfo = styled.span(props => {\n const { theme } = props;\n return css`\n margin-inline-start: ${theme.base.spacing};\n `;\n});\n\nStyledRatingMetaInfo.defaultProps = defaultThemeProp;\n\ninterface RatingItemProps {\n fill: number;\n}\n\nconst RatingItem: FunctionComponent<RatingItemProps> = (props: RatingItemProps) => {\n const { fill, ...restProps } = props;\n const fillPercentage = Math.round((100 / 1) fill);\n return (\n <>\n {fillPercentage === 0 && <Icon {...restProps} name='star' />}\n {fillPercentage === 100 && <Icon {...restProps} name='star-solid' />}\n {fillPercentage > 0 && fillPercentage < 100 && (\n <StyledPartialRatingContainer>\n <Icon {...restProps} name='star' />\n <StyledPartialRating ratingPercentage={fillPercentage}>\n <Icon {...restProps} name='star-solid' />\n </StyledPartialRating>\n </StyledPartialRatingContainer>\n )}\n </>\n );\n};\n\nconst Rating: FunctionComponent<RatingProps & ForwardProps> = (props: RatingProps) => {\n const starsOutline = [];\n const { 'aria-label': ariaLabel, metaInfo, tabIndex, readOnly, ...restProps } = props;\n\n let { maxRating, value } = props;\n maxRating = typeof maxRating !== 'number' ? DEFAULT_MAX_RATING : maxRating;\n maxRating = Math.max(1, maxRating);\n value = Math.min(maxRating, value);\n\n const isDecimalValue = Math.round(value) !== value;\n for (let i = 1; i <= maxRating; i += 1) {\n let fillValue = i <= value ? 1 : 0;\n if (isDecimalValue && Math.ceil(value) === i) {\n fillValue = value - Math.floor(value);\n }\n starsOutline.push(<RatingItem key={`star-${i}`} fill={fillValue} />);\n }\n\n return (\n <StyledRating aria-label={ariaLabel} tabIndex={tabIndex} {...restProps}>\n <StyledRatingItemsContainer>{starsOutline}</StyledRatingItemsContainer>\n {metaInfo && <StyledRatingMetaInfo>({metaInfo})</StyledRatingMetaInfo>}{' '}\n </StyledRating>\n );\n};\n\nRating.defaultProps = defaultProps;\n\nexport default Rating;\n"]}

package/lib/components/SearchInput/SearchInput.d.ts CHANGED Viewed

@@ -3,8 +3,8 @@ import { ForwardProps } from '../../types';
 import { FormControlProps } from '../FormControl';
 export interface SearchInputProps {
     /**
-     * Placeholder text. The default value is a locale translation of 'Search...'
-     * @default "Search..."
+     * Placeholder text. The default value is a locale translation of 'Search…'
+     * @default "Search…"
      */
     placeholder?: FormControlProps['placeholder'];
     /**

package/lib/components/SearchInput/SearchInput.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;~~AAI3C~~,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;~~AAKlD~~,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,iDAAiD;IACjD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,2DAA2D;IAC3D,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,yGAsB3B,CAAC;AAIH,eAAO,MAAM,qBAAqB,0KA0BhC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAgB5B,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAwEnE,CAAC;AAEF,eAAe,WAAW,CAAC"}
1	+ {"version":3,"file":"SearchInput.d.ts","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,iBAAiB,EASlB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAK3C,OAAO,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAOlD,MAAM,WAAW,gBAAgB;IAC/B;;;OAGG;IACH,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC;;OAEG;IACH,YAAY,CAAC,EAAE,gBAAgB,CAAC,cAAc,CAAC,CAAC;IAChD,iDAAiD;IACjD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC;;;OAGG;IACH,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACzC,2DAA2D;IAC3D,oBAAoB,CAAC,EAAE,MAAM,CAAC;CAC/B;AAED,eAAO,MAAM,gBAAgB,yGAsB3B,CAAC;AAIH,eAAO,MAAM,qBAAqB,0KA0BhC,CAAC;AAIH,eAAO,MAAM,iBAAiB,yGAgB5B,CAAC;AAIH,QAAA,MAAM,WAAW,EAAE,iBAAiB,CAAC,gBAAgB,GAAG,YAAY,CAwEnE,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/components/SearchInput/SearchInput.js CHANGED Viewed

@@ -4,10 +4,12 @@ import styled, { css } from 'styled-components';
 import { transparentize } from 'polished';
 import { defaultThemeProp } from '../../theme';
 import Input from '../Input';
-import Icon from '../Icon';
+import Icon, { registerIcon } from '../Icon';
+import * as searchIcon from '../Icon/icons/search.icon';
 import { useAfterInitialEffect, useConsolidatedRef, useI18n } from '../../hooks';
 import Flex from '../Flex';
 import { tryCatch } from '../../utils';
+registerIcon(searchIcon);
 export const StyledSearchIcon = styled.div(props => {
     const { theme: { base, components: { 'search-input': searchInput, 'form-control': formControl } } } = props;
     const iconColor = tryCatch(() => transparentize(0.75, base.palette['foreground-color']));

package/lib/components/SearchInput/SearchInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n forwardRef,\n useState,\n ChangeEvent,\n useCallback,\n KeyboardEvent,\n useEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport { ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Input from '../Input';\nimport Icon from '../Icon';\nimport { FormControlProps } from '../FormControl';\nimport { useAfterInitialEffect, useConsolidatedRef, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport { tryCatch } from '../../utils';\n\nexport interface SearchInputProps {\n /*\n Placeholder text. The default value is a locale translation of 'Search...'\n * @default \"Search...\"\n /\n placeholder?: FormControlProps['placeholder'];\n /\n Creates a controlled input and sets the value. Requires an onChange handler to update value.\n * value + onChange is the recommended method per React team.\n /\n value?: FormControlProps['value'];\n /\n If you wish to use an [uncontrolled input](https://reactjs.org/docs/uncontrolled-components.html), pass a defaultValue prop and a ref to access the input's native value prop or by other DOM ref means.\n /\n defaultValue?: FormControlProps['defaultValue'];\n /* Called when the SearchInput value changes. /\n onSearchChange?: (value: string) => void;\n /\n Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n /\n onSearchSubmit?: (value: string) => void;\n /* Aria label for search input, used by screen readers. /\n searchInputAriaLabel?: string;\n}\n\nexport const StyledSearchIcon = styled.div(props => {\n const {\n theme: {\n base,\n components: { 'search-input': searchInput, 'form-control': formControl }\n }\n } = props;\n const iconColor = tryCatch(() => transparentize(0.75, base.palette['foreground-color']));\n return css`\n position: absolute;\n z-index: 1;\n inset-inline-start: 0.0625rem;\n top: 0.0625rem;\n width: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n height: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n border-radius: calc(${base['border-radius']} ${searchInput['border-radius']});\n padding: 0;\n background: ${formControl['background-color']};\n color: ${iconColor};\n cursor: text;\n line-height: 1;\n `;\n});\n\nStyledSearchIcon.defaultProps = defaultThemeProp;\n\nexport const StyledSearchTextInput = styled(Input)(props => {\n const { theme } = props;\n const comp = theme.components['search-input'];\n return css`\n position: relative;\n width: 100%;\n height: ${theme.base['hit-area']['mouse-min']};\n min-height: ${theme.base['hit-area']['mouse-min']};\n padding-inline-start: 0;\n padding-inline-end: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n text-indent: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});\n &::-ms-clear {\n display: none;\n }\n &::-webkit-search-cancel-button {\n display: none;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n &:focus:not([disabled]) {\n box-shadow: none;\n }\n `;\n});\n\nStyledSearchTextInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchInput = styled.div(({ theme: { base, components } }) => {\n const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n\n return css`\n position: relative;\n height: ${base['hit-area']['mouse-min']};\n border-radius: calc(${components['search-input']['border-radius']} * ${base['border-radius']});\n\n &:focus-within {\n box-shadow: ${base.shadow.focus};\n\n ${StyledSearchIcon} {\n color: ${iconColor};\n }\n }\n `;\n});\n\nStyledSearchInput.defaultProps = defaultThemeProp;\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) => {\n const t = useI18n();\n\n const {\n defaultValue,\n value,\n placeholder = t('search_placeholder_default'),\n onSearchChange,\n onSearchSubmit,\n searchInputAriaLabel,\n ...restProps\n } = props;\n\n const [searchInputValue, setValue] = useState<string>(value \|\| defaultValue \|\| '');\n\n const innerRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n if (typeof value === 'string' && value !== searchInputValue) {\n setValue(value);\n }\n }, [value]);\n\n const onChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setValue(e.target.value);\n },\n [searchInputValue]\n );\n\n const onSubmit = useCallback(() => {\n onSearchSubmit?.(searchInputValue);\n }, [searchInputValue]);\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n onSubmit();\n }\n },\n [searchInputValue]\n );\n\n useAfterInitialEffect(() => {\n if (onSearchChange) onSearchChange(searchInputValue);\n }, [searchInputValue]);\n\n return (\n <Flex container as={StyledSearchInput}>\n <StyledSearchTextInput\n ref={innerRef}\n type='search'\n aria-label={searchInputAriaLabel}\n placeholder={placeholder}\n {...restProps}\n value={searchInputValue}\n onChange={onChange}\n onKeyDown={onKeyDown}\n />\n <Flex\n as={StyledSearchIcon}\n container={{ justify: 'center', alignItems: 'center' }}\n onClick={() => {\n innerRef.current?.focus();\n }}\n >\n <Icon name='search' />\n </Flex>\n </Flex>\n );\n }\n);\n\nexport default SearchInput;\n"]}
1	+ {"version":3,"file":"SearchInput.js","sourceRoot":"","sources":["../../../src/components/SearchInput/SearchInput.tsx"],"names":[],"mappings":"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","sourcesContent":["import {\n FunctionComponent,\n PropsWithoutRef,\n Ref,\n forwardRef,\n useState,\n ChangeEvent,\n useCallback,\n KeyboardEvent,\n useEffect\n} from 'react';\nimport styled, { css } from 'styled-components';\nimport { transparentize } from 'polished';\n\nimport { ForwardProps } from '../../types';\nimport { defaultThemeProp } from '../../theme';\nimport Input from '../Input';\nimport Icon, { registerIcon } from '../Icon';\nimport * as searchIcon from '../Icon/icons/search.icon';\nimport { FormControlProps } from '../FormControl';\nimport { useAfterInitialEffect, useConsolidatedRef, useI18n } from '../../hooks';\nimport Flex from '../Flex';\nimport { tryCatch } from '../../utils';\n\nregisterIcon(searchIcon);\n\nexport interface SearchInputProps {\n /*\n Placeholder text. The default value is a locale translation of 'Search…'\n * @default \"Search…\"\n /\n placeholder?: FormControlProps['placeholder'];\n /\n Creates a controlled input and sets the value. Requires an onChange handler to update value.\n * value + onChange is the recommended method per React team.\n /\n value?: FormControlProps['value'];\n /\n If you wish to use an [uncontrolled input](https://reactjs.org/docs/uncontrolled-components.html), pass a defaultValue prop and a ref to access the input's native value prop or by other DOM ref means.\n /\n defaultValue?: FormControlProps['defaultValue'];\n /* Called when the SearchInput value changes. /\n onSearchChange?: (value: string) => void;\n /\n Called when the SearchButton is clicked or when the Enter key is pressed while SearchInput is in focus.\n * NOTE: this does not trigger an actual form submit event. It simply represents an explicit action by the user to search as opposed to onSearchChange.\n /\n onSearchSubmit?: (value: string) => void;\n /* Aria label for search input, used by screen readers. /\n searchInputAriaLabel?: string;\n}\n\nexport const StyledSearchIcon = styled.div(props => {\n const {\n theme: {\n base,\n components: { 'search-input': searchInput, 'form-control': formControl }\n }\n } = props;\n const iconColor = tryCatch(() => transparentize(0.75, base.palette['foreground-color']));\n return css`\n position: absolute;\n z-index: 1;\n inset-inline-start: 0.0625rem;\n top: 0.0625rem;\n width: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n height: calc(${base['hit-area']['mouse-min']} - 0.125rem);\n border-radius: calc(${base['border-radius']} ${searchInput['border-radius']});\n padding: 0;\n background: ${formControl['background-color']};\n color: ${iconColor};\n cursor: text;\n line-height: 1;\n `;\n});\n\nStyledSearchIcon.defaultProps = defaultThemeProp;\n\nexport const StyledSearchTextInput = styled(Input)(props => {\n const { theme } = props;\n const comp = theme.components['search-input'];\n return css`\n position: relative;\n width: 100%;\n height: ${theme.base['hit-area']['mouse-min']};\n min-height: ${theme.base['hit-area']['mouse-min']};\n padding-inline-start: 0;\n padding-inline-end: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n text-indent: calc(${theme.base['hit-area']['mouse-min']} - 0.125rem);\n border-radius: calc(${comp['border-radius']} * ${theme.base['border-radius']});\n &::-ms-clear {\n display: none;\n }\n &::-webkit-search-cancel-button {\n display: none;\n }\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n &:focus:not([disabled]) {\n box-shadow: none;\n }\n `;\n});\n\nStyledSearchTextInput.defaultProps = defaultThemeProp;\n\nexport const StyledSearchInput = styled.div(({ theme: { base, components } }) => {\n const iconColor = tryCatch(() => transparentize(0.3, base.palette['foreground-color']));\n\n return css`\n position: relative;\n height: ${base['hit-area']['mouse-min']};\n border-radius: calc(${components['search-input']['border-radius']} * ${base['border-radius']});\n\n &:focus-within {\n box-shadow: ${base.shadow.focus};\n\n ${StyledSearchIcon} {\n color: ${iconColor};\n }\n }\n `;\n});\n\nStyledSearchInput.defaultProps = defaultThemeProp;\n\nconst SearchInput: FunctionComponent<SearchInputProps & ForwardProps> = forwardRef(\n (props: PropsWithoutRef<SearchInputProps>, ref: Ref<HTMLInputElement>) => {\n const t = useI18n();\n\n const {\n defaultValue,\n value,\n placeholder = t('search_placeholder_default'),\n onSearchChange,\n onSearchSubmit,\n searchInputAriaLabel,\n ...restProps\n } = props;\n\n const [searchInputValue, setValue] = useState<string>(value \|\| defaultValue \|\| '');\n\n const innerRef = useConsolidatedRef(ref);\n\n useEffect(() => {\n if (typeof value === 'string' && value !== searchInputValue) {\n setValue(value);\n }\n }, [value]);\n\n const onChange = useCallback(\n (e: ChangeEvent<HTMLInputElement>) => {\n setValue(e.target.value);\n },\n [searchInputValue]\n );\n\n const onSubmit = useCallback(() => {\n onSearchSubmit?.(searchInputValue);\n }, [searchInputValue]);\n\n const onKeyDown = useCallback(\n (e: KeyboardEvent<HTMLInputElement>) => {\n if (e.key === 'Enter') {\n onSubmit();\n }\n },\n [searchInputValue]\n );\n\n useAfterInitialEffect(() => {\n if (onSearchChange) onSearchChange(searchInputValue);\n }, [searchInputValue]);\n\n return (\n <Flex container as={StyledSearchInput}>\n <StyledSearchTextInput\n ref={innerRef}\n type='search'\n aria-label={searchInputAriaLabel}\n placeholder={placeholder}\n {...restProps}\n value={searchInputValue}\n onChange={onChange}\n onKeyDown={onKeyDown}\n />\n <Flex\n as={StyledSearchIcon}\n container={{ justify: 'center', alignItems: 'center' }}\n onClick={() => {\n innerRef.current?.focus();\n }}\n >\n <Icon name='search' />\n </Flex>\n </Flex>\n );\n }\n);\n\nexport default SearchInput;\n"]}

package/lib/components/Select/Select.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAEjB,GAAG,EACH,SAAS,EACT,kBAAkB,EAEnB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAqB,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGrE,MAAM,WAAW,WAAW;IAC1B,oFAAoF;IACpF,QAAQ,EAAE,SAAS,CAAC;IACpB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;IACjD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,kFAAkF;IAClF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,eAAO,MAAM,YAAY;YAA2B,OAAO;SA4CzD,CAAC;AAIH,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,~~CAqEzD~~,CAAC;AAEF,eAAe,MAAM,CAAC"}
1	+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/Select/Select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,iBAAiB,EAEjB,GAAG,EACH,SAAS,EACT,kBAAkB,EAEnB,MAAM,OAAO,CAAC;AAIf,OAAO,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAEnD,OAAO,EAAqB,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAGrE,MAAM,WAAW,WAAW;IAC1B,oFAAoF;IACpF,QAAQ,EAAE,SAAS,CAAC;IACpB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,kBAAkB,CAAC,iBAAiB,CAAC,CAAC;IACjD;;;OAGG;IACH,EAAE,CAAC,EAAE,gBAAgB,CAAC,IAAI,CAAC,CAAC;IAC5B,oDAAoD;IACpD,MAAM,CAAC,EAAE,gBAAgB,CAAC,QAAQ,CAAC,CAAC;IACpC,2DAA2D;IAC3D,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,uCAAuC;IACvC,WAAW,CAAC,EAAE,gBAAgB,CAAC,aAAa,CAAC,CAAC;IAC9C,6GAA6G;IAC7G,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,wEAAwE;IACxE,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC;;;OAGG;IACH,KAAK,CAAC,EAAE,gBAAgB,CAAC,OAAO,CAAC,CAAC;IAClC,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,qFAAqF;IACrF,QAAQ,CAAC,EAAE,gBAAgB,CAAC,UAAU,CAAC,CAAC;IACxC,+FAA+F;IAC/F,IAAI,CAAC,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAC;IAChC,kFAAkF;IAClF,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,GAAG,CAAC,iBAAiB,CAAC,CAAC;CAC9B;AAED,eAAO,MAAM,YAAY;YAA2B,OAAO;SA4CzD,CAAC;AAIH,QAAA,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,GAAG,YAAY,CAoEzD,CAAC;AAEF,eAAe,MAAM,CAAC"}

package/lib/components/Select/Select.js CHANGED Viewed

@@ -61,7 +61,6 @@ const Select = forwardRef((props, ref) => {
         label,
         labelHidden,
         id,
-        labelOrder: -1,
         info,
         status,
         required,