@plumile/backoffice-react 0.1.130 → 0.1.132
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.
- package/lib/esm/auth/login/loginPage.css.js +1 -0
- package/lib/esm/auth/login/loginPage.css.js.map +1 -1
- package/lib/esm/components/backoffice/detail/BackofficeKpiStrip.js +23 -23
- package/lib/esm/components/backoffice/detail/BackofficeKpiStrip.js.map +1 -1
- package/lib/esm/components/backoffice/detail/backofficeDetailRelationLink.css.js +1 -0
- package/lib/esm/components/backoffice/detail/backofficeKpiStrip.css.js +14 -2
- package/lib/esm/components/backoffice/detail/backofficeKpiStrip.css.js.map +1 -1
- package/lib/esm/components/backoffice/filters/DeferredFilterSearchInput.js +64 -50
- package/lib/esm/components/backoffice/filters/DeferredFilterSearchInput.js.map +1 -1
- package/lib/esm/components/backoffice/filters/EntityIdFilterField.js +45 -50
- package/lib/esm/components/backoffice/filters/EntityIdFilterField.js.map +1 -1
- package/lib/esm/components/backoffice/filters/backofficeFilterAction.css.js +0 -1
- package/lib/esm/components/backoffice/filters/deferredFilterSearchInput.css.js +2 -2
- package/lib/esm/components/backoffice/filters/deferredFilterSearchInput.css.js.map +1 -1
- package/lib/esm/components/backoffice/filters/entityIdFilterField.css.js +1 -1
- package/lib/esm/components/backoffice/filters/entityIdFilterField.css.js.map +1 -1
- package/lib/esm/components/backoffice/hub/backofficeHubTemplate.css.js.map +1 -1
- package/lib/esm/components/backoffice/pickers/entityIdPickerDialog.css.js.map +1 -1
- package/lib/esm/components/backoffice/refs/backofficeRelatedCountLink.css.js.map +1 -1
- package/lib/esm/components/backoffice/routing/backofficeRoutePendingBar.css.js.map +1 -1
- package/lib/esm/components/backoffice/scaffolds/BackofficeEntityListScaffold.js +1 -1
- package/lib/esm/components/backoffice/scaffolds/BackofficeEntityListScaffold.js.map +1 -1
- package/lib/esm/components/backoffice/tools/backofficeToolsDocPanel.css.js.map +1 -1
- package/lib/esm/i18n/locales/en/backofficeReact.js +3 -3
- package/lib/esm/i18n/locales/en/backofficeReact.js.map +1 -1
- package/lib/esm/i18n/locales/fr/backofficeReact.js +3 -3
- package/lib/esm/i18n/locales/fr/backofficeReact.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityListPage.js +46 -53
- package/lib/esm/pages/BackofficeEntityListPage.js.map +1 -1
- package/lib/esm/pages/backofficeEntityListPage.css.js +1 -1
- package/lib/esm/pages/backofficeEntityListPage.css.js.map +1 -1
- package/lib/esm/pages/dashboard/dashboardPanel.css.js.map +1 -1
- package/lib/esm/provider/BackofficeProvider.js +1 -1
- package/lib/esm/provider/BackofficeProvider.js.map +1 -1
- package/lib/esm/style.css +1 -1
- package/lib/types/components/backoffice/detail/BackofficeKpiStrip.d.ts.map +1 -1
- package/lib/types/components/backoffice/detail/backofficeKpiStrip.css.d.ts +24 -0
- package/lib/types/components/backoffice/detail/backofficeKpiStrip.css.d.ts.map +1 -1
- package/lib/types/components/backoffice/filters/DeferredFilterSearchInput.d.ts +1 -1
- package/lib/types/components/backoffice/filters/DeferredFilterSearchInput.d.ts.map +1 -1
- package/lib/types/components/backoffice/filters/EntityIdFilterField.d.ts.map +1 -1
- package/lib/types/components/backoffice/filters/deferredFilterSearchInput.css.d.ts +2 -0
- package/lib/types/components/backoffice/filters/deferredFilterSearchInput.css.d.ts.map +1 -1
- package/lib/types/components/backoffice/filters/entityIdFilterField.css.d.ts.map +1 -1
- package/lib/types/i18n/resources.d.ts +6 -6
- package/lib/types/pages/BackofficeEntityListPage.d.ts.map +1 -1
- package/lib/types/pages/backofficeEntityListPage.css.d.ts.map +1 -1
- package/package.json +11 -11
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* empty css */
|
|
1
2
|
/* empty css */
|
|
2
3
|
//#region src/auth/login/loginPage.css.ts
|
|
3
4
|
var e = "txvbqbdr8 txvbqbf6i txvbqbffw", t = "txvbqbdr8 txvbqbf6i txvbqb17w0", n = "txvbqb19dn txvbqb9j txvbqbm9g txvbqblzp", r = "txvbqbey txvbqb19dn txvbqbdr8 txvbqbff6 txvbqbq1l txvbqbn84", i = "txvbqb197r txvbqbi1s txvbqbdxd txvbqb2is txvbqb19e7", a = "txvbqbey txvbqbdr8 txvbqbf91 txvbqbffj txvbqbjus txvbqbq0v", o = "w8yhmy0 txvbqb1933 txvbqb1g5 txvbqb2e3 txvbqb19d9 txvbqbv txvbqbfd0 txvbqbux3 txvbqb3f txvbqb7h txvbqb76 txvbqb7t txvbqb1bwh txvbqb1czl", s = "txvbqbypl txvbqbzn6 txvbqb10kr txvbqbvwu txvbqbabd txvbqba5l txvbqbalh txvbqbahi", c = "txvbqbdr8 txvbqbf6i txvbqbffw", l = "txvbqb17w0", u = "txvbqbm9g txvbqbam txvbqbfdd txvbqb19d9 txvbqbkvm", d = "txvbqbq18", f = "w8yhmy1 txvbqb1cw txvbqb1w1 txvbqb2et txvbqb19d9 txvbqb1983 txvbqb7h txvbqb75 txvbqb7t";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"loginPage.css.js","names":[],"sources":["../../../../src/auth/login/loginPage.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles, stateSprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const stack = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 4,\n});\n\nexport const formSurface = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n width: 'full',\n});\n\nexport const helper = sprinkles({\n color: 'brandDarkGray',\n fontSize: 'sm',\n margin: 0,\n lineHeight: 1.6,\n});\n\nexport const divider = sprinkles({\n alignItems: 'center',\n color: 'brandDarkGray',\n display: 'flex',\n gap: 2,\n marginTop: 5,\n marginBottom: 3,\n});\n\nexport const dividerLine = sprinkles({\n backgroundColor: 'brandPrimaryRed',\n height: 'px',\n flex: 1,\n borderRadius: 'full',\n opacity: 35,\n});\n\nexport const actionsRow = sprinkles({\n alignItems: 'center',\n display: 'flex',\n flexWrap: 'wrap',\n gap: 3,\n justifyContent: 'space-between',\n marginTop: 3,\n});\n\nexport const inlineLink = style([\n sprinkles({\n backgroundColor: 'transparent',\n borderWidth: 0,\n borderStyle: 'none',\n color: 'brandPrimaryRed',\n cursor: 'pointer',\n fontWeight: 'semibold',\n padding: 0,\n textDecoration: 'none',\n transitionProperty: 'colors',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n stateSprinkles({\n color: { hover: 'brandSecondaryOrange' },\n textDecoration: { hover: 'underline' },\n }),\n]);\n\nexport const panel = sprinkles({\n borderTopLeftRadius: 'none',\n borderTopRightRadius: 'none',\n borderBottomLeftRadius: '2xl',\n borderBottomRightRadius: '2xl',\n paddingX: 6,\n paddingY: 6,\n});\n\nexport const block = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 4,\n});\n\nexport const fullWidth = sprinkles({\n width: 'full',\n});\n\nexport const panelTitle = sprinkles({\n margin: 0,\n fontSize: 'xl',\n fontWeight: 'bold',\n color: 'brandPrimaryRed',\n letterSpacing: 'tight',\n});\n\nexport const footer = sprinkles({\n marginTop: 4,\n});\n\nexport const brandGhostButton = style([\n sprinkles({\n borderColor: 'brandPrimaryRed',\n borderWidth: 'px',\n borderStyle: 'solid',\n color: 'brandPrimaryRed',\n backgroundColor: 'brandLightGray',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n selectors: {\n '&:hover:not(:disabled)': {\n backgroundColor: `color-mix(in srgb, ${vars.colors.brandPrimaryRed} 8%, transparent)`,\n color: vars.colors.brandSecondaryOrange,\n borderColor: vars.colors.brandSecondaryOrange,\n },\n },\n },\n]);\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"loginPage.css.js","names":[],"sources":["../../../../src/auth/login/loginPage.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles, stateSprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const stack = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 4,\n});\n\nexport const formSurface = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n width: 'full',\n});\n\nexport const helper = sprinkles({\n color: 'brandDarkGray',\n fontSize: 'sm',\n margin: 0,\n lineHeight: 1.6,\n});\n\nexport const divider = sprinkles({\n alignItems: 'center',\n color: 'brandDarkGray',\n display: 'flex',\n gap: 2,\n marginTop: 5,\n marginBottom: 3,\n});\n\nexport const dividerLine = sprinkles({\n backgroundColor: 'brandPrimaryRed',\n height: 'px',\n flex: 1,\n borderRadius: 'full',\n opacity: 35,\n});\n\nexport const actionsRow = sprinkles({\n alignItems: 'center',\n display: 'flex',\n flexWrap: 'wrap',\n gap: 3,\n justifyContent: 'space-between',\n marginTop: 3,\n});\n\nexport const inlineLink = style([\n sprinkles({\n backgroundColor: 'transparent',\n borderWidth: 0,\n borderStyle: 'none',\n color: 'brandPrimaryRed',\n cursor: 'pointer',\n fontWeight: 'semibold',\n padding: 0,\n textDecoration: 'none',\n transitionProperty: 'colors',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n stateSprinkles({\n color: { hover: 'brandSecondaryOrange' },\n textDecoration: { hover: 'underline' },\n }),\n]);\n\nexport const panel = sprinkles({\n borderTopLeftRadius: 'none',\n borderTopRightRadius: 'none',\n borderBottomLeftRadius: '2xl',\n borderBottomRightRadius: '2xl',\n paddingX: 6,\n paddingY: 6,\n});\n\nexport const block = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 4,\n});\n\nexport const fullWidth = sprinkles({\n width: 'full',\n});\n\nexport const panelTitle = sprinkles({\n margin: 0,\n fontSize: 'xl',\n fontWeight: 'bold',\n color: 'brandPrimaryRed',\n letterSpacing: 'tight',\n});\n\nexport const footer = sprinkles({\n marginTop: 4,\n});\n\nexport const brandGhostButton = style([\n sprinkles({\n borderColor: 'brandPrimaryRed',\n borderWidth: 'px',\n borderStyle: 'solid',\n color: 'brandPrimaryRed',\n backgroundColor: 'brandLightGray',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n selectors: {\n '&:hover:not(:disabled)': {\n backgroundColor: `color-mix(in srgb, ${vars.colors.brandPrimaryRed} 8%, transparent)`,\n color: vars.colors.brandSecondaryOrange,\n borderColor: vars.colors.brandSecondaryOrange,\n },\n },\n },\n]);\n"],"mappings":""}
|
|
@@ -1,31 +1,31 @@
|
|
|
1
1
|
import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
|
|
2
|
-
import { card as t,
|
|
3
|
-
import { cx as
|
|
4
|
-
import { jsx as
|
|
5
|
-
import { CopyableText as
|
|
6
|
-
import { MetricCard as
|
|
7
|
-
import { MetricTileGroup as
|
|
2
|
+
import { card as t, cardTone as n, compactGroup as r, group as i, value as a } from "./backofficeKpiStrip.css.js";
|
|
3
|
+
import { cx as o } from "@plumile/ui/theme/tools.js";
|
|
4
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
5
|
+
import { CopyableText as c } from "@plumile/ui/backoffice/atoms/copyable_text/CopyableText.js";
|
|
6
|
+
import { MetricCard as l } from "@plumile/ui/components/dashboard/metric_card/MetricCard.js";
|
|
7
|
+
import { MetricTileGroup as u } from "@plumile/ui/components/dashboard/metric_tile_group/MetricTileGroup.js";
|
|
8
8
|
//#region src/components/backoffice/detail/BackofficeKpiStrip.tsx
|
|
9
|
-
var
|
|
10
|
-
let { t:
|
|
11
|
-
if (
|
|
12
|
-
let
|
|
13
|
-
return
|
|
14
|
-
className:
|
|
15
|
-
children:
|
|
16
|
-
let
|
|
17
|
-
return e.copyValue != null && e.copyValue !== "" && (
|
|
9
|
+
var d = ({ items: d, density: f = "comfortable" }) => {
|
|
10
|
+
let { t: p } = e();
|
|
11
|
+
if (d.length === 0) return null;
|
|
12
|
+
let m = i;
|
|
13
|
+
return f === "compact" && (m = o(i, r)), /* @__PURE__ */ s(u, {
|
|
14
|
+
className: m,
|
|
15
|
+
children: d.map((e) => {
|
|
16
|
+
let r = e.value;
|
|
17
|
+
return e.copyValue != null && e.copyValue !== "" && (r = /* @__PURE__ */ s(c, {
|
|
18
18
|
value: e.copyValue,
|
|
19
19
|
copyValue: e.copyValue,
|
|
20
20
|
truncate: !1,
|
|
21
|
-
copyLabel:
|
|
22
|
-
copiedLabel:
|
|
23
|
-
})), /* @__PURE__ */
|
|
24
|
-
className: t,
|
|
21
|
+
copyLabel: p("common.actions.copy"),
|
|
22
|
+
copiedLabel: p("common.actions.copied")
|
|
23
|
+
})), /* @__PURE__ */ s(l, {
|
|
24
|
+
className: o(t, n({ tone: e.tone ?? "neutral" })),
|
|
25
25
|
label: e.label,
|
|
26
|
-
value: /* @__PURE__ */
|
|
27
|
-
className:
|
|
28
|
-
children:
|
|
26
|
+
value: /* @__PURE__ */ s("span", {
|
|
27
|
+
className: a,
|
|
28
|
+
children: r
|
|
29
29
|
}),
|
|
30
30
|
hint: e.hint
|
|
31
31
|
}, e.id);
|
|
@@ -33,6 +33,6 @@ var u = ({ items: u, density: d = "comfortable" }) => {
|
|
|
33
33
|
});
|
|
34
34
|
};
|
|
35
35
|
//#endregion
|
|
36
|
-
export {
|
|
36
|
+
export { d as BackofficeKpiStrip, d as default };
|
|
37
37
|
|
|
38
38
|
//# sourceMappingURL=BackofficeKpiStrip.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BackofficeKpiStrip.js","names":[],"sources":["../../../../../src/components/backoffice/detail/BackofficeKpiStrip.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\nimport { CopyableText } from '@plumile/ui/backoffice/atoms/copyable_text/CopyableText.js';\nimport { MetricCard } from '@plumile/ui/components/dashboard/metric_card/MetricCard.js';\nimport { MetricTileGroup } from '@plumile/ui/components/dashboard/metric_tile_group/MetricTileGroup.js';\nimport { cx } from '@plumile/ui/theme/tools.js';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\nimport * as styles from './backofficeKpiStrip.css.js';\n\nexport type BackofficeKpiTone =\n | 'neutral'\n | 'info'\n | 'success'\n | 'warning'\n | 'danger';\n\nexport type BackofficeKpiItem = {\n readonly id: string;\n readonly label: string;\n readonly value: ReactNode;\n readonly hint?: ReactNode;\n readonly tone?: BackofficeKpiTone;\n readonly copyValue?: string;\n};\n\nexport type BackofficeKpiStripProps = {\n readonly items: readonly BackofficeKpiItem[];\n readonly density?: 'compact' | 'comfortable';\n};\n\nexport const BackofficeKpiStrip = ({\n items,\n density = 'comfortable',\n}: BackofficeKpiStripProps): JSX.Element | null => {\n const { t } = useBackofficeReactTranslation();\n\n if (items.length === 0) {\n return null;\n }\n\n let groupClassName: string | undefined = styles.group;\n if (density === 'compact') {\n groupClassName = cx(styles.group, styles.compactGroup);\n }\n\n return (\n <MetricTileGroup className={groupClassName}>\n {items.map((item) => {\n let valueNode = item.value;\n if (item.copyValue != null && item.copyValue !== '') {\n valueNode = (\n <CopyableText\n value={item.copyValue}\n copyValue={item.copyValue}\n truncate={false}\n copyLabel={t('common.actions.copy')}\n copiedLabel={t('common.actions.copied')}\n />\n );\n }\n\n return (\n <MetricCard\n key={item.id}\n className={styles.card}\n label={item.label}\n value={<span className={styles.value}>{valueNode}</span>}\n hint={item.hint}\n />\n );\n })}\n </MetricTileGroup>\n );\n};\n\nexport default BackofficeKpiStrip;\n"],"mappings":";;;;;;;;AA8BA,IAAa,KAAsB,EACjC,UACA,aAAU,oBACuC;CACjD,IAAM,EAAE,SAAM,GAA+B;CAE7C,IAAI,EAAM,WAAW,GACnB,OAAO;CAGT,IAAI,IAAqC;CAKzC,OAJI,MAAY,cACd,IAAiB,EAAG,GAAc,EAAoB,GAItD,kBAAC,GAAD;EAAiB,WAAW;YACzB,EAAM,KAAK,MAAS;GACnB,IAAI,IAAY,EAAK;GAarB,OAZI,EAAK,aAAa,QAAQ,EAAK,cAAc,OAC/C,IACE,kBAAC,GAAD;IACE,OAAO,EAAK;IACZ,WAAW,EAAK;IAChB,UAAU;IACV,WAAW,EAAE,sBAAsB;IACnC,aAAa,EAAE,wBAAwB;IACvC,CAAA,GAKJ,kBAAC,GAAD;IAEE,WAAW;
|
|
1
|
+
{"version":3,"file":"BackofficeKpiStrip.js","names":[],"sources":["../../../../../src/components/backoffice/detail/BackofficeKpiStrip.tsx"],"sourcesContent":["import { type JSX, type ReactNode } from 'react';\nimport { CopyableText } from '@plumile/ui/backoffice/atoms/copyable_text/CopyableText.js';\nimport { MetricCard } from '@plumile/ui/components/dashboard/metric_card/MetricCard.js';\nimport { MetricTileGroup } from '@plumile/ui/components/dashboard/metric_tile_group/MetricTileGroup.js';\nimport { cx } from '@plumile/ui/theme/tools.js';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\nimport * as styles from './backofficeKpiStrip.css.js';\n\nexport type BackofficeKpiTone =\n | 'neutral'\n | 'info'\n | 'success'\n | 'warning'\n | 'danger';\n\nexport type BackofficeKpiItem = {\n readonly id: string;\n readonly label: string;\n readonly value: ReactNode;\n readonly hint?: ReactNode;\n readonly tone?: BackofficeKpiTone;\n readonly copyValue?: string;\n};\n\nexport type BackofficeKpiStripProps = {\n readonly items: readonly BackofficeKpiItem[];\n readonly density?: 'compact' | 'comfortable';\n};\n\nexport const BackofficeKpiStrip = ({\n items,\n density = 'comfortable',\n}: BackofficeKpiStripProps): JSX.Element | null => {\n const { t } = useBackofficeReactTranslation();\n\n if (items.length === 0) {\n return null;\n }\n\n let groupClassName: string | undefined = styles.group;\n if (density === 'compact') {\n groupClassName = cx(styles.group, styles.compactGroup);\n }\n\n return (\n <MetricTileGroup className={groupClassName}>\n {items.map((item) => {\n let valueNode = item.value;\n if (item.copyValue != null && item.copyValue !== '') {\n valueNode = (\n <CopyableText\n value={item.copyValue}\n copyValue={item.copyValue}\n truncate={false}\n copyLabel={t('common.actions.copy')}\n copiedLabel={t('common.actions.copied')}\n />\n );\n }\n\n return (\n <MetricCard\n key={item.id}\n className={cx(\n styles.card,\n styles.cardTone({ tone: item.tone ?? 'neutral' }),\n )}\n label={item.label}\n value={<span className={styles.value}>{valueNode}</span>}\n hint={item.hint}\n />\n );\n })}\n </MetricTileGroup>\n );\n};\n\nexport default BackofficeKpiStrip;\n"],"mappings":";;;;;;;;AA8BA,IAAa,KAAsB,EACjC,UACA,aAAU,oBACuC;CACjD,IAAM,EAAE,SAAM,GAA+B;CAE7C,IAAI,EAAM,WAAW,GACnB,OAAO;CAGT,IAAI,IAAqC;CAKzC,OAJI,MAAY,cACd,IAAiB,EAAG,GAAc,EAAoB,GAItD,kBAAC,GAAD;EAAiB,WAAW;YACzB,EAAM,KAAK,MAAS;GACnB,IAAI,IAAY,EAAK;GAarB,OAZI,EAAK,aAAa,QAAQ,EAAK,cAAc,OAC/C,IACE,kBAAC,GAAD;IACE,OAAO,EAAK;IACZ,WAAW,EAAK;IAChB,UAAU;IACV,WAAW,EAAE,sBAAsB;IACnC,aAAa,EAAE,wBAAwB;IACvC,CAAA,GAKJ,kBAAC,GAAD;IAEE,WAAW,EACT,GACA,EAAgB,EAAE,MAAM,EAAK,QAAQ,WAAW,CAAC,CAClD;IACD,OAAO,EAAK;IACZ,OAAO,kBAAC,QAAD;KAAM,WAAW;eAAe;KAAiB,CAAA;IACxD,MAAM,EAAK;IACX,EARK,EAAK,GAQV;IAEJ;EACc,CAAA"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* empty css */
|
|
1
2
|
/* empty css */
|
|
2
3
|
//#region src/components/backoffice/detail/backofficeDetailRelationLink.css.ts
|
|
3
4
|
var e = "_93gupm0 qbwcueg qbwcuee txvbqb2g9 txvbqb19c9 txvbqb3f txvbqb7g txvbqb76 txvbqb7t qbwcuef txvbqb1aep txvbqb1b29 qbwcue0 txvbqb1cb0 txvbqb1cws txvbqbyoi txvbqbzm3 txvbqb10jb txvbqbvve txvbqb7h txvbqb75 txvbqbdr8 txvbqbjus txvbqbffj txvbqb1uy txvbqb2et txvbqbik txvbqb1933 txvbqbey txvbqbem txvbqbf65 txvbqbf6j txvbqb1aes txvbqb1b2c", t = "txvbqb9j txvbqbfcn txvbqbt9i txvbqbutu", n = "txvbqbdsb txvbqbey txvbqbfet txvbqbf7y txvbqbt9i", r = "txvbqb96 txvbqb19cb txvbqbutu txvbqb16fn", i = "txvbqbdsb txvbqbey txvbqbjtp txvbqb19cd txvbqb9j txvbqbl11";
|
|
@@ -1,7 +1,19 @@
|
|
|
1
|
+
import { createRuntimeFn as e } from "../../../node_modules/@vanilla-extract/recipes/dist/createRuntimeFn-62c9670f.esm.js";
|
|
1
2
|
/* empty css */
|
|
2
3
|
//#region src/components/backoffice/detail/backofficeKpiStrip.css.ts
|
|
3
|
-
var
|
|
4
|
+
var t = "txvbqbdrl txvbqbffj txvbqbheb", n = "txvbqbff6", r = "txvbqbt9i", i = e({
|
|
5
|
+
defaultClassName: "_1bcdpm60",
|
|
6
|
+
variantClassNames: { tone: {
|
|
7
|
+
neutral: "_1bcdpm61",
|
|
8
|
+
info: "_1bcdpm62",
|
|
9
|
+
success: "_1bcdpm63",
|
|
10
|
+
warning: "_1bcdpm64",
|
|
11
|
+
danger: "_1bcdpm65"
|
|
12
|
+
} },
|
|
13
|
+
defaultVariants: {},
|
|
14
|
+
compoundVariants: []
|
|
15
|
+
}), a = "txvbqbdr8 txvbqbey txvbqbff6";
|
|
4
16
|
//#endregion
|
|
5
|
-
export {
|
|
17
|
+
export { r as card, i as cardTone, n as compactGroup, t as group, a as value };
|
|
6
18
|
|
|
7
19
|
//# sourceMappingURL=backofficeKpiStrip.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"backofficeKpiStrip.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeKpiStrip.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const group = sprinkles({\n display: 'grid',\n gap: 3,\n gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const compactGroup = sprinkles({\n gap: 2,\n});\n\nexport const card = sprinkles({\n minWidth: 0,\n});\n\nexport const value = sprinkles({\n display: 'flex',\n alignItems: 'center',\n gap: 2,\n});\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"backofficeKpiStrip.css.js","names":[],"sources":["../../../../../src/components/backoffice/detail/backofficeKpiStrip.css.ts"],"sourcesContent":["import { recipe } from '@vanilla-extract/recipes';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const group = sprinkles({\n display: 'grid',\n gap: 3,\n gridTemplateColumns: 'autoFitMinmax180',\n});\n\nexport const compactGroup = sprinkles({\n gap: 2,\n});\n\nexport const card = sprinkles({\n minWidth: 0,\n});\n\nexport const cardTone = recipe({\n variants: {\n tone: {\n neutral: {\n backgroundImage: `linear-gradient(135deg, color-mix(in srgb, ${vars.colors.primaryLight} 26%, transparent), transparent 58%)`,\n boxShadow: `inset 3px 0 0 color-mix(in srgb, ${vars.colors.primary} 42%, transparent)`,\n },\n info: {\n backgroundImage: `linear-gradient(135deg, ${vars.colors.infoLight}, transparent 58%)`,\n boxShadow: `inset 3px 0 0 ${vars.colors.info}`,\n },\n success: {\n backgroundImage: `linear-gradient(135deg, ${vars.colors.successLight}, transparent 58%)`,\n boxShadow: `inset 3px 0 0 ${vars.colors.success}`,\n },\n warning: {\n backgroundImage: `linear-gradient(135deg, ${vars.colors.warningLight}, transparent 58%)`,\n boxShadow: `inset 3px 0 0 ${vars.colors.warning}`,\n },\n danger: {\n backgroundImage: `linear-gradient(135deg, ${vars.colors['error-8']}, transparent 58%)`,\n boxShadow: `inset 3px 0 0 ${vars.colors.error}`,\n },\n },\n },\n});\n\nexport const value = sprinkles({\n display: 'flex',\n alignItems: 'center',\n gap: 2,\n});\n"],"mappings":""}
|
|
@@ -1,69 +1,83 @@
|
|
|
1
1
|
import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
|
|
2
|
-
import {
|
|
3
|
-
import { useEffect as
|
|
4
|
-
import { jsx as
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
2
|
+
import { actionButton as t, actionButtonSpacer as n, actions as r, container as i } from "./deferredFilterSearchInput.css.js";
|
|
3
|
+
import { useEffect as a, useState as o } from "react";
|
|
4
|
+
import { jsx as s, jsxs as c } from "react/jsx-runtime";
|
|
5
|
+
import { Input as l } from "@plumile/ui/atomic/atoms/input/Input.js";
|
|
6
|
+
import { ModalCloseSvg as u } from "@plumile/ui/icons/ModalCloseSvg.js";
|
|
7
|
+
import { CheckSvg as d } from "@plumile/ui/icons/CheckSvg.js";
|
|
8
|
+
import { SidebarSearchSvg as f } from "@plumile/ui/icons/SidebarSearchSvg.js";
|
|
8
9
|
//#region src/components/backoffice/filters/DeferredFilterSearchInput.tsx
|
|
9
|
-
var
|
|
10
|
-
let { t:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
}, [
|
|
14
|
-
let
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
19
|
-
|
|
20
|
-
|
|
10
|
+
var p = ({ value: p, placeholder: m, ariaLabel: h, className: g, inputMode: _ = "search", type: v = "text", onApply: y }) => {
|
|
11
|
+
let { t: b } = e(), [x, S] = o(p);
|
|
12
|
+
a(() => {
|
|
13
|
+
S(p);
|
|
14
|
+
}, [p]);
|
|
15
|
+
let C = x.trim(), w = p.trim(), T = C !== "", E = C !== w, D = T || w !== "", O = h ?? m, k = b("filters.actions.clearFilter", { label: O }), A = b("filters.actions.applyFilter", { label: O }), j = () => {
|
|
16
|
+
E && y(C);
|
|
17
|
+
}, M = () => {
|
|
18
|
+
S(""), w !== "" && y("");
|
|
19
|
+
}, N = /* @__PURE__ */ s("span", {
|
|
20
|
+
className: n,
|
|
21
|
+
"aria-hidden": "true"
|
|
22
|
+
});
|
|
23
|
+
return D && (N = /* @__PURE__ */ s("button", {
|
|
24
|
+
type: "button",
|
|
25
|
+
className: t,
|
|
26
|
+
"aria-label": k,
|
|
27
|
+
title: k,
|
|
28
|
+
onClick: M,
|
|
29
|
+
children: /* @__PURE__ */ s(u, {
|
|
30
|
+
width: 16,
|
|
31
|
+
height: 16,
|
|
32
|
+
"aria-hidden": "true"
|
|
33
|
+
})
|
|
34
|
+
})), /* @__PURE__ */ s("form", {
|
|
35
|
+
className: g,
|
|
21
36
|
onSubmit: (e) => {
|
|
22
|
-
e.preventDefault(),
|
|
37
|
+
e.preventDefault(), j();
|
|
23
38
|
},
|
|
24
|
-
children: /* @__PURE__ */
|
|
25
|
-
className:
|
|
26
|
-
children:
|
|
27
|
-
type:
|
|
28
|
-
inputMode:
|
|
29
|
-
value:
|
|
30
|
-
|
|
31
|
-
|
|
39
|
+
children: /* @__PURE__ */ s("div", {
|
|
40
|
+
className: i,
|
|
41
|
+
children: /* @__PURE__ */ s(l, {
|
|
42
|
+
type: v,
|
|
43
|
+
inputMode: _,
|
|
44
|
+
value: x,
|
|
45
|
+
onInput: (e) => {
|
|
46
|
+
S(e.currentTarget.value);
|
|
32
47
|
},
|
|
33
48
|
onKeyDown: (e) => {
|
|
34
|
-
e.key === "Escape" && (e.preventDefault(),
|
|
49
|
+
e.key === "Enter" && (e.preventDefault(), j()), e.key === "Escape" && (e.preventDefault(), S(p));
|
|
35
50
|
},
|
|
36
|
-
placeholder:
|
|
37
|
-
"aria-label":
|
|
51
|
+
placeholder: m,
|
|
52
|
+
"aria-label": O,
|
|
38
53
|
size: "small",
|
|
39
54
|
fullWidth: !0,
|
|
40
|
-
leftIcon: /* @__PURE__ */
|
|
55
|
+
leftIcon: /* @__PURE__ */ s(f, {
|
|
41
56
|
width: 18,
|
|
42
57
|
height: 18,
|
|
43
58
|
"aria-hidden": "true"
|
|
59
|
+
}),
|
|
60
|
+
rightIconIsInteractive: !0,
|
|
61
|
+
rightIcon: /* @__PURE__ */ c("span", {
|
|
62
|
+
className: r,
|
|
63
|
+
children: [N, /* @__PURE__ */ s("button", {
|
|
64
|
+
type: "submit",
|
|
65
|
+
className: t,
|
|
66
|
+
"aria-label": A,
|
|
67
|
+
title: A,
|
|
68
|
+
disabled: !E,
|
|
69
|
+
children: /* @__PURE__ */ s(d, {
|
|
70
|
+
width: 16,
|
|
71
|
+
height: 16,
|
|
72
|
+
"aria-hidden": "true"
|
|
73
|
+
})
|
|
74
|
+
})]
|
|
44
75
|
})
|
|
45
|
-
})
|
|
46
|
-
className: t,
|
|
47
|
-
children: [w && /* @__PURE__ */ a(s, {
|
|
48
|
-
type: "button",
|
|
49
|
-
variant: "text",
|
|
50
|
-
size: "small",
|
|
51
|
-
onClick: () => {
|
|
52
|
-
y(""), x !== "" && g("");
|
|
53
|
-
},
|
|
54
|
-
children: _("common.actions.clear")
|
|
55
|
-
}), /* @__PURE__ */ a(s, {
|
|
56
|
-
type: "submit",
|
|
57
|
-
variant: T,
|
|
58
|
-
size: "small",
|
|
59
|
-
disabled: !C,
|
|
60
|
-
children: _("filters.actions.apply")
|
|
61
|
-
})]
|
|
62
|
-
})]
|
|
76
|
+
})
|
|
63
77
|
})
|
|
64
78
|
});
|
|
65
79
|
};
|
|
66
80
|
//#endregion
|
|
67
|
-
export {
|
|
81
|
+
export { p as DeferredFilterSearchInput, p as default };
|
|
68
82
|
|
|
69
83
|
//# sourceMappingURL=DeferredFilterSearchInput.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DeferredFilterSearchInput.js","names":[],"sources":["../../../../../src/components/backoffice/filters/DeferredFilterSearchInput.tsx"],"sourcesContent":["import {\n useEffect,\n useState,\n type
|
|
1
|
+
{"version":3,"file":"DeferredFilterSearchInput.js","names":[],"sources":["../../../../../src/components/backoffice/filters/DeferredFilterSearchInput.tsx"],"sourcesContent":["import {\n useEffect,\n useState,\n type FormEvent,\n type JSX,\n type KeyboardEvent,\n} from 'react';\n\nimport { Input } from '@plumile/ui/atomic/atoms/input/Input.js';\nimport { CheckSvg } from '@plumile/ui/icons/CheckSvg.js';\nimport { ModalCloseSvg } from '@plumile/ui/icons/ModalCloseSvg.js';\nimport { SidebarSearchSvg } from '@plumile/ui/icons/SidebarSearchSvg.js';\n\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './deferredFilterSearchInput.css.js';\n\nexport type DeferredFilterSearchInputProps = {\n value: string;\n placeholder: string;\n ariaLabel?: string;\n className?: string;\n inputMode?: 'search' | 'numeric' | 'decimal';\n type?: 'search' | 'text' | 'number' | 'datetime-local';\n onApply: (value: string) => void;\n};\n\nexport const DeferredFilterSearchInput = ({\n value,\n placeholder,\n ariaLabel,\n className,\n inputMode = 'search',\n type = 'text',\n onApply,\n}: DeferredFilterSearchInputProps): JSX.Element => {\n const { t } = useBackofficeReactTranslation();\n const [draftValue, setDraftValue] = useState(value);\n\n useEffect(() => {\n setDraftValue(value);\n }, [value]);\n\n const normalizedDraft = draftValue.trim();\n const normalizedValue = value.trim();\n const hasDraft = normalizedDraft !== '';\n const hasPendingValue = normalizedDraft !== normalizedValue;\n const canClear = hasDraft || normalizedValue !== '';\n const inputLabel = ariaLabel ?? placeholder;\n const clearLabel = t('filters.actions.clearFilter', { label: inputLabel });\n const applyLabel = t('filters.actions.applyFilter', { label: inputLabel });\n\n const applyDraft = () => {\n if (!hasPendingValue) {\n return;\n }\n onApply(normalizedDraft);\n };\n\n const clearValue = () => {\n setDraftValue('');\n if (normalizedValue !== '') {\n onApply('');\n }\n };\n\n let clearActionNode: JSX.Element = (\n <span className={styles.actionButtonSpacer} aria-hidden=\"true\" />\n );\n if (canClear) {\n clearActionNode = (\n <button\n type=\"button\"\n className={styles.actionButton}\n aria-label={clearLabel}\n title={clearLabel}\n onClick={clearValue}\n >\n <ModalCloseSvg width={16} height={16} aria-hidden=\"true\" />\n </button>\n );\n }\n\n return (\n <form\n className={className}\n onSubmit={(event: FormEvent<HTMLFormElement>) => {\n event.preventDefault();\n applyDraft();\n }}\n >\n <div className={styles.container}>\n <Input\n type={type}\n inputMode={inputMode}\n value={draftValue}\n onInput={(event: FormEvent<HTMLInputElement>) => {\n setDraftValue(event.currentTarget.value);\n }}\n onKeyDown={(event: KeyboardEvent<HTMLInputElement>) => {\n if (event.key === 'Enter') {\n event.preventDefault();\n applyDraft();\n }\n if (event.key === 'Escape') {\n event.preventDefault();\n setDraftValue(value);\n }\n }}\n placeholder={placeholder}\n aria-label={inputLabel}\n size=\"small\"\n fullWidth\n leftIcon={\n <SidebarSearchSvg width={18} height={18} aria-hidden=\"true\" />\n }\n rightIconIsInteractive\n rightIcon={\n <span className={styles.actions}>\n {clearActionNode}\n <button\n type=\"submit\"\n className={styles.actionButton}\n aria-label={applyLabel}\n title={applyLabel}\n disabled={!hasPendingValue}\n >\n <CheckSvg width={16} height={16} aria-hidden=\"true\" />\n </button>\n </span>\n }\n />\n </div>\n </form>\n );\n};\n\nexport default DeferredFilterSearchInput;\n"],"mappings":";;;;;;;;;AA2BA,IAAa,KAA6B,EACxC,UACA,gBACA,cACA,cACA,eAAY,UACZ,UAAO,QACP,iBACiD;CACjD,IAAM,EAAE,SAAM,GAA+B,EACvC,CAAC,GAAY,KAAiB,EAAS,EAAM;CAEnD,QAAgB;EACd,EAAc,EAAM;IACnB,CAAC,EAAM,CAAC;CAEX,IAAM,IAAkB,EAAW,MAAM,EACnC,IAAkB,EAAM,MAAM,EAC9B,IAAW,MAAoB,IAC/B,IAAkB,MAAoB,GACtC,IAAW,KAAY,MAAoB,IAC3C,IAAa,KAAa,GAC1B,IAAa,EAAE,+BAA+B,EAAE,OAAO,GAAY,CAAC,EACpE,IAAa,EAAE,+BAA+B,EAAE,OAAO,GAAY,CAAC,EAEpE,UAAmB;EAClB,KAGL,EAAQ,EAAgB;IAGpB,UAAmB;EAEvB,AADA,EAAc,GAAG,EACb,MAAoB,MACtB,EAAQ,GAAG;IAIX,IACF,kBAAC,QAAD;EAAM,WAAW;EAA2B,eAAY;EAAS,CAAA;CAgBnE,OAdI,MACF,IACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,cAAY;EACZ,OAAO;EACP,SAAS;YAET,kBAAC,GAAD;GAAe,OAAO;GAAI,QAAQ;GAAI,eAAY;GAAS,CAAA;EACpD,CAAA,GAKX,kBAAC,QAAD;EACa;EACX,WAAW,MAAsC;GAE/C,AADA,EAAM,gBAAgB,EACtB,GAAY;;YAGd,kBAAC,OAAD;GAAK,WAAW;aACd,kBAAC,GAAD;IACQ;IACK;IACX,OAAO;IACP,UAAU,MAAuC;KAC/C,EAAc,EAAM,cAAc,MAAM;;IAE1C,YAAY,MAA2C;KAKrD,AAJI,EAAM,QAAQ,YAChB,EAAM,gBAAgB,EACtB,GAAY,GAEV,EAAM,QAAQ,aAChB,EAAM,gBAAgB,EACtB,EAAc,EAAM;;IAGX;IACb,cAAY;IACZ,MAAK;IACL,WAAA;IACA,UACE,kBAAC,GAAD;KAAkB,OAAO;KAAI,QAAQ;KAAI,eAAY;KAAS,CAAA;IAEhE,wBAAA;IACA,WACE,kBAAC,QAAD;KAAM,WAAW;eAAjB,CACG,GACD,kBAAC,UAAD;MACE,MAAK;MACL,WAAW;MACX,cAAY;MACZ,OAAO;MACP,UAAU,CAAC;gBAEX,kBAAC,GAAD;OAAU,OAAO;OAAI,QAAQ;OAAI,eAAY;OAAS,CAAA;MAC/C,CAAA,CACJ;;IAET,CAAA;GACE,CAAA;EACD,CAAA"}
|
|
@@ -1,98 +1,93 @@
|
|
|
1
1
|
import { useBackofficeReactTranslation as e } from "../../../i18n/useBackofficeReactTranslation.js";
|
|
2
2
|
import { actionIcon as t, clearButton as n, container as r, content as i, labelText as a, pickActionButton as o, pickerButton as s, pickerControl as c, placeholder as l, valueText as u } from "./entityIdFilterField.css.js";
|
|
3
3
|
import { jsx as d, jsxs as f } from "react/jsx-runtime";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { ModalCloseSvg as p } from "@plumile/ui/icons/ModalCloseSvg.js";
|
|
5
|
+
import { BackofficeSidebarPenToolSvg as m } from "@plumile/ui/icons/backoffice/BackofficeSidebarPenToolSvg.js";
|
|
6
|
+
import { BackofficeSidebarSearchSvg as h } from "@plumile/ui/icons/backoffice/BackofficeSidebarSearchSvg.js";
|
|
6
7
|
//#region src/components/backoffice/filters/EntityIdFilterField.tsx
|
|
7
|
-
var
|
|
8
|
-
let { disabled:
|
|
9
|
-
|
|
8
|
+
var g = (g) => {
|
|
9
|
+
let { disabled: _ = !1, id: v, label: y, value: b, displayValue: x, placeholder: S, ariaDescribedBy: C, ariaInvalid: w, isResolving: T = !1, onPick: E, onClear: D } = g, { t: O } = e(), k = b?.trim() ?? "", A = x?.trim() ?? "", j = k !== "", M = A !== "", N = S ?? O("filters.placeholders.anyEntity", { label: y }), P = O("filters.placeholders.unresolved"), F;
|
|
10
|
+
F = M ? /* @__PURE__ */ d("span", {
|
|
10
11
|
className: u,
|
|
11
|
-
children:
|
|
12
|
-
}) :
|
|
12
|
+
children: A
|
|
13
|
+
}) : j ? /* @__PURE__ */ d("span", {
|
|
13
14
|
className: l,
|
|
14
|
-
children:
|
|
15
|
+
children: P
|
|
15
16
|
}) : /* @__PURE__ */ d("span", {
|
|
16
17
|
className: l,
|
|
17
|
-
children:
|
|
18
|
+
children: N
|
|
18
19
|
});
|
|
19
|
-
let
|
|
20
|
-
|
|
21
|
-
let
|
|
22
|
-
|
|
20
|
+
let I = O("common.actions.pick");
|
|
21
|
+
j && (I = O("filters.actions.changeFilterValue", { label: y }));
|
|
22
|
+
let L = O("filters.actions.filterBy", { label: y });
|
|
23
|
+
j && (L = I);
|
|
24
|
+
let R = O("filters.actions.clearFilter", { label: y }), z = null;
|
|
25
|
+
j && D != null && (z = /* @__PURE__ */ d("button", {
|
|
23
26
|
type: "button",
|
|
24
27
|
className: n,
|
|
25
|
-
"aria-label":
|
|
26
|
-
disabled:
|
|
28
|
+
"aria-label": R,
|
|
29
|
+
disabled: _,
|
|
27
30
|
onClick: (e) => {
|
|
28
|
-
e.stopPropagation(),
|
|
31
|
+
e.stopPropagation(), D();
|
|
29
32
|
},
|
|
30
|
-
children: /* @__PURE__ */ d(
|
|
31
|
-
width:
|
|
32
|
-
height:
|
|
33
|
-
|
|
34
|
-
fill: "none",
|
|
35
|
-
"aria-hidden": "true",
|
|
36
|
-
children: /* @__PURE__ */ d("path", {
|
|
37
|
-
d: "M3 3L9 9M9 3L3 9",
|
|
38
|
-
stroke: "currentColor",
|
|
39
|
-
strokeWidth: "1.6",
|
|
40
|
-
strokeLinecap: "round"
|
|
41
|
-
})
|
|
33
|
+
children: /* @__PURE__ */ d(p, {
|
|
34
|
+
width: 16,
|
|
35
|
+
height: 16,
|
|
36
|
+
"aria-hidden": "true"
|
|
42
37
|
})
|
|
43
38
|
}));
|
|
44
|
-
let
|
|
45
|
-
if (
|
|
46
|
-
let e = /* @__PURE__ */ d(
|
|
39
|
+
let B = null;
|
|
40
|
+
if (E != null) {
|
|
41
|
+
let e = /* @__PURE__ */ d(h, {
|
|
47
42
|
className: t,
|
|
48
43
|
"aria-hidden": "true"
|
|
49
44
|
});
|
|
50
|
-
|
|
45
|
+
j && (e = /* @__PURE__ */ d(m, {
|
|
51
46
|
className: t,
|
|
52
47
|
"aria-hidden": "true"
|
|
53
|
-
})),
|
|
48
|
+
})), B = /* @__PURE__ */ f("div", {
|
|
54
49
|
className: c,
|
|
55
50
|
children: [
|
|
56
51
|
/* @__PURE__ */ d("button", {
|
|
57
|
-
id:
|
|
52
|
+
id: v,
|
|
58
53
|
type: "button",
|
|
59
54
|
className: s,
|
|
60
|
-
"aria-label":
|
|
61
|
-
"aria-describedby":
|
|
62
|
-
"aria-invalid":
|
|
63
|
-
"aria-busy":
|
|
64
|
-
disabled:
|
|
65
|
-
onClick:
|
|
55
|
+
"aria-label": L,
|
|
56
|
+
"aria-describedby": C,
|
|
57
|
+
"aria-invalid": w,
|
|
58
|
+
"aria-busy": T || void 0,
|
|
59
|
+
disabled: _,
|
|
60
|
+
onClick: E,
|
|
66
61
|
children: /* @__PURE__ */ f("span", {
|
|
67
62
|
className: i,
|
|
68
63
|
children: [/* @__PURE__ */ d("span", {
|
|
69
64
|
className: a,
|
|
70
|
-
children:
|
|
71
|
-
}),
|
|
65
|
+
children: y
|
|
66
|
+
}), F]
|
|
72
67
|
})
|
|
73
68
|
}),
|
|
74
69
|
/* @__PURE__ */ d("button", {
|
|
75
70
|
type: "button",
|
|
76
71
|
className: o,
|
|
77
|
-
"aria-label":
|
|
78
|
-
title:
|
|
79
|
-
disabled:
|
|
80
|
-
onClick:
|
|
72
|
+
"aria-label": L,
|
|
73
|
+
title: L,
|
|
74
|
+
disabled: _,
|
|
75
|
+
onClick: E,
|
|
81
76
|
children: e
|
|
82
77
|
}),
|
|
83
|
-
|
|
78
|
+
z
|
|
84
79
|
]
|
|
85
80
|
});
|
|
86
81
|
}
|
|
87
82
|
return /* @__PURE__ */ d("div", {
|
|
88
83
|
className: r,
|
|
89
|
-
children:
|
|
84
|
+
children: B ?? /* @__PURE__ */ d("div", {
|
|
90
85
|
className: "txvbqbdxd txvbqbt9i txvbqbdr8 txvbqbey txvbqbusr",
|
|
91
|
-
children:
|
|
86
|
+
children: F
|
|
92
87
|
})
|
|
93
88
|
});
|
|
94
89
|
};
|
|
95
90
|
//#endregion
|
|
96
|
-
export {
|
|
91
|
+
export { g as EntityIdFilterField, g as default };
|
|
97
92
|
|
|
98
93
|
//# sourceMappingURL=EntityIdFilterField.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"EntityIdFilterField.js","names":[],"sources":["../../../../../src/components/backoffice/filters/EntityIdFilterField.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { BackofficeSidebarPenToolSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarPenToolSvg.js';\nimport { BackofficeSidebarSearchSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarSearchSvg.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './entityIdFilterField.css.js';\n\nexport type EntityIdFilterFieldProps = {\n id?: string;\n label: string;\n value: string | null;\n displayValue?: string | null;\n placeholder?: string;\n ariaDescribedBy?: string;\n ariaInvalid?: boolean;\n isResolving?: boolean;\n onPick?: () => void;\n onClear?: () => void;\n disabled?: boolean;\n};\n\nexport const EntityIdFilterField = (\n props: EntityIdFilterFieldProps,\n): JSX.Element => {\n const {\n disabled = false,\n id,\n label,\n value,\n displayValue,\n placeholder,\n ariaDescribedBy,\n ariaInvalid,\n isResolving = false,\n onPick,\n onClear,\n } = props;\n const { t } = useBackofficeReactTranslation();\n const normalizedValue = value?.trim() ?? '';\n const normalizedDisplayValue = displayValue?.trim() ?? '';\n const hasValue = normalizedValue !== '';\n const hasDisplayValue = normalizedDisplayValue !== '';\n\n const resolvedPlaceholder =\n placeholder ?? t('filters.placeholders.anyEntity', { label });\n const unresolvedPlaceholder = t('filters.placeholders.unresolved');\n\n let displayNode: JSX.Element;\n if (hasDisplayValue) {\n displayNode = (\n <span className={styles.valueText}>{normalizedDisplayValue}</span>\n );\n } else if (hasValue) {\n displayNode = (\n <span className={styles.placeholder}>{unresolvedPlaceholder}</span>\n );\n } else {\n displayNode = (\n <span className={styles.placeholder}>{resolvedPlaceholder}</span>\n );\n }\n\n let pickLabel = t('common.actions.pick');\n if (hasValue) {\n pickLabel = t('
|
|
1
|
+
{"version":3,"file":"EntityIdFilterField.js","names":[],"sources":["../../../../../src/components/backoffice/filters/EntityIdFilterField.tsx"],"sourcesContent":["import { type JSX } from 'react';\n\nimport { ModalCloseSvg } from '@plumile/ui/icons/ModalCloseSvg.js';\nimport { BackofficeSidebarPenToolSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarPenToolSvg.js';\nimport { BackofficeSidebarSearchSvg } from '@plumile/ui/icons/backoffice/BackofficeSidebarSearchSvg.js';\nimport { useBackofficeReactTranslation } from '../../../i18n/useBackofficeReactTranslation.js';\n\nimport * as styles from './entityIdFilterField.css.js';\n\nexport type EntityIdFilterFieldProps = {\n id?: string;\n label: string;\n value: string | null;\n displayValue?: string | null;\n placeholder?: string;\n ariaDescribedBy?: string;\n ariaInvalid?: boolean;\n isResolving?: boolean;\n onPick?: () => void;\n onClear?: () => void;\n disabled?: boolean;\n};\n\nexport const EntityIdFilterField = (\n props: EntityIdFilterFieldProps,\n): JSX.Element => {\n const {\n disabled = false,\n id,\n label,\n value,\n displayValue,\n placeholder,\n ariaDescribedBy,\n ariaInvalid,\n isResolving = false,\n onPick,\n onClear,\n } = props;\n const { t } = useBackofficeReactTranslation();\n const normalizedValue = value?.trim() ?? '';\n const normalizedDisplayValue = displayValue?.trim() ?? '';\n const hasValue = normalizedValue !== '';\n const hasDisplayValue = normalizedDisplayValue !== '';\n\n const resolvedPlaceholder =\n placeholder ?? t('filters.placeholders.anyEntity', { label });\n const unresolvedPlaceholder = t('filters.placeholders.unresolved');\n\n let displayNode: JSX.Element;\n if (hasDisplayValue) {\n displayNode = (\n <span className={styles.valueText}>{normalizedDisplayValue}</span>\n );\n } else if (hasValue) {\n displayNode = (\n <span className={styles.placeholder}>{unresolvedPlaceholder}</span>\n );\n } else {\n displayNode = (\n <span className={styles.placeholder}>{resolvedPlaceholder}</span>\n );\n }\n\n let pickLabel = t('common.actions.pick');\n if (hasValue) {\n pickLabel = t('filters.actions.changeFilterValue', { label });\n }\n let pickAriaLabel = t('filters.actions.filterBy', { label });\n if (hasValue) {\n pickAriaLabel = pickLabel;\n }\n const clearAriaLabel = t('filters.actions.clearFilter', { label });\n\n let clearNode: JSX.Element | null = null;\n if (hasValue && onClear != null) {\n clearNode = (\n <button\n type=\"button\"\n className={styles.clearButton}\n aria-label={clearAriaLabel}\n disabled={disabled}\n onClick={(event) => {\n event.stopPropagation();\n onClear();\n }}\n >\n <ModalCloseSvg width={16} height={16} aria-hidden=\"true\" />\n </button>\n );\n }\n\n let pickerNode: JSX.Element | null = null;\n if (onPick != null) {\n let actionIcon = (\n <BackofficeSidebarSearchSvg\n className={styles.actionIcon}\n aria-hidden=\"true\"\n />\n );\n if (hasValue) {\n actionIcon = (\n <BackofficeSidebarPenToolSvg\n className={styles.actionIcon}\n aria-hidden=\"true\"\n />\n );\n }\n\n pickerNode = (\n <div className={styles.pickerControl}>\n <button\n id={id}\n type=\"button\"\n className={styles.pickerButton}\n aria-label={pickAriaLabel}\n aria-describedby={ariaDescribedBy}\n aria-invalid={ariaInvalid}\n aria-busy={isResolving || undefined}\n disabled={disabled}\n onClick={onPick}\n >\n <span className={styles.content}>\n <span className={styles.labelText}>{label}</span>\n {displayNode}\n </span>\n </button>\n <button\n type=\"button\"\n className={styles.pickActionButton}\n aria-label={pickAriaLabel}\n title={pickAriaLabel}\n disabled={disabled}\n onClick={onPick}\n >\n {actionIcon}\n </button>\n {clearNode}\n </div>\n );\n }\n\n return (\n <div className={styles.container}>\n {pickerNode ?? <div className={styles.valueBox}>{displayNode}</div>}\n </div>\n );\n};\n\nexport default EntityIdFilterField;\n"],"mappings":";;;;;;;AAuBA,IAAa,KACX,MACgB;CAChB,IAAM,EACJ,cAAW,IACX,OACA,UACA,UACA,iBACA,aAAA,GACA,oBACA,gBACA,iBAAc,IACd,WACA,eACE,GACE,EAAE,SAAM,GAA+B,EACvC,IAAkB,GAAO,MAAM,IAAI,IACnC,IAAyB,GAAc,MAAM,IAAI,IACjD,IAAW,MAAoB,IAC/B,IAAkB,MAA2B,IAE7C,IACJ,KAAe,EAAE,kCAAkC,EAAE,UAAO,CAAC,EACzD,IAAwB,EAAE,kCAAkC,EAE9D;CACJ,AASE,IATE,IAEA,kBAAC,QAAD;EAAM,WAAW;YAAmB;EAA8B,CAAA,GAE3D,IAEP,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA6B,CAAA,GAInE,kBAAC,QAAD;EAAM,WAAW;YAAqB;EAA2B,CAAA;CAIrE,IAAI,IAAY,EAAE,sBAAsB;CACxC,AAAI,MACF,IAAY,EAAE,qCAAqC,EAAE,UAAO,CAAC;CAE/D,IAAI,IAAgB,EAAE,4BAA4B,EAAE,UAAO,CAAC;CAC5D,AAAI,MACF,IAAgB;CAElB,IAAM,IAAiB,EAAE,+BAA+B,EAAE,UAAO,CAAC,EAE9D,IAAgC;CACpC,AAAI,KAAY,KAAW,SACzB,IACE,kBAAC,UAAD;EACE,MAAK;EACL,WAAW;EACX,cAAY;EACF;EACV,UAAU,MAAU;GAElB,AADA,EAAM,iBAAiB,EACvB,GAAS;;YAGX,kBAAC,GAAD;GAAe,OAAO;GAAI,QAAQ;GAAI,eAAY;GAAS,CAAA;EACpD,CAAA;CAIb,IAAI,IAAiC;CACrC,IAAI,KAAU,MAAM;EAClB,IAAI,IACF,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA;EAWJ,AATI,MACF,IACE,kBAAC,GAAD;GACE,WAAW;GACX,eAAY;GACZ,CAAA,GAIN,IACE,kBAAC,OAAD;GAAK,WAAW;aAAhB;IACE,kBAAC,UAAD;KACM;KACJ,MAAK;KACL,WAAW;KACX,cAAY;KACZ,oBAAkB;KAClB,gBAAc;KACd,aAAW,KAAe,KAAA;KAChB;KACV,SAAS;eAET,kBAAC,QAAD;MAAM,WAAW;gBAAjB,CACE,kBAAC,QAAD;OAAM,WAAW;iBAAmB;OAAa,CAAA,EAChD,EACI;;KACA,CAAA;IACT,kBAAC,UAAD;KACE,MAAK;KACL,WAAW;KACX,cAAY;KACZ,OAAO;KACG;KACV,SAAS;eAER;KACM,CAAA;IACR;IACG;;;CAIV,OACE,kBAAC,OAAD;EAAK,WAAW;YACb,KAAc,kBAAC,OAAD;GAAK,WAAW;aAAkB;GAAkB,CAAA;EAC/D,CAAA"}
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/* empty css */
|
|
2
1
|
/* empty css */
|
|
3
2
|
//#region src/components/backoffice/filters/backofficeFilterAction.css.ts
|
|
4
3
|
var e = "hwnq700 txvbqbdsb txvbqbey txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3 txvbqb2g9 txvbqb1uy txvbqb2et txvbqb17u txvbqb196f txvbqb19d9 txvbqbv txvbqb3f txvbqb7h txvbqb75 txvbqb7t txvbqb1bs9 txvbqb1adl txvbqb1ayh qbwcue0 txvbqb1cb0 txvbqb1cws", t = "txvbqb17h7 txvbqbhmm";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/* empty css */
|
|
2
2
|
//#region src/components/backoffice/filters/deferredFilterSearchInput.css.ts
|
|
3
|
-
var e = "
|
|
3
|
+
var e = "txvbqb17w0", t = "ds2thc0 txvbqbdsb txvbqbey txvbqbg9v", n = "ds2thc1 txvbqb6 txvbqbdsb txvbqbey txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3 txvbqb2g9 txvbqb1g5 txvbqb1933 txvbqb19cd txvbqbv txvbqb7h txvbqb75 txvbqb7t", r = "txvbqbdsb txvbqb17ia txvbqbhnp txvbqbf7y";
|
|
4
4
|
//#endregion
|
|
5
|
-
export { t as actions, e as container };
|
|
5
|
+
export { n as actionButton, r as actionButtonSpacer, t as actions, e as container };
|
|
6
6
|
|
|
7
7
|
//# sourceMappingURL=deferredFilterSearchInput.css.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"deferredFilterSearchInput.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/deferredFilterSearchInput.css.ts"],"sourcesContent":["import { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\n\nexport const container = sprinkles({\n
|
|
1
|
+
{"version":3,"file":"deferredFilterSearchInput.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/deferredFilterSearchInput.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const container = sprinkles({\n width: 'full',\n});\n\nexport const actions = style([\n sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n gap: 0.5,\n }),\n {\n minWidth: '3.75rem',\n },\n]);\n\nexport const actionButton = style([\n sprinkles({\n appearance: 'none',\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: 7,\n height: 7,\n padding: 0,\n borderRadius: 'md',\n borderWidth: 0,\n backgroundColor: 'transparent',\n color: 'textMuted',\n cursor: 'pointer',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n selectors: {\n '&:hover:not(:disabled)': {\n color: vars.colors.text,\n backgroundColor: vars.colors.surfaceMuted,\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n '&:disabled': {\n cursor: 'not-allowed',\n opacity: 0.45,\n },\n },\n },\n]);\n\nexport const actionButtonSpacer = sprinkles({\n display: 'inline-flex',\n width: 7,\n height: 7,\n flexShrink: 0,\n});\n"],"mappings":""}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/* empty css */
|
|
2
2
|
//#region src/components/backoffice/filters/entityIdFilterField.css.ts
|
|
3
|
-
var e = "txvbqbdr8 txvbqbey txvbqb17ro txvbqbs65 txvbqbt9i", t = "oa1uye0 txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdrl txvbqbey txvbqbdxd txvbqbt9i txvbqb2gz txvbqb1uy txvbqb2et txvbqb17h txvbqb196b txvbqb19c9 txvbqb7g txvbqb76 txvbqb7t", n = "oa1uye1 txvbqb6 txvbqbdr8 txvbqbf6i txvbqbjtp txvbqbt9i txvbqb17w0 txvbqb16ex txvbqbv txvbqb1g5 txvbqb1933 txvbqb19c9 txvbqbux3", r = "txvbqbdr8 txvbqbf6i txvbqbjtp txvbqbg9v txvbqbt9i txvbqb17w0 txvbqbs65", i = "txvbqbdxd txvbqbt9i txvbqbdr8 txvbqbey txvbqbusr", a = "txvbqbdqi txvbqb19cd txvbqb96 txvbqbfcn txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk", o = "txvbqbdqi txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk txvbqb9j txvbqbfd0", s = "txvbqbdqi txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk txvbqb19cd txvbqb9j", c = "oa1uye3 oa1uye2 txvbqb6 txvbqbdsb txvbqbey txvbqbgr txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3
|
|
3
|
+
var e = "txvbqbdr8 txvbqbey txvbqb17ro txvbqbs65 txvbqbt9i", t = "oa1uye0 txvbqbyoi txvbqbzm3 txvbqb11ed txvbqbwqg txvbqbdrl txvbqbey txvbqbdxd txvbqbt9i txvbqb2gz txvbqb1uy txvbqb2et txvbqb17h txvbqb196b txvbqb19c9 txvbqb7g txvbqb76 txvbqb7t", n = "oa1uye1 txvbqb6 txvbqbdr8 txvbqbf6i txvbqbjtp txvbqbt9i txvbqb17w0 txvbqb16ex txvbqbv txvbqb1g5 txvbqb1933 txvbqb19c9 txvbqbux3", r = "txvbqbdr8 txvbqbf6i txvbqbjtp txvbqbg9v txvbqbt9i txvbqb17w0 txvbqbs65", i = "txvbqbdxd txvbqbt9i txvbqbdr8 txvbqbey txvbqbusr", a = "txvbqbdqi txvbqb19cd txvbqb96 txvbqbfcn txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk", o = "txvbqbdqi txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk txvbqb9j txvbqbfd0", s = "txvbqbdqi txvbqbt9i txvbqbusr txvbqb16g0 txvbqb18xk txvbqb19cd txvbqb9j", c = "oa1uye3 oa1uye2 txvbqb6 txvbqbdsb txvbqbey txvbqbgr txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3 txvbqb2g9 txvbqb1g5 txvbqb1933 txvbqb19cd txvbqbv txvbqb7h txvbqb75 txvbqb7t", l = "oa1uye4 oa1uye2 txvbqb6 txvbqbdsb txvbqbey txvbqbgr txvbqbjtp txvbqb17ia txvbqbhnp txvbqbux3 txvbqb2g9 txvbqb1g5 txvbqb1933 txvbqb19cd txvbqbv txvbqb7h txvbqb75 txvbqb7t", u = "txvbqb17h7 txvbqbhmm";
|
|
4
4
|
//#endregion
|
|
5
5
|
export { u as actionIcon, l as clearButton, e as container, r as content, a as labelText, c as pickActionButton, n as pickerButton, t as pickerControl, s as placeholder, i as valueBox, o as valueText };
|
|
6
6
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"entityIdFilterField.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/entityIdFilterField.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const container = sprinkles({\n display: 'flex',\n alignItems: 'center',\n width: 72,\n maxWidth: 'full',\n minWidth: 0,\n});\n\nexport const pickerControl = style([\n sprinkles({\n display: 'grid',\n alignItems: 'center',\n flex: 1,\n minWidth: 0,\n borderRadius: 'xl',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'border',\n backgroundColor: 'surface',\n color: 'text',\n paddingX: 3,\n paddingY: 1.5,\n transitionProperty: 'default',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n {\n gridTemplateColumns: 'minmax(0, 1fr) auto auto',\n gridTemplateAreas: '\"content pickAction clearAction\"',\n columnGap: vars.spacing[
|
|
1
|
+
{"version":3,"file":"entityIdFilterField.css.js","names":[],"sources":["../../../../../src/components/backoffice/filters/entityIdFilterField.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const container = sprinkles({\n display: 'flex',\n alignItems: 'center',\n width: 72,\n maxWidth: 'full',\n minWidth: 0,\n});\n\nexport const pickerControl = style([\n sprinkles({\n display: 'grid',\n alignItems: 'center',\n flex: 1,\n minWidth: 0,\n borderRadius: 'xl',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'border',\n backgroundColor: 'surface',\n color: 'text',\n paddingX: 3,\n paddingY: 1.5,\n transitionProperty: 'default',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n {\n gridTemplateColumns: 'minmax(0, 1fr) auto auto',\n gridTemplateAreas: '\"content pickAction clearAction\"',\n columnGap: vars.spacing[0.5],\n minHeight: '2.5rem',\n width: '100%',\n selectors: {\n '&:hover': {\n backgroundColor: vars.colors.surfaceMuted,\n },\n },\n },\n]);\n\nexport const pickerButton = style([\n sprinkles({\n appearance: 'none',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n minWidth: 0,\n width: 'full',\n textAlign: 'left',\n cursor: 'pointer',\n borderWidth: 0,\n backgroundColor: 'transparent',\n color: 'text',\n padding: 0,\n }),\n {\n gridArea: 'content',\n minHeight: '100%',\n selectors: {\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n '&:disabled': {\n cursor: 'not-allowed',\n opacity: 0.65,\n },\n },\n },\n]);\n\nexport const content = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n justifyContent: 'center',\n gap: 0.5,\n minWidth: 0,\n width: 'full',\n maxWidth: 'full',\n});\n\nexport const valueBox = sprinkles({\n flex: 1,\n minWidth: 0,\n display: 'flex',\n alignItems: 'center',\n overflow: 'hidden',\n});\n\nexport const labelText = sprinkles({\n display: 'block',\n color: 'textMuted',\n fontSize: 'xs',\n fontWeight: 'medium',\n minWidth: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const valueText = sprinkles({\n display: 'block',\n minWidth: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n fontSize: 'sm',\n fontWeight: 'semibold',\n});\n\nexport const placeholder = sprinkles({\n display: 'block',\n minWidth: 0,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n color: 'textMuted',\n fontSize: 'sm',\n});\n\nconst actionButtonBase = style([\n sprinkles({\n appearance: 'none',\n display: 'inline-flex',\n alignItems: 'center',\n alignSelf: 'center',\n justifyContent: 'center',\n width: 7,\n height: 7,\n padding: 0,\n borderRadius: 'md',\n borderWidth: 0,\n backgroundColor: 'transparent',\n color: 'textMuted',\n cursor: 'pointer',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n selectors: {\n '&:hover:not(:disabled)': {\n color: vars.colors.text,\n backgroundColor: vars.colors.surfaceMuted,\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n '&:disabled': {\n cursor: 'not-allowed',\n opacity: 0.65,\n },\n },\n },\n]);\n\nexport const pickActionButton = style([\n actionButtonBase,\n {\n gridArea: 'pickAction',\n },\n]);\n\nexport const clearButton = style([\n actionButtonBase,\n {\n gridArea: 'clearAction',\n },\n]);\n\nexport const actionIcon = sprinkles({\n width: 4,\n height: 4,\n});\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"backofficeHubTemplate.css.js","names":[],"sources":["../../../../../src/components/backoffice/hub/backofficeHubTemplate.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const content = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 5,\n});\n\nexport const search = sprinkles({\n maxWidth: '2xl',\n});\n\nexport const groups = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 6,\n});\n\nexport const group = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n});\n\nexport const groupHeader = sprinkles({\n display: 'flex',\n alignItems: 'flex-start',\n gap: 3,\n});\n\nexport const groupIcon = sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: 8,\n height: 8,\n borderRadius: 'md',\n backgroundColor: 'surfaceMuted',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n color: 'textSecondary',\n flexShrink: 0,\n marginTop: 'px',\n});\n\nexport const groupHeading = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n minWidth: 0,\n});\n\nexport const groupTitle = sprinkles({\n fontSize: 'lg',\n fontWeight: 'semibold',\n color: 'text',\n margin: 0,\n});\n\nexport const groupDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n});\n\nexport const grid = sprinkles({\n display: 'grid',\n gridTemplateColumns: 'autoFitMinmax260',\n gap: 3,\n});\n\nexport const item = style([\n sprinkles({\n display: 'flex',\n alignItems: 'flex-start',\n gap: 3,\n padding: 3,\n borderRadius: 'md',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surface',\n color: 'text',\n textDecoration: 'none',\n minWidth: 0,\n transitionProperty: 'default',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n {\n minHeight: '92px',\n selectors: {\n '&:hover': {\n borderColor: vars.colors.border,\n backgroundColor: vars.colors.surfaceMuted,\n transform: 'translateY(-1px)',\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n },\n },\n]);\n\nexport const itemIcon = sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: 9,\n height: 9,\n borderRadius: 'md',\n backgroundColor: 'surfaceMuted',\n color: 'textSecondary',\n flexShrink: 0,\n});\n\nexport const itemContent = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n minWidth: 0,\n});\n\nexport const itemTitle = sprinkles({\n fontWeight: 'semibold',\n color: 'text',\n overflowWrap: 'anywhere',\n});\n\nexport const itemDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n lineHeight: 'normal',\n overflowWrap: 'anywhere',\n});\n\nexport const itemMeta = sprinkles({\n color: 'textMuted',\n fontSize: 'xs',\n fontWeight: 'medium',\n textTransform: 'uppercase',\n letterSpacing: 'wide',\n});\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"backofficeHubTemplate.css.js","names":[],"sources":["../../../../../src/components/backoffice/hub/backofficeHubTemplate.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const content = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 5,\n});\n\nexport const search = sprinkles({\n maxWidth: '2xl',\n});\n\nexport const groups = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 6,\n});\n\nexport const group = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n});\n\nexport const groupHeader = sprinkles({\n display: 'flex',\n alignItems: 'flex-start',\n gap: 3,\n});\n\nexport const groupIcon = sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: 8,\n height: 8,\n borderRadius: 'md',\n backgroundColor: 'surfaceMuted',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n color: 'textSecondary',\n flexShrink: 0,\n marginTop: 'px',\n});\n\nexport const groupHeading = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n minWidth: 0,\n});\n\nexport const groupTitle = sprinkles({\n fontSize: 'lg',\n fontWeight: 'semibold',\n color: 'text',\n margin: 0,\n});\n\nexport const groupDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n});\n\nexport const grid = sprinkles({\n display: 'grid',\n gridTemplateColumns: 'autoFitMinmax260',\n gap: 3,\n});\n\nexport const item = style([\n sprinkles({\n display: 'flex',\n alignItems: 'flex-start',\n gap: 3,\n padding: 3,\n borderRadius: 'md',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surface',\n color: 'text',\n textDecoration: 'none',\n minWidth: 0,\n transitionProperty: 'default',\n transitionDuration: 150,\n transitionTimingFunction: 'ease',\n }),\n {\n minHeight: '92px',\n selectors: {\n '&:hover': {\n borderColor: vars.colors.border,\n backgroundColor: vars.colors.surfaceMuted,\n transform: 'translateY(-1px)',\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n },\n },\n]);\n\nexport const itemIcon = sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: 9,\n height: 9,\n borderRadius: 'md',\n backgroundColor: 'surfaceMuted',\n color: 'textSecondary',\n flexShrink: 0,\n});\n\nexport const itemContent = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n minWidth: 0,\n});\n\nexport const itemTitle = sprinkles({\n fontWeight: 'semibold',\n color: 'text',\n overflowWrap: 'anywhere',\n});\n\nexport const itemDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n lineHeight: 'normal',\n overflowWrap: 'anywhere',\n});\n\nexport const itemMeta = sprinkles({\n color: 'textMuted',\n fontSize: 'xs',\n fontWeight: 'medium',\n textTransform: 'uppercase',\n letterSpacing: 'wide',\n});\n"],"mappings":""}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"entityIdPickerDialog.css.js","names":[],"sources":["../../../../../src/components/backoffice/pickers/entityIdPickerDialog.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.js';\n\nexport const layout = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n});\n\nexport const searchRequiredMessage = sprinkles({\n color: 'textSecondary',\n fontSize: 'sm',\n textAlign: 'center',\n paddingY: 3,\n paddingX: 0,\n});\n\nexport const loadingState = sprinkles({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 2,\n paddingY: 4,\n paddingX: 3,\n color: 'textSecondary',\n});\n\nexport const loadingLabel = sprinkles({\n fontSize: 'sm',\n color: 'textSecondary',\n});\n\nexport const list = style([\n sprinkles({\n display: 'flex',\n flexDirection: 'column',\n overflow: 'hidden',\n borderRadius: 'lg',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surface',\n }),\n {\n selectors: {\n '&:empty': {\n display: 'none',\n },\n },\n },\n]);\n\nexport const listItem = style([\n sprinkles({\n appearance: 'none',\n display: 'block',\n width: 'full',\n paddingX: 3,\n paddingY: 2.5,\n borderWidth: 0,\n backgroundColor: 'surface',\n color: 'text',\n cursor: 'pointer',\n textAlign: 'left',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n minHeight: '3.25rem',\n selectors: {\n '& + &': {\n borderTop: `1px solid ${vars.colors.borderSubtle}`,\n },\n '&:hover': {\n backgroundColor: vars.colors.surfaceMuted,\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '-2px',\n },\n },\n },\n]);\n\nexport const row = sprinkles({\n display: 'flex',\n gap: 2,\n alignItems: 'center',\n minWidth: 0,\n});\n\nexport const rowText = sprinkles({\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n textAlign: 'left',\n});\n\nexport const rowTitle = sprinkles({\n color: 'text',\n fontWeight: 'medium',\n fontSize: 'base',\n lineHeight: 1.2,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const rowSubtitle = sprinkles({\n color: 'textSecondary',\n fontSize: 'sm',\n lineHeight: 1.2,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const rowMeta = sprinkles({\n color: 'textMuted',\n fontSize: 'xs',\n lineHeight: 1.2,\n whiteSpace: 'nowrap',\n});\n"],"mappings":""}
|
|
1
|
+
{"version":3,"file":"entityIdPickerDialog.css.js","names":[],"sources":["../../../../../src/components/backoffice/pickers/entityIdPickerDialog.css.ts"],"sourcesContent":["import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui/theme/sprinkles.css.js';\nimport { vars } from '@plumile/ui/theme/themeContract.css.js';\n\nexport const layout = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n});\n\nexport const searchRequiredMessage = sprinkles({\n color: 'textSecondary',\n fontSize: 'sm',\n textAlign: 'center',\n paddingY: 3,\n paddingX: 0,\n});\n\nexport const loadingState = sprinkles({\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 2,\n paddingY: 4,\n paddingX: 3,\n color: 'textSecondary',\n});\n\nexport const loadingLabel = sprinkles({\n fontSize: 'sm',\n color: 'textSecondary',\n});\n\nexport const list = style([\n sprinkles({\n display: 'flex',\n flexDirection: 'column',\n overflow: 'hidden',\n borderRadius: 'lg',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surface',\n }),\n {\n selectors: {\n '&:empty': {\n display: 'none',\n },\n },\n },\n]);\n\nexport const listItem = style([\n sprinkles({\n appearance: 'none',\n display: 'block',\n width: 'full',\n paddingX: 3,\n paddingY: 2.5,\n borderWidth: 0,\n backgroundColor: 'surface',\n color: 'text',\n cursor: 'pointer',\n textAlign: 'left',\n transitionProperty: 'colors',\n transitionDuration: 120,\n transitionTimingFunction: 'ease',\n }),\n {\n minHeight: '3.25rem',\n selectors: {\n '& + &': {\n borderTop: `1px solid ${vars.colors.borderSubtle}`,\n },\n '&:hover': {\n backgroundColor: vars.colors.surfaceMuted,\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '-2px',\n },\n },\n },\n]);\n\nexport const row = sprinkles({\n display: 'flex',\n gap: 2,\n alignItems: 'center',\n minWidth: 0,\n});\n\nexport const rowText = sprinkles({\n flex: 1,\n minWidth: 0,\n display: 'flex',\n flexDirection: 'column',\n textAlign: 'left',\n});\n\nexport const rowTitle = sprinkles({\n color: 'text',\n fontWeight: 'medium',\n fontSize: 'base',\n lineHeight: 1.2,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const rowSubtitle = sprinkles({\n color: 'textSecondary',\n fontSize: 'sm',\n lineHeight: 1.2,\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n});\n\nexport const rowMeta = sprinkles({\n color: 'textMuted',\n fontSize: 'xs',\n lineHeight: 1.2,\n whiteSpace: 'nowrap',\n});\n"],"mappings":""}
|