@foxford/ui 2.91.0-beta-84a4274-20260112 → 2.91.0-beta-c135980-20260113

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.
@@ -1,2 +1,2 @@
1
- 'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var responsiveLayout=require('../../mixins/responsive-layout.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=style.createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:styled.css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:styled.css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Container=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout.responsiveLayout);const Icon=styled__default.default.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled__default.default.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled__default.default.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;height:100%;",""],responsiveLayout.responsiveLayout);exports.Addon=Addon,exports.Container=Container,exports.Content=Content,exports.DiscardButton=DiscardButton,exports.Icon=Icon,exports.Root=Root;
1
+ 'use strict';var styled=require('styled-components');var style=require('../../shared/utils/style.js');var responsiveSize=require('../../mixins/responsive-size.js');var responsiveMargin=require('../../mixins/responsive-margin.js');var responsiveLayout=require('../../mixins/responsive-layout.js');function _interopDefault(o){return o&&o.__esModule?o:{default:o}}var styled__default=_interopDefault(styled);const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=style.createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:styled.css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:styled.css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:styled.css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:styled.css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:styled.css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled__default.default.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize.responsiveSize,responsiveMargin.responsiveMargin);const Container=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout.responsiveLayout);const Icon=styled__default.default.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled__default.default.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled__default.default.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled__default.default.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;align-items:flex-start;height:100%;",""],responsiveLayout.responsiveLayout);exports.Addon=Addon,exports.Container=Container,exports.Content=Content,exports.DiscardButton=DiscardButton,exports.Icon=Icon,exports.Root=Root;
2
2
  //# sourceMappingURL=style.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"qZASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,MAAAA,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,OAAGA,IAAA,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,OAAGA,IAAA,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,OAAGA,IAAA,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,gBAAAA,QAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eAAAA,eACAC,iBAAAA,kBAGG,MAAMC,UAAYT,gBAAAA,QAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,iBAAAA,wBAGSC,KAAOX,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,gBAAAA,QAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,kDAAA,IAKEU,iBAAgBA"}
1
+ {"version":3,"file":"style.js","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"qZASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,MAAAA,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,OAAGA,IAAA,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,OAAGA,IAAA,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,OAAGA,IAAA,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,OAAGA,IAAA,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,gBAAAA,QAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eAAAA,eACAC,iBAAAA,kBAGG,MAAMC,UAAYT,gBAAAA,QAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,iBAAAA,wBAGSC,KAAOX,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,gBAAAA,QAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,gBAAAA,QAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,yEAAA,IAMEU,iBAAgBA"}
@@ -1,2 +1,2 @@
1
- import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{responsiveLayout}from'../../mixins/responsive-layout.mjs';const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize,responsiveMargin);const Container=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout);const Icon=styled.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;height:100%;",""],responsiveLayout);export{Addon,Container,Content,DiscardButton,Icon,Root};
1
+ import styled,{css}from'styled-components';import{createShouldForwardProp}from'../../shared/utils/style.mjs';import{responsiveSize}from'../../mixins/responsive-size.mjs';import{responsiveMargin}from'../../mixins/responsive-margin.mjs';import{responsiveLayout}from'../../mixins/responsive-layout.mjs';const filterLayoutProps=o=>!['layout','layoutXXS','layoutXS','layoutS','layoutM','layoutL','layoutXL','layouts'].includes(o);const shouldForwardNotificationProp=createShouldForwardProp((o=>!['status'].includes(o)));const template=o=>`\n color: ${o.color};\n background-color: ${o.backgroundColor};\n`;const COLOR_SCHEMA={system:css(["",""],(o=>template({color:o.theme.colors['content-onmain-primary'],backgroundColor:o.theme.colors['bg-onmain-secondary'],...o.palette}))),info:css(["",""],(o=>template({color:o.theme.colors['alert-info'],backgroundColor:o.theme.colors['alert-bg-info-100'],...o.palette}))),success:css(["",""],(o=>template({color:o.theme.colors['alert-success'],backgroundColor:o.theme.colors['alert-bg-success-100'],...o.palette}))),error:css(["",""],(o=>template({color:o.theme.colors['alert-error'],backgroundColor:o.theme.colors['alert-bg-error-100'],...o.palette}))),warning:css(["",""],(o=>template({color:o.theme.colors['alert-warning'],backgroundColor:o.theme.colors['alert-bg-warning-100'],...o.palette})))};const Root=styled.div.withConfig({shouldForwardProp:shouldForwardNotificationProp}).withConfig({displayName:"Notification__Root",componentId:"ui__sc-19hb9p3-0"})(["box-sizing:border-box;display:flex;min-width:min-content;& > *:not(:last-child){margin-right:var(--gap);}"," "," ",""],(o=>COLOR_SCHEMA[o.status]),responsiveSize,responsiveMargin);const Container=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Container",componentId:"ui__sc-19hb9p3-1"})(["box-sizing:border-box;display:flex;align-items:flex-start;flex-grow:1;& > *:not(:last-child){margin-right:var(--gap-container);}",""],responsiveLayout);const Icon=styled.div.withConfig({displayName:"Notification__Icon",componentId:"ui__sc-19hb9p3-2"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const DiscardButton=styled.div.withConfig({displayName:"Notification__DiscardButton",componentId:"ui__sc-19hb9p3-3"})(["box-sizing:border-box;display:flex;flex-shrink:0;height:fit-content;"]);const Content=styled.div.withConfig({displayName:"Notification__Content",componentId:"ui__sc-19hb9p3-4"})(["box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;flex-basis:58%;flex-grow:1;width:100%;height:fit-content;"]);const Addon=styled.div.withConfig({shouldForwardProp:filterLayoutProps}).withConfig({displayName:"Notification__Addon",componentId:"ui__sc-19hb9p3-5"})(["box-sizing:border-box;display:flex;align-items:flex-start;height:100%;",""],responsiveLayout);export{Addon,Container,Content,DiscardButton,Icon,Root};
2
2
  //# sourceMappingURL=style.mjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"style.mjs","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"4SASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,IAAG,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,IAAG,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,IAAG,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,OAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eACAC,kBAGG,MAAMC,UAAYT,OAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,wBAGSC,KAAOX,OAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,OAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,OAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,OAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,kDAAA,IAKEU"}
1
+ {"version":3,"file":"style.mjs","sources":["../../../../src/components/Notification/style.ts"],"sourcesContent":["import styled, { css } from 'styled-components'\nimport type { FlattenInterpolation, ThemedStyledProps, DefaultTheme } from 'styled-components'\nimport { createShouldForwardProp } from 'shared/utils/style'\nimport { responsiveSize } from 'mixins/responsive-size'\nimport { responsiveMargin } from 'mixins/responsive-margin'\nimport type { ResponsiveLayoutInterpolationProps } from 'shared/interfaces'\nimport { responsiveLayout } from 'mixins/responsive-layout'\nimport type { StyledNotificationProps, NotificationPalette, NotificationStatus, Layout } from './types'\n\nconst filterLayoutProps = (propKey: string) =>\n !['layout', 'layoutXXS', 'layoutXS', 'layoutS', 'layoutM', 'layoutL', 'layoutXL', 'layouts'].includes(propKey)\n\nconst shouldForwardNotificationProp = createShouldForwardProp((propKey) => !['status'].includes(propKey))\n\nconst template = (palette: NotificationPalette) => `\n color: ${palette.color};\n background-color: ${palette.backgroundColor};\n`\n\nconst COLOR_SCHEMA: Record<\n NotificationStatus,\n FlattenInterpolation<ThemedStyledProps<StyledNotificationProps, DefaultTheme>>\n> = {\n system: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['content-onmain-primary'],\n backgroundColor: props.theme.colors['bg-onmain-secondary'],\n ...props.palette,\n })}\n `,\n info: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-info'],\n backgroundColor: props.theme.colors['alert-bg-info-100'],\n ...props.palette,\n })}\n `,\n success: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-success'],\n backgroundColor: props.theme.colors['alert-bg-success-100'],\n ...props.palette,\n })}\n `,\n error: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-error'],\n backgroundColor: props.theme.colors['alert-bg-error-100'],\n ...props.palette,\n })}\n `,\n warning: css<StyledNotificationProps>`\n ${(props) =>\n template({\n color: props.theme.colors['alert-warning'],\n backgroundColor: props.theme.colors['alert-bg-warning-100'],\n ...props.palette,\n })}\n `,\n}\n\nexport const Root = styled.div.withConfig<StyledNotificationProps>({\n shouldForwardProp: shouldForwardNotificationProp,\n})`\n box-sizing: border-box;\n display: flex;\n min-width: min-content;\n\n & > *:not(:last-child) {\n margin-right: var(--gap);\n }\n\n ${(props) => COLOR_SCHEMA[props.status]}\n\n ${responsiveSize}\n ${responsiveMargin}\n`\n\nexport const Container = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n flex-grow: 1;\n\n & > *:not(:last-child) {\n margin-right: var(--gap-container);\n }\n\n ${responsiveLayout}\n`\n\nexport const Icon = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const DiscardButton = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-shrink: 0;\n height: fit-content;\n`\n\nexport const Content = styled.div`\n box-sizing: border-box;\n display: flex;\n flex-direction: column;\n justify-content: center;\n flex-basis: 58%;\n flex-grow: 1;\n width: 100%;\n height: fit-content;\n`\n\nexport const Addon = styled.div.withConfig<ResponsiveLayoutInterpolationProps<Layout>>({\n shouldForwardProp: filterLayoutProps,\n})`\n box-sizing: border-box;\n display: flex;\n align-items: flex-start;\n height: 100%;\n\n ${responsiveLayout}\n`\n"],"names":["filterLayoutProps","propKey","includes","shouldForwardNotificationProp","createShouldForwardProp","template","palette","color","backgroundColor","COLOR_SCHEMA","system","css","props","theme","colors","info","success","error","warning","Root","styled","div","withConfig","shouldForwardProp","displayName","componentId","status","responsiveSize","responsiveMargin","Container","responsiveLayout","Icon","DiscardButton","Content","Addon"],"mappings":"4SASA,MAAMA,kBAAqBC,IACxB,CAAC,SAAU,YAAa,WAAY,UAAW,UAAW,UAAW,WAAY,WAAWC,SAASD,GAExG,MAAME,8BAAgCC,yBAAyBH,IAAa,CAAC,UAAUC,SAASD,KAEhG,MAAMI,SAAYC,GAAiC,cACxCA,EAAQC,+BACGD,EAAQE,qBAG9B,MAAMC,aAGF,CACFC,OAAQC,IAAG,CAAA,GAAA,KACNC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,0BAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,0BACjCF,EAAMN,YAGfS,KAAMJ,IAAG,CAAA,GAAA,KACJC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,cAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,wBACjCF,EAAMN,YAGfU,QAASL,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,YAGfW,MAAON,IAAG,CAAA,GAAA,KACLC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,eAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,yBACjCF,EAAMN,YAGfY,QAASP,IAAG,CAAA,GAAA,KACPC,GACDP,SAAS,CACPE,MAAOK,EAAMC,MAAMC,OAAO,iBAC1BN,gBAAiBI,EAAMC,MAAMC,OAAO,2BACjCF,EAAMN,aAKV,MAAMa,KAAOC,OAAOC,IAAIC,WAAoC,CACjEC,kBAAmBpB,gCACnBmB,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAFkBL,CAElB,CAAA,4GAAA,IAAA,IAAA,KASGR,GAAUH,aAAaG,EAAMc,SAE9BC,eACAC,kBAGG,MAAMC,UAAYT,OAAOC,IAAIC,WAAuD,CACzFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,0BAAAC,YAAA,oBAFuBL,CAEvB,CAAA,mIAAA,IAUEU,wBAGSC,KAAOX,OAAOC,IAAGC,WAAA,CAAAE,YAAA,qBAAAC,YAAA,oBAAVL,CAKnB,CAAA,+EAEYY,cAAgBZ,OAAOC,IAAGC,WAAA,CAAAE,YAAA,8BAAAC,YAAA,oBAAVL,CAK5B,CAAA,+EAEYa,QAAUb,OAAOC,IAAGC,WAAA,CAAAE,YAAA,wBAAAC,YAAA,oBAAVL,CAStB,CAAA,8IAEM,MAAMc,MAAQd,OAAOC,IAAIC,WAAuD,CACrFC,kBAAmBvB,oBACnBsB,WAAA,CAAAE,YAAA,sBAAAC,YAAA,oBAFmBL,CAEnB,CAAA,yEAAA,IAMEU"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@foxford/ui",
3
- "version": "2.91.0-beta-84a4274-20260112",
3
+ "version": "2.91.0-beta-c135980-20260113",
4
4
  "description": "UI components and utilities",
5
5
  "bugs": {
6
6
  "url": "https://github.com/foxford/ui/issues"
@@ -63,6 +63,6 @@
63
63
  "shared",
64
64
  "theme"
65
65
  ],
66
- "sha": "84a4274",
66
+ "sha": "c135980",
67
67
  "scripts": {}
68
68
  }