@pipe0/react 0.0.6 → 0.0.7
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/CHANGELOG.md +8 -0
- package/README.md +14 -3
- package/dist/components/compound/pipe-catalog/card.d.mts +1 -0
- package/dist/components/compound/pipe-catalog/card.d.mts.map +1 -1
- package/dist/components/compound/pipe-catalog/card.mjs +3 -1
- package/dist/components/compound/pipe-catalog/card.mjs.map +1 -1
- package/dist/components/compound/pipe-catalog/category-filter.d.mts +4 -0
- package/dist/components/compound/pipe-catalog/category-filter.d.mts.map +1 -1
- package/dist/components/compound/pipe-catalog/category-filter.mjs +11 -1
- package/dist/components/compound/pipe-catalog/category-filter.mjs.map +1 -1
- package/dist/components/compound/pipe-catalog/column-filter.d.mts +2 -0
- package/dist/components/compound/pipe-catalog/column-filter.d.mts.map +1 -1
- package/dist/components/compound/pipe-catalog/column-filter.mjs +6 -0
- package/dist/components/compound/pipe-catalog/column-filter.mjs.map +1 -1
- package/dist/components/compound/pipe-catalog/list.d.mts +2 -0
- package/dist/components/compound/pipe-catalog/list.d.mts.map +1 -1
- package/dist/components/compound/pipe-catalog/list.mjs +5 -1
- package/dist/components/compound/pipe-catalog/list.mjs.map +1 -1
- package/dist/components/compound/pipe-catalog/search-filter.d.mts +1 -0
- package/dist/components/compound/pipe-catalog/search-filter.d.mts.map +1 -1
- package/dist/components/compound/pipe-catalog/search-filter.mjs +2 -0
- package/dist/components/compound/pipe-catalog/search-filter.mjs.map +1 -1
- package/dist/components/compound/pipe-form/content.d.mts +3 -1
- package/dist/components/compound/pipe-form/content.d.mts.map +1 -1
- package/dist/components/compound/pipe-form/content.mjs +8 -2
- package/dist/components/compound/pipe-form/content.mjs.map +1 -1
- package/dist/components/compound/pipe-form/errors.d.mts +4 -0
- package/dist/components/compound/pipe-form/errors.d.mts.map +1 -1
- package/dist/components/compound/pipe-form/errors.mjs +9 -1
- package/dist/components/compound/pipe-form/errors.mjs.map +1 -1
- package/dist/components/compound/search-catalog/card.d.mts +1 -0
- package/dist/components/compound/search-catalog/card.d.mts.map +1 -1
- package/dist/components/compound/search-catalog/card.mjs +3 -1
- package/dist/components/compound/search-catalog/card.mjs.map +1 -1
- package/dist/components/compound/search-catalog/category-filter.d.mts +4 -0
- package/dist/components/compound/search-catalog/category-filter.d.mts.map +1 -1
- package/dist/components/compound/search-catalog/category-filter.mjs +11 -1
- package/dist/components/compound/search-catalog/category-filter.mjs.map +1 -1
- package/dist/components/compound/search-catalog/column-filter.d.mts +2 -0
- package/dist/components/compound/search-catalog/column-filter.d.mts.map +1 -1
- package/dist/components/compound/search-catalog/column-filter.mjs +6 -0
- package/dist/components/compound/search-catalog/column-filter.mjs.map +1 -1
- package/dist/components/compound/search-catalog/list.d.mts +2 -0
- package/dist/components/compound/search-catalog/list.d.mts.map +1 -1
- package/dist/components/compound/search-catalog/list.mjs +5 -1
- package/dist/components/compound/search-catalog/list.mjs.map +1 -1
- package/dist/components/compound/search-catalog/search-filter.d.mts +1 -0
- package/dist/components/compound/search-catalog/search-filter.d.mts.map +1 -1
- package/dist/components/compound/search-catalog/search-filter.mjs +2 -0
- package/dist/components/compound/search-catalog/search-filter.mjs.map +1 -1
- package/dist/components/compound/search-form/content.d.mts +3 -1
- package/dist/components/compound/search-form/content.d.mts.map +1 -1
- package/dist/components/compound/search-form/content.mjs +8 -2
- package/dist/components/compound/search-form/content.mjs.map +1 -1
- package/dist/components/compound/search-form/errors.d.mts +4 -0
- package/dist/components/compound/search-form/errors.d.mts.map +1 -1
- package/dist/components/compound/search-form/errors.mjs +9 -1
- package/dist/components/compound/search-form/errors.mjs.map +1 -1
- package/dist/components/compound/searches-catalog/card.d.mts +1 -0
- package/dist/components/compound/searches-catalog/card.d.mts.map +1 -1
- package/dist/components/compound/searches-catalog/card.mjs +3 -1
- package/dist/components/compound/searches-catalog/card.mjs.map +1 -1
- package/dist/components/compound/searches-catalog/category-filter.d.mts +4 -0
- package/dist/components/compound/searches-catalog/category-filter.d.mts.map +1 -1
- package/dist/components/compound/searches-catalog/category-filter.mjs +11 -1
- package/dist/components/compound/searches-catalog/category-filter.mjs.map +1 -1
- package/dist/components/compound/searches-catalog/column-filter.d.mts +2 -0
- package/dist/components/compound/searches-catalog/column-filter.d.mts.map +1 -1
- package/dist/components/compound/searches-catalog/column-filter.mjs +6 -0
- package/dist/components/compound/searches-catalog/column-filter.mjs.map +1 -1
- package/dist/components/compound/searches-catalog/list.d.mts +2 -0
- package/dist/components/compound/searches-catalog/list.d.mts.map +1 -1
- package/dist/components/compound/searches-catalog/list.mjs +5 -1
- package/dist/components/compound/searches-catalog/list.mjs.map +1 -1
- package/dist/components/compound/searches-catalog/search-filter.d.mts +1 -0
- package/dist/components/compound/searches-catalog/search-filter.d.mts.map +1 -1
- package/dist/components/compound/searches-catalog/search-filter.mjs +2 -0
- package/dist/components/compound/searches-catalog/search-filter.mjs.map +1 -1
- package/dist/components/defaults/layout/field-wrapper.d.mts +1 -0
- package/dist/components/defaults/layout/field-wrapper.d.mts.map +1 -1
- package/dist/components/defaults/layout/field-wrapper.mjs +2 -0
- package/dist/components/defaults/layout/field-wrapper.mjs.map +1 -1
- package/dist/components/defaults/layout/group.d.mts +3 -0
- package/dist/components/defaults/layout/group.d.mts.map +1 -1
- package/dist/components/defaults/layout/group.mjs +6 -0
- package/dist/components/defaults/layout/group.mjs.map +1 -1
- package/dist/components/defaults/layout/section.d.mts +2 -1
- package/dist/components/defaults/layout/section.d.mts.map +1 -1
- package/dist/components/defaults/layout/section.mjs +5 -1
- package/dist/components/defaults/layout/section.mjs.map +1 -1
- package/package.json +2 -2
package/CHANGELOG.md
CHANGED
package/README.md
CHANGED
|
@@ -116,9 +116,20 @@ parts that should change. Each level of the hierarchy works the same way:
|
|
|
116
116
|
/>;
|
|
117
117
|
```
|
|
118
118
|
|
|
119
|
-
Catalog components follow the same pattern
|
|
120
|
-
|
|
121
|
-
|
|
119
|
+
Catalog components follow the same pattern. Each filter exposes the data a
|
|
120
|
+
custom render needs as the second arg:
|
|
121
|
+
|
|
122
|
+
- `PipeCatalogSearchFilter` — `{ value, setValue, isActive }`
|
|
123
|
+
- `PipeCatalogCategoryFilter` — `{ value, setValue, options, counts, totalCount, isActive }`
|
|
124
|
+
- `PipeCatalogColumnFilter` (and the typed `Input/Output/Provider/Tag` variants)
|
|
125
|
+
— `{ value, setValue, options, isActive }`
|
|
126
|
+
- `PipeCatalogList` — `{ cards, isEmpty }`
|
|
127
|
+
- `PipeCatalogActiveFilters` — `{ activeFilters, isEmpty }`
|
|
128
|
+
- `PipeCatalogCard` — `{ selected, expanded, setExpanded }`
|
|
129
|
+
|
|
130
|
+
Spreading `{...props}` always keeps the wired ref, click/keyboard handlers,
|
|
131
|
+
`className`, and `data-*` attributes — the second arg is purely an escape
|
|
132
|
+
hatch for rebuilding markup.
|
|
122
133
|
|
|
123
134
|
## SearchForm
|
|
124
135
|
|
|
@@ -7,6 +7,7 @@ import { MouseEvent } from "react";
|
|
|
7
7
|
interface PipeCatalogCardState {
|
|
8
8
|
selected: boolean;
|
|
9
9
|
expanded: boolean;
|
|
10
|
+
setExpanded: (open: boolean) => void;
|
|
10
11
|
}
|
|
11
12
|
interface PipeCatalogCardProps extends useRender.ComponentProps<"div", PipeCatalogCardState> {
|
|
12
13
|
card: PipeCardData;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/card.tsx"],"mappings":";;;;;;UAyBiB,oBAAA;EACf,QAAA;EACA,QAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"card.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/card.tsx"],"mappings":";;;;;;UAyBiB,oBAAA;EACf,QAAA;EACA,QAAA;EACA,WAAA,GAAc,IAAA;AAAA;AAAA,UAGC,oBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,oBAAA;EACxC,IAAA,EAAM,YAAA;EACN,KAAA;EACA,QAAA;EAPA;EASA,OAAA,IAAW,CAAA,EAAG,UAAA,CAAW,cAAA;AAAA;AAAA,cAUd,eAAA,EAAe,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,oBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA"}
|
|
@@ -53,8 +53,10 @@ const PipeCatalogCard = forwardRef(function PipeCatalogCard({ card, index = 0, s
|
|
|
53
53
|
render,
|
|
54
54
|
state: {
|
|
55
55
|
selected,
|
|
56
|
-
expanded
|
|
56
|
+
expanded,
|
|
57
|
+
setExpanded
|
|
57
58
|
},
|
|
59
|
+
stateAttributesMapping: { setExpanded: () => null },
|
|
58
60
|
props: mergeProps({
|
|
59
61
|
role: interactive ? "button" : void 0,
|
|
60
62
|
tabIndex: interactive ? 0 : void 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/card.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport {\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type SyntheticEvent,\n useCallback,\n useId,\n useMemo,\n} from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport {\n PipeCatalogCardContext,\n type PipeCatalogCardContextValue,\n} from \"../../../context/pipe-catalog-card-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { PipeCardData } from \"../../../types/catalog-adapters.js\";\nimport {\n CatalogCardDescription,\n CatalogCardHeader,\n CatalogCardTitle,\n} from \"../../defaults/catalog/card-primitives.js\";\n\nexport interface PipeCatalogCardState {\n selected: boolean;\n expanded: boolean;\n}\n\nexport interface PipeCatalogCardProps\n extends useRender.ComponentProps<\"div\", PipeCatalogCardState> {\n card: PipeCardData;\n index?: number;\n selected?: boolean;\n /** Overrides the default click handler that fires `onSelectCard`. */\n onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n}\n\nconst DEFAULT_BODY = (\n <CatalogCardHeader>\n <CatalogCardTitle />\n <CatalogCardDescription />\n </CatalogCardHeader>\n);\n\nexport const PipeCatalogCard = forwardRef<HTMLDivElement, PipeCatalogCardProps>(\n function PipeCatalogCard(\n { card, index = 0, selected = false, render, onClick, className, ...rest },\n ref,\n ) {\n const { onSelectCard, expandedCardId, setExpandedCardId } = usePipeCatalogContext();\n const { classNames, components } = useCatalogConfig();\n const instanceId = useId();\n const expanded = expandedCardId === instanceId;\n\n const setExpanded = useCallback(\n (open: boolean) => {\n setExpandedCardId(open ? instanceId : null);\n },\n [instanceId, setExpandedCardId],\n );\n\n const onSelect = useCallback(\n (e: SyntheticEvent) => {\n onSelectCard?.(card, e);\n },\n [onSelectCard, card],\n );\n\n const contextValue = useMemo<PipeCatalogCardContextValue>(\n () => ({ card, index, selected, expanded, onSelect, setExpanded }),\n [card, index, selected, expanded, onSelect, setExpanded],\n );\n\n const interactive = !!(onClick || onSelectCard);\n const handleClick = onClick\n ? onClick\n : onSelectCard\n ? (e: MouseEvent<HTMLDivElement>) => onSelect(e)\n : undefined;\n const handleKeyDown = interactive\n ? (e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n if (onClick) onClick(e as unknown as MouseEvent<HTMLDivElement>);\n else onSelect(e);\n }\n }\n : undefined;\n\n const isUsingDefaultBody = !render;\n\n const Card = components?.Card;\n\n const element = useRender({\n ref,\n defaultTagName: \"div\",\n render,\n state: { selected, expanded },\n props: mergeProps<\"div\">(\n {\n role: interactive ? \"button\" : undefined,\n tabIndex: interactive ? 0 : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n className: cn(\n \"pz:flex pz:flex-col\",\n isUsingDefaultBody &&\n \"pz:rounded-md pz:border pz:border-input pz:bg-card pz:px-3 pz:py-2.5 pz:transition-colors\",\n isUsingDefaultBody && interactive && \"pz:hover:bg-muted/40\",\n interactive && \"pz:cursor-pointer\",\n classNames?.card,\n className,\n ),\n ...(isUsingDefaultBody ? { children: DEFAULT_BODY } : {}),\n ...({ \"data-p0\": \"catalog-card\" } as Record<string, string>),\n },\n rest as Record<string, unknown>,\n ),\n });\n\n if (Card) {\n return (\n <PipeCatalogCardContext.Provider value={contextValue}>\n <Card>{DEFAULT_BODY}</Card>\n </PipeCatalogCardContext.Provider>\n );\n }\n\n return (\n <PipeCatalogCardContext.Provider value={contextValue}>\n {element}\n </PipeCatalogCardContext.Provider>\n );\n },\n);\n"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"card.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/card.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport {\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type SyntheticEvent,\n useCallback,\n useId,\n useMemo,\n} from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport {\n PipeCatalogCardContext,\n type PipeCatalogCardContextValue,\n} from \"../../../context/pipe-catalog-card-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { PipeCardData } from \"../../../types/catalog-adapters.js\";\nimport {\n CatalogCardDescription,\n CatalogCardHeader,\n CatalogCardTitle,\n} from \"../../defaults/catalog/card-primitives.js\";\n\nexport interface PipeCatalogCardState {\n selected: boolean;\n expanded: boolean;\n setExpanded: (open: boolean) => void;\n}\n\nexport interface PipeCatalogCardProps\n extends useRender.ComponentProps<\"div\", PipeCatalogCardState> {\n card: PipeCardData;\n index?: number;\n selected?: boolean;\n /** Overrides the default click handler that fires `onSelectCard`. */\n onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n}\n\nconst DEFAULT_BODY = (\n <CatalogCardHeader>\n <CatalogCardTitle />\n <CatalogCardDescription />\n </CatalogCardHeader>\n);\n\nexport const PipeCatalogCard = forwardRef<HTMLDivElement, PipeCatalogCardProps>(\n function PipeCatalogCard(\n { card, index = 0, selected = false, render, onClick, className, ...rest },\n ref,\n ) {\n const { onSelectCard, expandedCardId, setExpandedCardId } = usePipeCatalogContext();\n const { classNames, components } = useCatalogConfig();\n const instanceId = useId();\n const expanded = expandedCardId === instanceId;\n\n const setExpanded = useCallback(\n (open: boolean) => {\n setExpandedCardId(open ? instanceId : null);\n },\n [instanceId, setExpandedCardId],\n );\n\n const onSelect = useCallback(\n (e: SyntheticEvent) => {\n onSelectCard?.(card, e);\n },\n [onSelectCard, card],\n );\n\n const contextValue = useMemo<PipeCatalogCardContextValue>(\n () => ({ card, index, selected, expanded, onSelect, setExpanded }),\n [card, index, selected, expanded, onSelect, setExpanded],\n );\n\n const interactive = !!(onClick || onSelectCard);\n const handleClick = onClick\n ? onClick\n : onSelectCard\n ? (e: MouseEvent<HTMLDivElement>) => onSelect(e)\n : undefined;\n const handleKeyDown = interactive\n ? (e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n if (onClick) onClick(e as unknown as MouseEvent<HTMLDivElement>);\n else onSelect(e);\n }\n }\n : undefined;\n\n const isUsingDefaultBody = !render;\n\n const Card = components?.Card;\n\n const element = useRender({\n ref,\n defaultTagName: \"div\",\n render,\n state: { selected, expanded, setExpanded },\n stateAttributesMapping: {\n setExpanded: () => null,\n },\n props: mergeProps<\"div\">(\n {\n role: interactive ? \"button\" : undefined,\n tabIndex: interactive ? 0 : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n className: cn(\n \"pz:flex pz:flex-col\",\n isUsingDefaultBody &&\n \"pz:rounded-md pz:border pz:border-input pz:bg-card pz:px-3 pz:py-2.5 pz:transition-colors\",\n isUsingDefaultBody && interactive && \"pz:hover:bg-muted/40\",\n interactive && \"pz:cursor-pointer\",\n classNames?.card,\n className,\n ),\n ...(isUsingDefaultBody ? { children: DEFAULT_BODY } : {}),\n ...({ \"data-p0\": \"catalog-card\" } as Record<string, string>),\n },\n rest as Record<string, unknown>,\n ),\n });\n\n if (Card) {\n return (\n <PipeCatalogCardContext.Provider value={contextValue}>\n <Card>{DEFAULT_BODY}</Card>\n </PipeCatalogCardContext.Provider>\n );\n }\n\n return (\n <PipeCatalogCardContext.Provider value={contextValue}>\n {element}\n </PipeCatalogCardContext.Provider>\n );\n },\n);\n"],"mappings":";;;;;;;;;;;AAwCA,MAAM,eACJ,qBAAC,mBAAD,aACE,oBAAC,kBAAD,EAAoB,GACpB,oBAAC,wBAAD,EAA0B,EACR;AAGtB,MAAa,kBAAkB,WAC7B,SAAS,gBACP,EAAE,MAAM,QAAQ,GAAG,WAAW,OAAO,QAAQ,SAAS,WAAW,GAAG,QACpE,KACA;CACA,MAAM,EAAE,cAAc,gBAAgB,sBAAsB,uBAAuB;CACnF,MAAM,EAAE,YAAY,eAAe,kBAAkB;CACrD,MAAM,aAAa,OAAO;CAC1B,MAAM,WAAW,mBAAmB;CAEpC,MAAM,cAAc,aACjB,SAAkB;AACjB,oBAAkB,OAAO,aAAa,KAAK;IAE7C,CAAC,YAAY,kBAAkB,CAChC;CAED,MAAM,WAAW,aACd,MAAsB;AACrB,iBAAe,MAAM,EAAE;IAEzB,CAAC,cAAc,KAAK,CACrB;CAED,MAAM,eAAe,eACZ;EAAE;EAAM;EAAO;EAAU;EAAU;EAAU;EAAa,GACjE;EAAC;EAAM;EAAO;EAAU;EAAU;EAAU;EAAY,CACzD;CAED,MAAM,cAAc,CAAC,EAAE,WAAW;CAClC,MAAM,cAAc,UAChB,UACA,gBACG,MAAkC,SAAS,EAAE,GAC9C;CACN,MAAM,gBAAgB,eACjB,MAAqC;AACpC,MAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,KAAE,gBAAgB;AAClB,OAAI,QAAS,SAAQ,EAA2C;OAC3D,UAAS,EAAE;;KAGpB;CAEJ,MAAM,qBAAqB,CAAC;CAE5B,MAAM,OAAO,YAAY;CAEzB,MAAM,UAAU,UAAU;EACxB;EACA,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAU;GAAU;GAAa;EAC1C,wBAAwB,EACtB,mBAAmB,MACpB;EACD,OAAO,WACL;GACE,MAAM,cAAc,WAAW;GAC/B,UAAU,cAAc,IAAI;GAC5B,SAAS;GACT,WAAW;GACX,WAAW,GACT,uBACA,sBACE,6FACF,sBAAsB,eAAe,wBACrC,eAAe,qBACf,YAAY,MACZ,UACD;GACD,GAAI,qBAAqB,EAAE,UAAU,cAAc,GAAG,EAAE;GAClD,WAAW;GAClB,EACD,KACD;EACF,CAAC;AAEF,KAAI,KACF,QACE,oBAAC,uBAAuB,UAAxB;EAAiC,OAAO;YACtC,oBAAC,MAAD,YAAO,cAAoB;EACK;AAItC,QACE,oBAAC,uBAAuB,UAAxB;EAAiC,OAAO;YACrC;EAC+B;EAGvC"}
|
|
@@ -6,6 +6,10 @@ import { PipeCategory } from "@pipe0/base";
|
|
|
6
6
|
//#region src/components/compound/pipe-catalog/category-filter.d.ts
|
|
7
7
|
interface PipeCatalogCategoryFilterState {
|
|
8
8
|
value: PipeCategory | null;
|
|
9
|
+
setValue: (value: PipeCategory | null) => void;
|
|
10
|
+
options: ReadonlyArray<CategoryOption<PipeCategory>>;
|
|
11
|
+
counts: Partial<Record<PipeCategory, number>>;
|
|
12
|
+
totalCount: number;
|
|
9
13
|
isActive: boolean;
|
|
10
14
|
}
|
|
11
15
|
interface PipeCatalogCategoryFilterProps extends useRender.ComponentProps<"div", PipeCatalogCategoryFilterState> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"category-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/category-filter.tsx"],"mappings":";;;;;;UA4CiB,8BAAA;EACf,KAAA,EAAO,YAAA;EACP,QAAA;AAAA;AAAA,UAGe,8BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,8BAAA
|
|
1
|
+
{"version":3,"file":"category-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/category-filter.tsx"],"mappings":";;;;;;UA4CiB,8BAAA;EACf,KAAA,EAAO,YAAA;EACP,QAAA,GAAW,KAAA,EAAO,YAAA;EAClB,OAAA,EAAS,aAAA,CAAc,cAAA,CAAe,YAAA;EACtC,MAAA,EAAQ,OAAA,CAAQ,MAAA,CAAO,YAAA;EACvB,UAAA;EACA,QAAA;AAAA;AAAA,UAGe,8BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,8BAAA;EAPjB;EASvB,OAAA,GAAU,aAAA,CAAc,cAAA,CAAe,YAAA;AAAA;AAAA,iBAGzB,yBAAA,CAAA;EACd,OAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,8BAAA,GAA8B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -29,12 +29,22 @@ const DEFAULT_OPTIONS = [{
|
|
|
29
29
|
function PipeCatalogCategoryFilter({ options = DEFAULT_OPTIONS, className, render, ...props }) {
|
|
30
30
|
const ctx = usePipeCatalogContext();
|
|
31
31
|
const value = ctx.category;
|
|
32
|
+
const isActive = value !== null;
|
|
32
33
|
const element = useRender({
|
|
33
34
|
defaultTagName: "div",
|
|
34
35
|
render,
|
|
35
36
|
state: {
|
|
36
37
|
value,
|
|
37
|
-
|
|
38
|
+
setValue: ctx.setCategory,
|
|
39
|
+
options,
|
|
40
|
+
counts: ctx.baselineCategoryCounts,
|
|
41
|
+
totalCount: ctx.baselineCardCount,
|
|
42
|
+
isActive
|
|
43
|
+
},
|
|
44
|
+
stateAttributesMapping: {
|
|
45
|
+
setValue: () => null,
|
|
46
|
+
options: () => null,
|
|
47
|
+
counts: () => null
|
|
38
48
|
},
|
|
39
49
|
props: mergeProps({
|
|
40
50
|
className,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"category-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/category-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { getPipeCategoryEntries, type PipeCategory } from \"@pipe0/base\";\nimport {\n Building2,\n Database,\n Hammer,\n Plug,\n ScanFace,\n Search as SearchIcon,\n Users,\n X,\n Zap,\n} from \"lucide-react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport {\n type CategoryOption,\n DefaultCategoryFilter,\n} from \"../../defaults/catalog/category-filter.js\";\n\nconst PIPE_CATEGORY_ICONS: Record<PipeCategory, CategoryOption<PipeCategory>[\"icon\"]> = {\n people_data: ScanFace,\n company_data: Building2,\n find_people: Users,\n find_comapnies: SearchIcon,\n tools: Hammer,\n actions: Zap,\n integrations: Plug,\n deprecated: X,\n};\n\nconst DEFAULT_OPTIONS: ReadonlyArray<CategoryOption<PipeCategory>> = [\n { id: null, label: \"All\", icon: Database },\n ...[...getPipeCategoryEntries()]\n .sort((a, b) => a.order - b.order)\n .map(\n (entry): CategoryOption<PipeCategory> => ({\n id: entry.id,\n label: entry.label,\n icon: PIPE_CATEGORY_ICONS[entry.id],\n }),\n ),\n];\n\nexport interface PipeCatalogCategoryFilterState {\n value: PipeCategory | null;\n isActive: boolean;\n}\n\nexport interface PipeCatalogCategoryFilterProps\n extends useRender.ComponentProps<\"div\", PipeCatalogCategoryFilterState> {\n /** Override the default category options. */\n options?: ReadonlyArray<CategoryOption<PipeCategory>>;\n}\n\nexport function PipeCatalogCategoryFilter({\n options = DEFAULT_OPTIONS,\n className,\n render,\n ...props\n}: PipeCatalogCategoryFilterProps) {\n const ctx = usePipeCatalogContext();\n const value = ctx.category;\n const isActive = value !== null;\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: {
|
|
1
|
+
{"version":3,"file":"category-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/category-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { getPipeCategoryEntries, type PipeCategory } from \"@pipe0/base\";\nimport {\n Building2,\n Database,\n Hammer,\n Plug,\n ScanFace,\n Search as SearchIcon,\n Users,\n X,\n Zap,\n} from \"lucide-react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport {\n type CategoryOption,\n DefaultCategoryFilter,\n} from \"../../defaults/catalog/category-filter.js\";\n\nconst PIPE_CATEGORY_ICONS: Record<PipeCategory, CategoryOption<PipeCategory>[\"icon\"]> = {\n people_data: ScanFace,\n company_data: Building2,\n find_people: Users,\n find_comapnies: SearchIcon,\n tools: Hammer,\n actions: Zap,\n integrations: Plug,\n deprecated: X,\n};\n\nconst DEFAULT_OPTIONS: ReadonlyArray<CategoryOption<PipeCategory>> = [\n { id: null, label: \"All\", icon: Database },\n ...[...getPipeCategoryEntries()]\n .sort((a, b) => a.order - b.order)\n .map(\n (entry): CategoryOption<PipeCategory> => ({\n id: entry.id,\n label: entry.label,\n icon: PIPE_CATEGORY_ICONS[entry.id],\n }),\n ),\n];\n\nexport interface PipeCatalogCategoryFilterState {\n value: PipeCategory | null;\n setValue: (value: PipeCategory | null) => void;\n options: ReadonlyArray<CategoryOption<PipeCategory>>;\n counts: Partial<Record<PipeCategory, number>>;\n totalCount: number;\n isActive: boolean;\n}\n\nexport interface PipeCatalogCategoryFilterProps\n extends useRender.ComponentProps<\"div\", PipeCatalogCategoryFilterState> {\n /** Override the default category options. */\n options?: ReadonlyArray<CategoryOption<PipeCategory>>;\n}\n\nexport function PipeCatalogCategoryFilter({\n options = DEFAULT_OPTIONS,\n className,\n render,\n ...props\n}: PipeCatalogCategoryFilterProps) {\n const ctx = usePipeCatalogContext();\n const value = ctx.category;\n const isActive = value !== null;\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: {\n value,\n setValue: ctx.setCategory,\n options,\n counts: ctx.baselineCategoryCounts,\n totalCount: ctx.baselineCardCount,\n isActive,\n },\n stateAttributesMapping: {\n setValue: () => null,\n options: () => null,\n counts: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className,\n ...({ \"data-p0\": \"catalog-category-filter\" } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (render) return element;\n\n return (\n <DefaultCategoryFilter\n options={options}\n value={ctx.category}\n onChange={ctx.setCategory}\n className={className}\n />\n );\n}\n"],"mappings":";;;;;;;;;AAoBA,MAAM,sBAAkF;CACtF,aAAa;CACb,cAAc;CACd,aAAa;CACb,gBAAgBA;CAChB,OAAO;CACP,SAAS;CACT,cAAc;CACd,YAAY;CACb;AAED,MAAM,kBAA+D,CACnE;CAAE,IAAI;CAAM,OAAO;CAAO,MAAM;CAAU,EAC1C,GAAG,CAAC,GAAG,wBAAwB,CAAC,CAC7B,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM,CACjC,KACE,WAAyC;CACxC,IAAI,MAAM;CACV,OAAO,MAAM;CACb,MAAM,oBAAoB,MAAM;CACjC,EACF,CACJ;AAiBD,SAAgB,0BAA0B,EACxC,UAAU,iBACV,WACA,QACA,GAAG,SAC8B;CACjC,MAAM,MAAM,uBAAuB;CACnC,MAAM,QAAQ,IAAI;CAClB,MAAM,WAAW,UAAU;CAE3B,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GACL;GACA,UAAU,IAAI;GACd;GACA,QAAQ,IAAI;GACZ,YAAY,IAAI;GAChB;GACD;EACD,wBAAwB;GACtB,gBAAgB;GAChB,eAAe;GACf,cAAc;GACf;EACD,OAAO,WACL;GACE;GACM,WAAW;GAClB,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,oBAAC,uBAAD;EACW;EACT,OAAO,IAAI;EACX,UAAU,IAAI;EACH;EACX"}
|
|
@@ -7,6 +7,8 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
|
7
7
|
type PipeColumnFilterId = "inputFields" | "outputFields" | "providers" | "tags";
|
|
8
8
|
interface ColumnFilterState {
|
|
9
9
|
value: string;
|
|
10
|
+
setValue: (value: string | null) => void;
|
|
11
|
+
options: ReadonlyArray<FilterSelectOption>;
|
|
10
12
|
isActive: boolean;
|
|
11
13
|
}
|
|
12
14
|
interface PipeCatalogColumnFilterProps extends useRender.ComponentProps<"div", ColumnFilterState> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"column-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"mappings":";;;;;;KASY,kBAAA;AAAA,UAEK,iBAAA;EACf,KAAA;EACA,QAAA;AAAA;AAAA,UAGe,4BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,iBAAA;EACxC,EAAA,EAAI,kBAAA;EACJ,WAAA,GAAc,SAAA;EACd,OAAA,GAAU,aAAA,CAAc,kBAAA;AAAA
|
|
1
|
+
{"version":3,"file":"column-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"mappings":";;;;;;KASY,kBAAA;AAAA,UAEK,iBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,OAAA,EAAS,aAAA,CAAc,kBAAA;EACvB,QAAA;AAAA;AAAA,UAGe,4BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,iBAAA;EACxC,EAAA,EAAI,kBAAA;EACJ,WAAA,GAAc,SAAA;EACd,OAAA,GAAU,aAAA,CAAc,kBAAA;AAAA;;;;;;iBA8BV,uBAAA,CAAA;EACd,EAAA;EACA,WAAA;EACA,OAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,4BAAA,GAA4B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -44,8 +44,14 @@ function PipeCatalogColumnFilter({ id, placeholder, options, className, render,
|
|
|
44
44
|
render,
|
|
45
45
|
state: {
|
|
46
46
|
value,
|
|
47
|
+
setValue,
|
|
48
|
+
options: resolvedOptions,
|
|
47
49
|
isActive: !!value
|
|
48
50
|
},
|
|
51
|
+
stateAttributesMapping: {
|
|
52
|
+
setValue: () => null,
|
|
53
|
+
options: () => null
|
|
54
|
+
},
|
|
49
55
|
props: mergeProps({
|
|
50
56
|
className,
|
|
51
57
|
"data-p0": `catalog-column-filter-${id}`
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"column-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport {\n DefaultFilterSelect,\n type FilterSelectOption,\n} from \"../../defaults/catalog/filter-select.js\";\n\nexport type PipeColumnFilterId = \"inputFields\" | \"outputFields\" | \"providers\" | \"tags\";\n\nexport interface ColumnFilterState {\n value: string;\n isActive: boolean;\n}\n\nexport interface PipeCatalogColumnFilterProps\n extends useRender.ComponentProps<\"div\", ColumnFilterState> {\n id: PipeColumnFilterId;\n placeholder?: ReactNode;\n options?: ReadonlyArray<FilterSelectOption>;\n}\n\nfunction getDefaultOptions(\n id: PipeColumnFilterId,\n ctx: ReturnType<typeof usePipeCatalogContext>,\n): FilterSelectOption[] {\n let entries: ReadonlyArray<readonly [string, unknown]> = [];\n switch (id) {\n case \"inputFields\":\n entries = ctx.sortedInputFieldEntries;\n break;\n case \"outputFields\":\n entries = ctx.sortedOutputFieldEntries;\n break;\n case \"providers\":\n entries = ctx.sortedProviderEntries;\n break;\n case \"tags\":\n entries = ctx.sortedTagEntries;\n break;\n }\n return entries.map(([name]) => ({ label: name, value: name }));\n}\n\n/**\n * Generic column-filter escape hatch. For built-in filters prefer the specific\n * components: `<PipeCatalogInputFieldFilter>`, `<PipeCatalogOutputFieldFilter>`,\n * `<PipeCatalogProviderFilter>`, `<PipeCatalogTagFilter>`.\n */\nexport function PipeCatalogColumnFilter({\n id,\n placeholder,\n options,\n className,\n render,\n ...props\n}: PipeCatalogColumnFilterProps) {\n const ctx = usePipeCatalogContext();\n const value = ctx.getColumnFilterValue(id) || \"\";\n const resolvedOptions = options ?? getDefaultOptions(id, ctx);\n const setValue = (v: string | null) => {\n if (v == null) ctx.removeColumnFilter(id);\n else ctx.addColumnFilter(id, v);\n };\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: { value, isActive: !!value },\n props: mergeProps<\"div\">(\n {\n className,\n ...({ \"data-p0\": `catalog-column-filter-${id}` } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (render) return element;\n\n return (\n <DefaultFilterSelect\n placeholder={placeholder}\n value={value}\n onChange={setValue}\n options={resolvedOptions}\n className={className}\n />\n );\n}\n"],"mappings":";;;;;;;
|
|
1
|
+
{"version":3,"file":"column-filter.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/column-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { ReactNode } from \"react\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport {\n DefaultFilterSelect,\n type FilterSelectOption,\n} from \"../../defaults/catalog/filter-select.js\";\n\nexport type PipeColumnFilterId = \"inputFields\" | \"outputFields\" | \"providers\" | \"tags\";\n\nexport interface ColumnFilterState {\n value: string;\n setValue: (value: string | null) => void;\n options: ReadonlyArray<FilterSelectOption>;\n isActive: boolean;\n}\n\nexport interface PipeCatalogColumnFilterProps\n extends useRender.ComponentProps<\"div\", ColumnFilterState> {\n id: PipeColumnFilterId;\n placeholder?: ReactNode;\n options?: ReadonlyArray<FilterSelectOption>;\n}\n\nfunction getDefaultOptions(\n id: PipeColumnFilterId,\n ctx: ReturnType<typeof usePipeCatalogContext>,\n): FilterSelectOption[] {\n let entries: ReadonlyArray<readonly [string, unknown]> = [];\n switch (id) {\n case \"inputFields\":\n entries = ctx.sortedInputFieldEntries;\n break;\n case \"outputFields\":\n entries = ctx.sortedOutputFieldEntries;\n break;\n case \"providers\":\n entries = ctx.sortedProviderEntries;\n break;\n case \"tags\":\n entries = ctx.sortedTagEntries;\n break;\n }\n return entries.map(([name]) => ({ label: name, value: name }));\n}\n\n/**\n * Generic column-filter escape hatch. For built-in filters prefer the specific\n * components: `<PipeCatalogInputFieldFilter>`, `<PipeCatalogOutputFieldFilter>`,\n * `<PipeCatalogProviderFilter>`, `<PipeCatalogTagFilter>`.\n */\nexport function PipeCatalogColumnFilter({\n id,\n placeholder,\n options,\n className,\n render,\n ...props\n}: PipeCatalogColumnFilterProps) {\n const ctx = usePipeCatalogContext();\n const value = ctx.getColumnFilterValue(id) || \"\";\n const resolvedOptions = options ?? getDefaultOptions(id, ctx);\n const setValue = (v: string | null) => {\n if (v == null) ctx.removeColumnFilter(id);\n else ctx.addColumnFilter(id, v);\n };\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: { value, setValue, options: resolvedOptions, isActive: !!value },\n stateAttributesMapping: {\n setValue: () => null,\n options: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className,\n ...({ \"data-p0\": `catalog-column-filter-${id}` } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (render) return element;\n\n return (\n <DefaultFilterSelect\n placeholder={placeholder}\n value={value}\n onChange={setValue}\n options={resolvedOptions}\n className={className}\n />\n );\n}\n"],"mappings":";;;;;;;AAyBA,SAAS,kBACP,IACA,KACsB;CACtB,IAAI,UAAqD,EAAE;AAC3D,SAAQ,IAAR;EACE,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;EACF,KAAK;AACH,aAAU,IAAI;AACd;;AAEJ,QAAO,QAAQ,KAAK,CAAC,WAAW;EAAE,OAAO;EAAM,OAAO;EAAM,EAAE;;;;;;;AAQhE,SAAgB,wBAAwB,EACtC,IACA,aACA,SACA,WACA,QACA,GAAG,SAC4B;CAC/B,MAAM,MAAM,uBAAuB;CACnC,MAAM,QAAQ,IAAI,qBAAqB,GAAG,IAAI;CAC9C,MAAM,kBAAkB,WAAW,kBAAkB,IAAI,IAAI;CAC7D,MAAM,YAAY,MAAqB;AACrC,MAAI,KAAK,KAAM,KAAI,mBAAmB,GAAG;MACpC,KAAI,gBAAgB,IAAI,EAAE;;CAGjC,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAO;GAAU,SAAS;GAAiB,UAAU,CAAC,CAAC;GAAO;EACvE,wBAAwB;GACtB,gBAAgB;GAChB,eAAe;GAChB;EACD,OAAO,WACL;GACE;GACM,WAAW,yBAAyB;GAC3C,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,oBAAC,qBAAD;EACe;EACN;EACP,UAAU;EACV,SAAS;EACE;EACX"}
|
|
@@ -1,8 +1,10 @@
|
|
|
1
|
+
import { PipeCardData } from "../../../types/catalog-adapters.mjs";
|
|
1
2
|
import { useRender } from "@base-ui/react/use-render";
|
|
2
3
|
import * as _$react from "react";
|
|
3
4
|
|
|
4
5
|
//#region src/components/compound/pipe-catalog/list.d.ts
|
|
5
6
|
interface PipeCatalogListState {
|
|
7
|
+
cards: ReadonlyArray<PipeCardData>;
|
|
6
8
|
isEmpty: boolean;
|
|
7
9
|
}
|
|
8
10
|
interface PipeCatalogListProps extends useRender.ComponentProps<"div", PipeCatalogListState> {}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"list.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"mappings":";;;;;UAOiB,oBAAA;EACf,KAAA,EAAO,aAAA,CAAc,YAAA;EACrB,OAAA;AAAA;AAAA,UAGe,oBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,oBAAA;AAAA,iBAE1B,eAAA,CAAA;EAAkB,MAAA;EAAQ,SAAA;EAAW,QAAA;EAAA,GAAa;AAAA,GAAS,oBAAA,GAAoB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}
|
|
@@ -13,7 +13,11 @@ function PipeCatalogList({ render, className, children, ...props }) {
|
|
|
13
13
|
const element = useRender({
|
|
14
14
|
defaultTagName: "div",
|
|
15
15
|
render,
|
|
16
|
-
state: {
|
|
16
|
+
state: {
|
|
17
|
+
cards,
|
|
18
|
+
isEmpty
|
|
19
|
+
},
|
|
20
|
+
stateAttributesMapping: { cards: () => null },
|
|
17
21
|
props: mergeProps({
|
|
18
22
|
className: cn("pz:flex pz:flex-col pz:gap-2", className),
|
|
19
23
|
children: children ?? defaultBody,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"list.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { PipeCatalogCard } from \"./card.js\";\n\nexport interface PipeCatalogListState {\n isEmpty: boolean;\n}\n\nexport interface PipeCatalogListProps\n extends useRender.ComponentProps<\"div\", PipeCatalogListState> {}\n\nexport function PipeCatalogList({ render, className, children, ...props }: PipeCatalogListProps) {\n const { cards } = usePipeCatalogContext();\n const isEmpty = cards.length === 0;\n\n const defaultBody = cards.map((card) => <PipeCatalogCard key={card.pipeId} card={card} />);\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: { isEmpty },\n props: mergeProps<\"div\">(\n {\n className: cn(\"pz:flex pz:flex-col pz:gap-2\", className),\n children: children ?? defaultBody,\n ...({ \"data-p0\": \"catalog-list\" } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (isEmpty) return null;\n return element;\n}\n"],"mappings":";;;;;;;;
|
|
1
|
+
{"version":3,"file":"list.mjs","names":[],"sources":["../../../../src/components/compound/pipe-catalog/list.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { PipeCardData } from \"../../../types/catalog-adapters.js\";\nimport { PipeCatalogCard } from \"./card.js\";\n\nexport interface PipeCatalogListState {\n cards: ReadonlyArray<PipeCardData>;\n isEmpty: boolean;\n}\n\nexport interface PipeCatalogListProps\n extends useRender.ComponentProps<\"div\", PipeCatalogListState> {}\n\nexport function PipeCatalogList({ render, className, children, ...props }: PipeCatalogListProps) {\n const { cards } = usePipeCatalogContext();\n const isEmpty = cards.length === 0;\n\n const defaultBody = cards.map((card) => <PipeCatalogCard key={card.pipeId} card={card} />);\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: { cards, isEmpty },\n stateAttributesMapping: {\n cards: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className: cn(\"pz:flex pz:flex-col pz:gap-2\", className),\n children: children ?? defaultBody,\n ...({ \"data-p0\": \"catalog-list\" } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (isEmpty) return null;\n return element;\n}\n"],"mappings":";;;;;;;;AAeA,SAAgB,gBAAgB,EAAE,QAAQ,WAAW,UAAU,GAAG,SAA+B;CAC/F,MAAM,EAAE,UAAU,uBAAuB;CACzC,MAAM,UAAU,MAAM,WAAW;CAEjC,MAAM,cAAc,MAAM,KAAK,SAAS,oBAAC,iBAAD,EAAyC,MAAQ,EAA3B,KAAK,OAAsB,CAAC;CAE1F,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAO;GAAS;EACzB,wBAAwB,EACtB,aAAa,MACd;EACD,OAAO,WACL;GACE,WAAW,GAAG,gCAAgC,UAAU;GACxD,UAAU,YAAY;GAChB,WAAW;GAClB,EACD,MACD;EACF,CAAC;AAEF,KAAI,QAAS,QAAO;AACpB,QAAO"}
|
|
@@ -4,6 +4,7 @@ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
|
4
4
|
//#region src/components/compound/pipe-catalog/search-filter.d.ts
|
|
5
5
|
interface PipeCatalogSearchFilterState {
|
|
6
6
|
value: string;
|
|
7
|
+
setValue: (value: string) => void;
|
|
7
8
|
isActive: boolean;
|
|
8
9
|
}
|
|
9
10
|
interface PipeCatalogSearchFilterProps extends useRender.ComponentProps<"input", PipeCatalogSearchFilterState> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"mappings":";;;;UASiB,4BAAA;EACf,KAAA;EACA,QAAA;AAAA;AAAA,UAGe,4BAAA,SACP,SAAA,CAAU,cAAA,UAAwB,4BAAA;EAC1C,WAAA;AAAA;AAAA,iBAGc,uBAAA,CAAA;EACd,WAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,4BAAA,GAA4B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
1
|
+
{"version":3,"file":"search-filter.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"mappings":";;;;UASiB,4BAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,QAAA;AAAA;AAAA,UAGe,4BAAA,SACP,SAAA,CAAU,cAAA,UAAwB,4BAAA;EAC1C,WAAA;AAAA;AAAA,iBAGc,uBAAA,CAAA;EACd,WAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,4BAAA,GAA4B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -16,8 +16,10 @@ function PipeCatalogSearchFilter({ placeholder = "Search pipes...", className, r
|
|
|
16
16
|
render,
|
|
17
17
|
state: {
|
|
18
18
|
value: globalFilterInput,
|
|
19
|
+
setValue: setGlobalFilterInput,
|
|
19
20
|
isActive: !!globalFilterInput
|
|
20
21
|
},
|
|
22
|
+
stateAttributesMapping: { setValue: () => null },
|
|
21
23
|
props: mergeProps({
|
|
22
24
|
type: "search",
|
|
23
25
|
placeholder,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"search-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { Search as SearchIcon } from \"lucide-react\";\nimport type { ChangeEvent } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { Input } from \"../../ui/input.js\";\n\nexport interface PipeCatalogSearchFilterState {\n value: string;\n isActive: boolean;\n}\n\nexport interface PipeCatalogSearchFilterProps\n extends useRender.ComponentProps<\"input\", PipeCatalogSearchFilterState> {\n placeholder?: string;\n}\n\nexport function PipeCatalogSearchFilter({\n placeholder = \"Search pipes...\",\n className,\n render,\n ...props\n}: PipeCatalogSearchFilterProps) {\n const { globalFilterInput, setGlobalFilterInput } = usePipeCatalogContext();\n const { classNames } = useCatalogConfig();\n const isActive = !!globalFilterInput;\n\n const inputElement = useRender({\n defaultTagName: \"input\",\n render,\n state: { value: globalFilterInput, isActive },\n props: mergeProps<\"input\">(\n {\n type: \"search\",\n placeholder,\n value: globalFilterInput,\n onChange: (e: ChangeEvent<HTMLInputElement>) => setGlobalFilterInput(e.target.value),\n className: render ? cn(classNames?.searchInput, className) : undefined,\n },\n props,\n ),\n });\n\n if (render) return inputElement;\n\n return (\n <div data-p0=\"catalog-search\" className={cn(\"pz:relative\", classNames?.searchInputContainer)}>\n <SearchIcon className=\"pz:absolute pz:left-2.5 pz:top-1/2 pz:-translate-y-1/2 pz:size-4 pz:text-muted-foreground pz:pointer-events-none\" />\n <Input\n type=\"search\"\n placeholder={placeholder}\n value={globalFilterInput}\n onChange={(e) => setGlobalFilterInput(e.target.value)}\n className={cn(\"pz:pl-8\", classNames?.searchInput, className)}\n />\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"search-filter.mjs","names":["SearchIcon"],"sources":["../../../../src/components/compound/pipe-catalog/search-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { Search as SearchIcon } from \"lucide-react\";\nimport type { ChangeEvent } from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport { usePipeCatalogContext } from \"../../../context/pipe-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport { Input } from \"../../ui/input.js\";\n\nexport interface PipeCatalogSearchFilterState {\n value: string;\n setValue: (value: string) => void;\n isActive: boolean;\n}\n\nexport interface PipeCatalogSearchFilterProps\n extends useRender.ComponentProps<\"input\", PipeCatalogSearchFilterState> {\n placeholder?: string;\n}\n\nexport function PipeCatalogSearchFilter({\n placeholder = \"Search pipes...\",\n className,\n render,\n ...props\n}: PipeCatalogSearchFilterProps) {\n const { globalFilterInput, setGlobalFilterInput } = usePipeCatalogContext();\n const { classNames } = useCatalogConfig();\n const isActive = !!globalFilterInput;\n\n const inputElement = useRender({\n defaultTagName: \"input\",\n render,\n state: { value: globalFilterInput, setValue: setGlobalFilterInput, isActive },\n stateAttributesMapping: {\n setValue: () => null,\n },\n props: mergeProps<\"input\">(\n {\n type: \"search\",\n placeholder,\n value: globalFilterInput,\n onChange: (e: ChangeEvent<HTMLInputElement>) => setGlobalFilterInput(e.target.value),\n className: render ? cn(classNames?.searchInput, className) : undefined,\n },\n props,\n ),\n });\n\n if (render) return inputElement;\n\n return (\n <div data-p0=\"catalog-search\" className={cn(\"pz:relative\", classNames?.searchInputContainer)}>\n <SearchIcon className=\"pz:absolute pz:left-2.5 pz:top-1/2 pz:-translate-y-1/2 pz:size-4 pz:text-muted-foreground pz:pointer-events-none\" />\n <Input\n type=\"search\"\n placeholder={placeholder}\n value={globalFilterInput}\n onChange={(e) => setGlobalFilterInput(e.target.value)}\n className={cn(\"pz:pl-8\", classNames?.searchInput, className)}\n />\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;AAoBA,SAAgB,wBAAwB,EACtC,cAAc,mBACd,WACA,QACA,GAAG,SAC4B;CAC/B,MAAM,EAAE,mBAAmB,yBAAyB,uBAAuB;CAC3E,MAAM,EAAE,eAAe,kBAAkB;CAGzC,MAAM,eAAe,UAAU;EAC7B,gBAAgB;EAChB;EACA,OAAO;GAAE,OAAO;GAAmB,UAAU;GAAsB,UALpD,CAAC,CAAC;GAK4D;EAC7E,wBAAwB,EACtB,gBAAgB,MACjB;EACD,OAAO,WACL;GACE,MAAM;GACN;GACA,OAAO;GACP,WAAW,MAAqC,qBAAqB,EAAE,OAAO,MAAM;GACpF,WAAW,SAAS,GAAG,YAAY,aAAa,UAAU,GAAG;GAC9D,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,qBAAC,OAAD;EAAK,WAAQ;EAAiB,WAAW,GAAG,eAAe,YAAY,qBAAqB;YAA5F,CACE,oBAACA,QAAD,EAAY,WAAU,oHAAqH,GAC3I,oBAAC,OAAD;GACE,MAAK;GACQ;GACb,OAAO;GACP,WAAW,MAAM,qBAAqB,EAAE,OAAO,MAAM;GACrD,WAAW,GAAG,WAAW,YAAY,aAAa,UAAU;GAC5D,EACE"}
|
|
@@ -1,10 +1,12 @@
|
|
|
1
|
-
import { FormHandle } from "../../../types/form-handle.mjs";
|
|
1
|
+
import { FormHandle, FormSectionHandle } from "../../../types/form-handle.mjs";
|
|
2
2
|
import { useRender } from "@base-ui/react/use-render";
|
|
3
3
|
import * as _$react from "react";
|
|
4
4
|
import { PipePayload } from "@pipe0/base";
|
|
5
5
|
|
|
6
6
|
//#region src/components/compound/pipe-form/content.d.ts
|
|
7
7
|
interface PipeFormContentState {
|
|
8
|
+
sections: FormSectionHandle[];
|
|
9
|
+
fieldPaths: Set<string>;
|
|
8
10
|
hasFieldLoaderError: boolean;
|
|
9
11
|
isFieldLoaderLoading: boolean;
|
|
10
12
|
form: FormHandle<PipePayload>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"content.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-form/content.tsx"],"mappings":";;;;;;UAQiB,oBAAA;EACf,mBAAA;EACA,oBAAA;EACA,IAAA,EAAM,UAAA,CAAW,WAAA;AAAA;AAAA,UAGF,oBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,oBAAA;AAAA,iBAE1B,eAAA,CAAA;EAAkB,QAAA;EAAU,SAAA;EAAW,MAAA;EAAA,GAAW;AAAA,GAAS,oBAAA,GAAoB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}
|
|
1
|
+
{"version":3,"file":"content.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-form/content.tsx"],"mappings":";;;;;;UAQiB,oBAAA;EACf,QAAA,EAAU,iBAAA;EACV,UAAA,EAAY,GAAA;EACZ,mBAAA;EACA,oBAAA;EACA,IAAA,EAAM,UAAA,CAAW,WAAA;AAAA;AAAA,UAGF,oBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,oBAAA;AAAA,iBAE1B,eAAA,CAAA;EAAkB,QAAA;EAAU,SAAA;EAAW,MAAA;EAAA,GAAW;AAAA,GAAS,oBAAA,GAAoB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}
|
|
@@ -7,7 +7,7 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
|
7
7
|
|
|
8
8
|
//#region src/components/compound/pipe-form/content.tsx
|
|
9
9
|
function PipeFormContent({ children, className, render, ...props }) {
|
|
10
|
-
const { sections, hasFieldLoaderError, isFieldLoaderLoading, form } = usePipeFormContext();
|
|
10
|
+
const { sections, fieldPaths, hasFieldLoaderError, isFieldLoaderLoading, form } = usePipeFormContext();
|
|
11
11
|
const defaultBody = /* @__PURE__ */ jsxs(Fragment, { children: [sections.map((section, idx) => {
|
|
12
12
|
const prev = idx > 0 ? sections[idx - 1] : null;
|
|
13
13
|
return /* @__PURE__ */ jsx(PipeFormSection, {
|
|
@@ -19,11 +19,17 @@ function PipeFormContent({ children, className, render, ...props }) {
|
|
|
19
19
|
defaultTagName: "div",
|
|
20
20
|
render,
|
|
21
21
|
state: {
|
|
22
|
+
sections,
|
|
23
|
+
fieldPaths,
|
|
22
24
|
hasFieldLoaderError,
|
|
23
25
|
isFieldLoaderLoading,
|
|
24
26
|
form
|
|
25
27
|
},
|
|
26
|
-
stateAttributesMapping: {
|
|
28
|
+
stateAttributesMapping: {
|
|
29
|
+
sections: () => null,
|
|
30
|
+
fieldPaths: () => null,
|
|
31
|
+
form: () => null
|
|
32
|
+
},
|
|
27
33
|
props: mergeProps({
|
|
28
34
|
className,
|
|
29
35
|
children: children ?? defaultBody,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"content.mjs","names":[],"sources":["../../../../src/components/compound/pipe-form/content.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { PipePayload } from \"@pipe0/base\";\nimport { usePipeFormContext } from \"../../../context/pipe-form-context.js\";\nimport type { FormHandle } from \"../../../types/form-handle.js\";\nimport { PipeFormErrors } from \"./errors.js\";\nimport { PipeFormSection } from \"./section.js\";\n\nexport interface PipeFormContentState {\n hasFieldLoaderError: boolean;\n isFieldLoaderLoading: boolean;\n form: FormHandle<PipePayload>;\n}\n\nexport interface PipeFormContentProps\n extends useRender.ComponentProps<\"div\", PipeFormContentState> {}\n\nexport function PipeFormContent({ children, className, render, ...props }: PipeFormContentProps) {\n const { sections, hasFieldLoaderError, isFieldLoaderLoading, form }
|
|
1
|
+
{"version":3,"file":"content.mjs","names":[],"sources":["../../../../src/components/compound/pipe-form/content.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { PipePayload } from \"@pipe0/base\";\nimport { usePipeFormContext } from \"../../../context/pipe-form-context.js\";\nimport type { FormHandle, FormSectionHandle } from \"../../../types/form-handle.js\";\nimport { PipeFormErrors } from \"./errors.js\";\nimport { PipeFormSection } from \"./section.js\";\n\nexport interface PipeFormContentState {\n sections: FormSectionHandle[];\n fieldPaths: Set<string>;\n hasFieldLoaderError: boolean;\n isFieldLoaderLoading: boolean;\n form: FormHandle<PipePayload>;\n}\n\nexport interface PipeFormContentProps\n extends useRender.ComponentProps<\"div\", PipeFormContentState> {}\n\nexport function PipeFormContent({ children, className, render, ...props }: PipeFormContentProps) {\n const { sections, fieldPaths, hasFieldLoaderError, isFieldLoaderLoading, form } =\n usePipeFormContext();\n\n // Sections that share a label (e.g. several \"I/O & conditions\" sections)\n // render under one umbrella header. We hide the label on every section\n // except the first in each contiguous cluster.\n const defaultBody = (\n <>\n {sections.map((section, idx) => {\n const prev = idx > 0 ? sections[idx - 1] : null;\n const hideLabel = !!(section.label && prev && prev.label === section.label);\n return <PipeFormSection key={section.key} section={section} hideLabel={hideLabel} />;\n })}\n <PipeFormErrors />\n </>\n );\n\n return useRender({\n defaultTagName: \"div\",\n render,\n state: { sections, fieldPaths, hasFieldLoaderError, isFieldLoaderLoading, form },\n stateAttributesMapping: {\n sections: () => null,\n fieldPaths: () => null,\n form: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className,\n children: children ?? defaultBody,\n ...({ \"data-p0\": \"form-content\" } as Record<string, string>),\n },\n props,\n ),\n });\n}\n"],"mappings":";;;;;;;;AAmBA,SAAgB,gBAAgB,EAAE,UAAU,WAAW,QAAQ,GAAG,SAA+B;CAC/F,MAAM,EAAE,UAAU,YAAY,qBAAqB,sBAAsB,SACvE,oBAAoB;CAKtB,MAAM,cACJ,4CACG,SAAS,KAAK,SAAS,QAAQ;EAC9B,MAAM,OAAO,MAAM,IAAI,SAAS,MAAM,KAAK;AAE3C,SAAO,oBAAC,iBAAD;GAA4C;GAAS,WAD1C,CAAC,EAAE,QAAQ,SAAS,QAAQ,KAAK,UAAU,QAAQ;GACe,EAAvD,QAAQ,IAA+C;GACpF,EACF,oBAAC,gBAAD,EAAkB,EACjB;AAGL,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAU;GAAY;GAAqB;GAAsB;GAAM;EAChF,wBAAwB;GACtB,gBAAgB;GAChB,kBAAkB;GAClB,YAAY;GACb;EACD,OAAO,WACL;GACE;GACA,UAAU,YAAY;GAChB,WAAW;GAClB,EACD,MACD;EACF,CAAC"}
|
|
@@ -1,9 +1,13 @@
|
|
|
1
|
+
import { FormHandle } from "../../../types/form-handle.mjs";
|
|
1
2
|
import { useRender } from "@base-ui/react/use-render";
|
|
2
3
|
import * as _$react from "react";
|
|
4
|
+
import { PipePayload } from "@pipe0/base";
|
|
3
5
|
|
|
4
6
|
//#region src/components/compound/pipe-form/errors.d.ts
|
|
5
7
|
interface PipeFormErrorsState {
|
|
6
8
|
hasFieldLoaderError: boolean;
|
|
9
|
+
fieldPaths: Set<string>;
|
|
10
|
+
form: FormHandle<PipePayload>;
|
|
7
11
|
}
|
|
8
12
|
interface PipeFormErrorsProps extends useRender.ComponentProps<"div", PipeFormErrorsState> {}
|
|
9
13
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"errors.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-form/errors.tsx"],"mappings":"
|
|
1
|
+
{"version":3,"file":"errors.d.mts","names":[],"sources":["../../../../src/components/compound/pipe-form/errors.tsx"],"mappings":";;;;;;UAQiB,mBAAA;EACf,mBAAA;EACA,UAAA,EAAY,GAAA;EACZ,IAAA,EAAM,UAAA,CAAW,WAAA;AAAA;AAAA,UAGF,mBAAA,SAA4B,SAAA,CAAU,cAAA,QAAsB,mBAAA;;;;;;;iBAQ7D,cAAA,CAAA;EAAiB,QAAA;EAAU,SAAA;EAAW,MAAA;EAAA,GAAW;AAAA,GAAS,mBAAA,GAAmB,OAAA,CAAA,YAAA,mBAAA,OAAA,CAAA,qBAAA"}
|
|
@@ -26,7 +26,15 @@ function PipeFormErrors({ children, className, render, ...props }) {
|
|
|
26
26
|
return useRender({
|
|
27
27
|
defaultTagName: "div",
|
|
28
28
|
render,
|
|
29
|
-
state: {
|
|
29
|
+
state: {
|
|
30
|
+
hasFieldLoaderError,
|
|
31
|
+
fieldPaths,
|
|
32
|
+
form
|
|
33
|
+
},
|
|
34
|
+
stateAttributesMapping: {
|
|
35
|
+
fieldPaths: () => null,
|
|
36
|
+
form: () => null
|
|
37
|
+
},
|
|
30
38
|
props: mergeProps({
|
|
31
39
|
className,
|
|
32
40
|
children: children ?? defaultBody,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"errors.mjs","names":[],"sources":["../../../../src/components/compound/pipe-form/errors.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { usePipeFormContext } from \"../../../context/pipe-form-context.js\";\nimport { asInternalForm } from \"../../../utils/internal-form.js\";\nimport { FormLevelErrors } from \"../../internal/form-level-errors.js\";\n\nexport interface PipeFormErrorsState {\n hasFieldLoaderError: boolean;\n}\n\nexport interface PipeFormErrorsProps extends useRender.ComponentProps<\"div\", PipeFormErrorsState> {}\n\n/**\n * Renders form-wide errors that don't belong to a specific visible field:\n * the field-loader banner (when a resolver fails to load options for a\n * field) and form-level validation errors (errors not attached to any\n * rendered field).\n */\nexport function PipeFormErrors({ children, className, render, ...props }: PipeFormErrorsProps) {\n const { hasFieldLoaderError, fieldPaths, form } = usePipeFormContext();\n\n const defaultBody = (\n <>\n {hasFieldLoaderError && (\n <div\n data-p0=\"store-error\"\n role=\"alert\"\n className=\"pz:flex pz:flex-col pz:gap-1 pz:rounded-md pz:border pz:border-destructive/50 pz:bg-destructive/5 pz:px-3 pz:py-2 pz:text-destructive pz:text-xs pz:font-medium\"\n >\n <span>\n Failed to load options for one or more fields. Check that your connection is valid.\n </span>\n </div>\n )}\n <FormLevelErrors control={asInternalForm(form).control} fieldPaths={fieldPaths} />\n </>\n );\n\n return useRender({\n defaultTagName: \"div\",\n render,\n state: { hasFieldLoaderError },\n props: mergeProps<\"div\">(\n {\n className,\n children: children ?? defaultBody,\n ...({ \"data-p0\": \"form-errors\" } as Record<string, string>),\n },\n props,\n ),\n });\n}\n"],"mappings":";;;;;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"errors.mjs","names":[],"sources":["../../../../src/components/compound/pipe-form/errors.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport type { PipePayload } from \"@pipe0/base\";\nimport { usePipeFormContext } from \"../../../context/pipe-form-context.js\";\nimport type { FormHandle } from \"../../../types/form-handle.js\";\nimport { asInternalForm } from \"../../../utils/internal-form.js\";\nimport { FormLevelErrors } from \"../../internal/form-level-errors.js\";\n\nexport interface PipeFormErrorsState {\n hasFieldLoaderError: boolean;\n fieldPaths: Set<string>;\n form: FormHandle<PipePayload>;\n}\n\nexport interface PipeFormErrorsProps extends useRender.ComponentProps<\"div\", PipeFormErrorsState> {}\n\n/**\n * Renders form-wide errors that don't belong to a specific visible field:\n * the field-loader banner (when a resolver fails to load options for a\n * field) and form-level validation errors (errors not attached to any\n * rendered field).\n */\nexport function PipeFormErrors({ children, className, render, ...props }: PipeFormErrorsProps) {\n const { hasFieldLoaderError, fieldPaths, form } = usePipeFormContext();\n\n const defaultBody = (\n <>\n {hasFieldLoaderError && (\n <div\n data-p0=\"store-error\"\n role=\"alert\"\n className=\"pz:flex pz:flex-col pz:gap-1 pz:rounded-md pz:border pz:border-destructive/50 pz:bg-destructive/5 pz:px-3 pz:py-2 pz:text-destructive pz:text-xs pz:font-medium\"\n >\n <span>\n Failed to load options for one or more fields. Check that your connection is valid.\n </span>\n </div>\n )}\n <FormLevelErrors control={asInternalForm(form).control} fieldPaths={fieldPaths} />\n </>\n );\n\n return useRender({\n defaultTagName: \"div\",\n render,\n state: { hasFieldLoaderError, fieldPaths, form },\n stateAttributesMapping: {\n fieldPaths: () => null,\n form: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className,\n children: children ?? defaultBody,\n ...({ \"data-p0\": \"form-errors\" } as Record<string, string>),\n },\n props,\n ),\n });\n}\n"],"mappings":";;;;;;;;;;;;;;AAsBA,SAAgB,eAAe,EAAE,UAAU,WAAW,QAAQ,GAAG,SAA8B;CAC7F,MAAM,EAAE,qBAAqB,YAAY,SAAS,oBAAoB;CAEtE,MAAM,cACJ,4CACG,uBACC,oBAAC,OAAD;EACE,WAAQ;EACR,MAAK;EACL,WAAU;YAEV,oBAAC,QAAD,YAAM,uFAEC;EACH,GAER,oBAAC,iBAAD;EAAiB,SAAS,eAAe,KAAK,CAAC;EAAqB;EAAc,EACjF;AAGL,QAAO,UAAU;EACf,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAqB;GAAY;GAAM;EAChD,wBAAwB;GACtB,kBAAkB;GAClB,YAAY;GACb;EACD,OAAO,WACL;GACE;GACA,UAAU,YAAY;GAChB,WAAW;GAClB,EACD,MACD;EACF,CAAC"}
|
|
@@ -7,6 +7,7 @@ import { MouseEvent } from "react";
|
|
|
7
7
|
interface SearchCatalogCardState {
|
|
8
8
|
selected: boolean;
|
|
9
9
|
expanded: boolean;
|
|
10
|
+
setExpanded: (open: boolean) => void;
|
|
10
11
|
}
|
|
11
12
|
interface SearchCatalogCardProps extends useRender.ComponentProps<"div", SearchCatalogCardState> {
|
|
12
13
|
card: SearchCardData;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/card.tsx"],"mappings":";;;;;;UAyBiB,sBAAA;EACf,QAAA;EACA,QAAA;AAAA;AAAA,
|
|
1
|
+
{"version":3,"file":"card.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/card.tsx"],"mappings":";;;;;;UAyBiB,sBAAA;EACf,QAAA;EACA,QAAA;EACA,WAAA,GAAc,IAAA;AAAA;AAAA,UAGC,sBAAA,SACP,SAAA,CAAU,cAAA,QAAsB,sBAAA;EACxC,IAAA,EAAM,cAAA;EACN,KAAA;EACA,QAAA;EAPA;EASA,OAAA,IAAW,CAAA,EAAG,UAAA,CAAW,cAAA;AAAA;AAAA,cAUd,iBAAA,EAAiB,OAAA,CAAA,yBAAA,CAAA,IAAA,CAAA,sBAAA,WAAA,OAAA,CAAA,aAAA,CAAA,cAAA"}
|
|
@@ -53,8 +53,10 @@ const SearchCatalogCard = forwardRef(function SearchCatalogCard({ card, index =
|
|
|
53
53
|
render,
|
|
54
54
|
state: {
|
|
55
55
|
selected,
|
|
56
|
-
expanded
|
|
56
|
+
expanded,
|
|
57
|
+
setExpanded
|
|
57
58
|
},
|
|
59
|
+
stateAttributesMapping: { setExpanded: () => null },
|
|
58
60
|
props: mergeProps({
|
|
59
61
|
role: interactive ? "button" : void 0,
|
|
60
62
|
tabIndex: interactive ? 0 : void 0,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"card.mjs","names":[],"sources":["../../../../src/components/compound/search-catalog/card.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport {\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type SyntheticEvent,\n useCallback,\n useId,\n useMemo,\n} from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport {\n SearchCatalogCardContext,\n type SearchCatalogCardContextValue,\n} from \"../../../context/search-catalog-card-context.js\";\nimport { useSearchCatalogContext } from \"../../../context/search-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { SearchCardData } from \"../../../types/catalog-adapters.js\";\nimport {\n CatalogCardDescription,\n CatalogCardHeader,\n CatalogCardTitle,\n} from \"../../defaults/catalog/card-primitives.js\";\n\nexport interface SearchCatalogCardState {\n selected: boolean;\n expanded: boolean;\n}\n\nexport interface SearchCatalogCardProps\n extends useRender.ComponentProps<\"div\", SearchCatalogCardState> {\n card: SearchCardData;\n index?: number;\n selected?: boolean;\n /** Overrides the default click handler that fires `onSelectCard`. */\n onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n}\n\nconst DEFAULT_BODY = (\n <CatalogCardHeader>\n <CatalogCardTitle />\n <CatalogCardDescription />\n </CatalogCardHeader>\n);\n\nexport const SearchCatalogCard = forwardRef<HTMLDivElement, SearchCatalogCardProps>(\n function SearchCatalogCard(\n { card, index = 0, selected = false, render, onClick, className, ...rest },\n ref,\n ) {\n const { onSelectCard, expandedCardId, setExpandedCardId } = useSearchCatalogContext();\n const { classNames, components } = useCatalogConfig();\n const instanceId = useId();\n const expanded = expandedCardId === instanceId;\n\n const setExpanded = useCallback(\n (open: boolean) => {\n setExpandedCardId(open ? instanceId : null);\n },\n [instanceId, setExpandedCardId],\n );\n\n const onSelect = useCallback(\n (e: SyntheticEvent) => {\n onSelectCard?.(card, e);\n },\n [onSelectCard, card],\n );\n\n const contextValue = useMemo<SearchCatalogCardContextValue>(\n () => ({ card, index, selected, expanded, onSelect, setExpanded }),\n [card, index, selected, expanded, onSelect, setExpanded],\n );\n\n const interactive = !!(onClick || onSelectCard);\n const handleClick = onClick\n ? onClick\n : onSelectCard\n ? (e: MouseEvent<HTMLDivElement>) => onSelect(e)\n : undefined;\n const handleKeyDown = interactive\n ? (e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n if (onClick) onClick(e as unknown as MouseEvent<HTMLDivElement>);\n else onSelect(e);\n }\n }\n : undefined;\n\n const isUsingDefaultBody = !render;\n\n const Card = components?.Card;\n\n const element = useRender({\n ref,\n defaultTagName: \"div\",\n render,\n state: { selected, expanded },\n props: mergeProps<\"div\">(\n {\n role: interactive ? \"button\" : undefined,\n tabIndex: interactive ? 0 : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n className: cn(\n \"pz:flex pz:flex-col\",\n isUsingDefaultBody &&\n \"pz:rounded-md pz:border pz:border-input pz:bg-card pz:px-3 pz:py-2.5 pz:transition-colors\",\n isUsingDefaultBody && interactive && \"pz:hover:bg-muted/40\",\n interactive && \"pz:cursor-pointer\",\n classNames?.card,\n className,\n ),\n ...(isUsingDefaultBody ? { children: DEFAULT_BODY } : {}),\n ...({ \"data-p0\": \"catalog-card\" } as Record<string, string>),\n },\n rest as Record<string, unknown>,\n ),\n });\n\n if (Card) {\n return (\n <SearchCatalogCardContext.Provider value={contextValue}>\n <Card>{DEFAULT_BODY}</Card>\n </SearchCatalogCardContext.Provider>\n );\n }\n\n return (\n <SearchCatalogCardContext.Provider value={contextValue}>\n {element}\n </SearchCatalogCardContext.Provider>\n );\n },\n);\n"],"mappings":";;;;;;;;;;;
|
|
1
|
+
{"version":3,"file":"card.mjs","names":[],"sources":["../../../../src/components/compound/search-catalog/card.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport {\n forwardRef,\n type KeyboardEvent,\n type MouseEvent,\n type SyntheticEvent,\n useCallback,\n useId,\n useMemo,\n} from \"react\";\nimport { useCatalogConfig } from \"../../../context/catalog-config-context.js\";\nimport {\n SearchCatalogCardContext,\n type SearchCatalogCardContextValue,\n} from \"../../../context/search-catalog-card-context.js\";\nimport { useSearchCatalogContext } from \"../../../context/search-catalog-context.js\";\nimport { cn } from \"../../../lib/utils.js\";\nimport type { SearchCardData } from \"../../../types/catalog-adapters.js\";\nimport {\n CatalogCardDescription,\n CatalogCardHeader,\n CatalogCardTitle,\n} from \"../../defaults/catalog/card-primitives.js\";\n\nexport interface SearchCatalogCardState {\n selected: boolean;\n expanded: boolean;\n setExpanded: (open: boolean) => void;\n}\n\nexport interface SearchCatalogCardProps\n extends useRender.ComponentProps<\"div\", SearchCatalogCardState> {\n card: SearchCardData;\n index?: number;\n selected?: boolean;\n /** Overrides the default click handler that fires `onSelectCard`. */\n onClick?: (e: MouseEvent<HTMLDivElement>) => void;\n}\n\nconst DEFAULT_BODY = (\n <CatalogCardHeader>\n <CatalogCardTitle />\n <CatalogCardDescription />\n </CatalogCardHeader>\n);\n\nexport const SearchCatalogCard = forwardRef<HTMLDivElement, SearchCatalogCardProps>(\n function SearchCatalogCard(\n { card, index = 0, selected = false, render, onClick, className, ...rest },\n ref,\n ) {\n const { onSelectCard, expandedCardId, setExpandedCardId } = useSearchCatalogContext();\n const { classNames, components } = useCatalogConfig();\n const instanceId = useId();\n const expanded = expandedCardId === instanceId;\n\n const setExpanded = useCallback(\n (open: boolean) => {\n setExpandedCardId(open ? instanceId : null);\n },\n [instanceId, setExpandedCardId],\n );\n\n const onSelect = useCallback(\n (e: SyntheticEvent) => {\n onSelectCard?.(card, e);\n },\n [onSelectCard, card],\n );\n\n const contextValue = useMemo<SearchCatalogCardContextValue>(\n () => ({ card, index, selected, expanded, onSelect, setExpanded }),\n [card, index, selected, expanded, onSelect, setExpanded],\n );\n\n const interactive = !!(onClick || onSelectCard);\n const handleClick = onClick\n ? onClick\n : onSelectCard\n ? (e: MouseEvent<HTMLDivElement>) => onSelect(e)\n : undefined;\n const handleKeyDown = interactive\n ? (e: KeyboardEvent<HTMLDivElement>) => {\n if (e.key === \"Enter\" || e.key === \" \") {\n e.preventDefault();\n if (onClick) onClick(e as unknown as MouseEvent<HTMLDivElement>);\n else onSelect(e);\n }\n }\n : undefined;\n\n const isUsingDefaultBody = !render;\n\n const Card = components?.Card;\n\n const element = useRender({\n ref,\n defaultTagName: \"div\",\n render,\n state: { selected, expanded, setExpanded },\n stateAttributesMapping: {\n setExpanded: () => null,\n },\n props: mergeProps<\"div\">(\n {\n role: interactive ? \"button\" : undefined,\n tabIndex: interactive ? 0 : undefined,\n onClick: handleClick,\n onKeyDown: handleKeyDown,\n className: cn(\n \"pz:flex pz:flex-col\",\n isUsingDefaultBody &&\n \"pz:rounded-md pz:border pz:border-input pz:bg-card pz:px-3 pz:py-2.5 pz:transition-colors\",\n isUsingDefaultBody && interactive && \"pz:hover:bg-muted/40\",\n interactive && \"pz:cursor-pointer\",\n classNames?.card,\n className,\n ),\n ...(isUsingDefaultBody ? { children: DEFAULT_BODY } : {}),\n ...({ \"data-p0\": \"catalog-card\" } as Record<string, string>),\n },\n rest as Record<string, unknown>,\n ),\n });\n\n if (Card) {\n return (\n <SearchCatalogCardContext.Provider value={contextValue}>\n <Card>{DEFAULT_BODY}</Card>\n </SearchCatalogCardContext.Provider>\n );\n }\n\n return (\n <SearchCatalogCardContext.Provider value={contextValue}>\n {element}\n </SearchCatalogCardContext.Provider>\n );\n },\n);\n"],"mappings":";;;;;;;;;;;AAwCA,MAAM,eACJ,qBAAC,mBAAD,aACE,oBAAC,kBAAD,EAAoB,GACpB,oBAAC,wBAAD,EAA0B,EACR;AAGtB,MAAa,oBAAoB,WAC/B,SAAS,kBACP,EAAE,MAAM,QAAQ,GAAG,WAAW,OAAO,QAAQ,SAAS,WAAW,GAAG,QACpE,KACA;CACA,MAAM,EAAE,cAAc,gBAAgB,sBAAsB,yBAAyB;CACrF,MAAM,EAAE,YAAY,eAAe,kBAAkB;CACrD,MAAM,aAAa,OAAO;CAC1B,MAAM,WAAW,mBAAmB;CAEpC,MAAM,cAAc,aACjB,SAAkB;AACjB,oBAAkB,OAAO,aAAa,KAAK;IAE7C,CAAC,YAAY,kBAAkB,CAChC;CAED,MAAM,WAAW,aACd,MAAsB;AACrB,iBAAe,MAAM,EAAE;IAEzB,CAAC,cAAc,KAAK,CACrB;CAED,MAAM,eAAe,eACZ;EAAE;EAAM;EAAO;EAAU;EAAU;EAAU;EAAa,GACjE;EAAC;EAAM;EAAO;EAAU;EAAU;EAAU;EAAY,CACzD;CAED,MAAM,cAAc,CAAC,EAAE,WAAW;CAClC,MAAM,cAAc,UAChB,UACA,gBACG,MAAkC,SAAS,EAAE,GAC9C;CACN,MAAM,gBAAgB,eACjB,MAAqC;AACpC,MAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,KAAK;AACtC,KAAE,gBAAgB;AAClB,OAAI,QAAS,SAAQ,EAA2C;OAC3D,UAAS,EAAE;;KAGpB;CAEJ,MAAM,qBAAqB,CAAC;CAE5B,MAAM,OAAO,YAAY;CAEzB,MAAM,UAAU,UAAU;EACxB;EACA,gBAAgB;EAChB;EACA,OAAO;GAAE;GAAU;GAAU;GAAa;EAC1C,wBAAwB,EACtB,mBAAmB,MACpB;EACD,OAAO,WACL;GACE,MAAM,cAAc,WAAW;GAC/B,UAAU,cAAc,IAAI;GAC5B,SAAS;GACT,WAAW;GACX,WAAW,GACT,uBACA,sBACE,6FACF,sBAAsB,eAAe,wBACrC,eAAe,qBACf,YAAY,MACZ,UACD;GACD,GAAI,qBAAqB,EAAE,UAAU,cAAc,GAAG,EAAE;GAClD,WAAW;GAClB,EACD,KACD;EACF,CAAC;AAEF,KAAI,KACF,QACE,oBAAC,yBAAyB,UAA1B;EAAmC,OAAO;YACxC,oBAAC,MAAD,YAAO,cAAoB;EACO;AAIxC,QACE,oBAAC,yBAAyB,UAA1B;EAAmC,OAAO;YACvC;EACiC;EAGzC"}
|
|
@@ -6,6 +6,10 @@ import { SearchCategory } from "@pipe0/base";
|
|
|
6
6
|
//#region src/components/compound/search-catalog/category-filter.d.ts
|
|
7
7
|
interface SearchCatalogCategoryFilterState {
|
|
8
8
|
value: SearchCategory | null;
|
|
9
|
+
setValue: (value: SearchCategory | null) => void;
|
|
10
|
+
options: ReadonlyArray<CategoryOption<SearchCategory>>;
|
|
11
|
+
counts: Partial<Record<SearchCategory, number>>;
|
|
12
|
+
totalCount: number;
|
|
9
13
|
isActive: boolean;
|
|
10
14
|
}
|
|
11
15
|
interface SearchCatalogCategoryFilterProps extends useRender.ComponentProps<"div", SearchCatalogCategoryFilterState> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"category-filter.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/category-filter.tsx"],"mappings":";;;;;;UA6BiB,gCAAA;EACf,KAAA,EAAO,cAAA;EACP,QAAA;AAAA;AAAA,UAGe,gCAAA,SACP,SAAA,CAAU,cAAA,QAAsB,gCAAA
|
|
1
|
+
{"version":3,"file":"category-filter.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/category-filter.tsx"],"mappings":";;;;;;UA6BiB,gCAAA;EACf,KAAA,EAAO,cAAA;EACP,QAAA,GAAW,KAAA,EAAO,cAAA;EAClB,OAAA,EAAS,aAAA,CAAc,cAAA,CAAe,cAAA;EACtC,MAAA,EAAQ,OAAA,CAAQ,MAAA,CAAO,cAAA;EACvB,UAAA;EACA,QAAA;AAAA;AAAA,UAGe,gCAAA,SACP,SAAA,CAAU,cAAA,QAAsB,gCAAA;EAPjB;EASvB,OAAA,GAAU,aAAA,CAAc,cAAA,CAAe,cAAA;AAAA;AAAA,iBAGzB,2BAAA,CAAA;EACd,OAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,gCAAA,GAAgC,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -24,12 +24,22 @@ const DEFAULT_OPTIONS = [{
|
|
|
24
24
|
function SearchCatalogCategoryFilter({ options = DEFAULT_OPTIONS, className, render, ...props }) {
|
|
25
25
|
const ctx = useSearchCatalogContext();
|
|
26
26
|
const value = ctx.category;
|
|
27
|
+
const isActive = value !== null;
|
|
27
28
|
const element = useRender({
|
|
28
29
|
defaultTagName: "div",
|
|
29
30
|
render,
|
|
30
31
|
state: {
|
|
31
32
|
value,
|
|
32
|
-
|
|
33
|
+
setValue: ctx.setCategory,
|
|
34
|
+
options,
|
|
35
|
+
counts: ctx.baselineCategoryCounts,
|
|
36
|
+
totalCount: ctx.baselineCardCount,
|
|
37
|
+
isActive
|
|
38
|
+
},
|
|
39
|
+
stateAttributesMapping: {
|
|
40
|
+
setValue: () => null,
|
|
41
|
+
options: () => null,
|
|
42
|
+
counts: () => null
|
|
33
43
|
},
|
|
34
44
|
props: mergeProps({
|
|
35
45
|
className,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"category-filter.mjs","names":[],"sources":["../../../../src/components/compound/search-catalog/category-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { getSearchCategoryEntries, type SearchCategory } from \"@pipe0/base\";\nimport { Building2, Database, User, X } from \"lucide-react\";\nimport { useSearchCatalogContext } from \"../../../context/search-catalog-context.js\";\nimport {\n type CategoryOption,\n DefaultCategoryFilter,\n} from \"../../defaults/catalog/category-filter.js\";\n\nconst SEARCH_CATEGORY_ICONS: Record<SearchCategory, CategoryOption<SearchCategory>[\"icon\"]> = {\n people: User,\n companies: Building2,\n deprecated: X,\n};\n\nconst DEFAULT_OPTIONS: ReadonlyArray<CategoryOption<SearchCategory>> = [\n { id: null, label: \"All\", icon: Database },\n ...[...getSearchCategoryEntries()]\n .sort((a, b) => a.order - b.order)\n .map(\n (entry): CategoryOption<SearchCategory> => ({\n id: entry.id,\n label: entry.label,\n icon: SEARCH_CATEGORY_ICONS[entry.id],\n }),\n ),\n];\n\nexport interface SearchCatalogCategoryFilterState {\n value: SearchCategory | null;\n isActive: boolean;\n}\n\nexport interface SearchCatalogCategoryFilterProps\n extends useRender.ComponentProps<\"div\", SearchCatalogCategoryFilterState> {\n /** Override the default category options. */\n options?: ReadonlyArray<CategoryOption<SearchCategory>>;\n}\n\nexport function SearchCatalogCategoryFilter({\n options = DEFAULT_OPTIONS,\n className,\n render,\n ...props\n}: SearchCatalogCategoryFilterProps) {\n const ctx = useSearchCatalogContext();\n const value = ctx.category;\n const isActive = value !== null;\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: {
|
|
1
|
+
{"version":3,"file":"category-filter.mjs","names":[],"sources":["../../../../src/components/compound/search-catalog/category-filter.tsx"],"sourcesContent":["import { mergeProps } from \"@base-ui/react/merge-props\";\nimport { useRender } from \"@base-ui/react/use-render\";\nimport { getSearchCategoryEntries, type SearchCategory } from \"@pipe0/base\";\nimport { Building2, Database, User, X } from \"lucide-react\";\nimport { useSearchCatalogContext } from \"../../../context/search-catalog-context.js\";\nimport {\n type CategoryOption,\n DefaultCategoryFilter,\n} from \"../../defaults/catalog/category-filter.js\";\n\nconst SEARCH_CATEGORY_ICONS: Record<SearchCategory, CategoryOption<SearchCategory>[\"icon\"]> = {\n people: User,\n companies: Building2,\n deprecated: X,\n};\n\nconst DEFAULT_OPTIONS: ReadonlyArray<CategoryOption<SearchCategory>> = [\n { id: null, label: \"All\", icon: Database },\n ...[...getSearchCategoryEntries()]\n .sort((a, b) => a.order - b.order)\n .map(\n (entry): CategoryOption<SearchCategory> => ({\n id: entry.id,\n label: entry.label,\n icon: SEARCH_CATEGORY_ICONS[entry.id],\n }),\n ),\n];\n\nexport interface SearchCatalogCategoryFilterState {\n value: SearchCategory | null;\n setValue: (value: SearchCategory | null) => void;\n options: ReadonlyArray<CategoryOption<SearchCategory>>;\n counts: Partial<Record<SearchCategory, number>>;\n totalCount: number;\n isActive: boolean;\n}\n\nexport interface SearchCatalogCategoryFilterProps\n extends useRender.ComponentProps<\"div\", SearchCatalogCategoryFilterState> {\n /** Override the default category options. */\n options?: ReadonlyArray<CategoryOption<SearchCategory>>;\n}\n\nexport function SearchCatalogCategoryFilter({\n options = DEFAULT_OPTIONS,\n className,\n render,\n ...props\n}: SearchCatalogCategoryFilterProps) {\n const ctx = useSearchCatalogContext();\n const value = ctx.category;\n const isActive = value !== null;\n\n const element = useRender({\n defaultTagName: \"div\",\n render,\n state: {\n value,\n setValue: ctx.setCategory,\n options,\n counts: ctx.baselineCategoryCounts,\n totalCount: ctx.baselineCardCount,\n isActive,\n },\n stateAttributesMapping: {\n setValue: () => null,\n options: () => null,\n counts: () => null,\n },\n props: mergeProps<\"div\">(\n {\n className,\n ...({ \"data-p0\": \"catalog-category-filter\" } as Record<string, string>),\n },\n props,\n ),\n });\n\n if (render) return element;\n\n return (\n <DefaultCategoryFilter\n options={options}\n value={ctx.category}\n onChange={ctx.setCategory}\n className={className}\n />\n );\n}\n"],"mappings":";;;;;;;;;AAUA,MAAM,wBAAwF;CAC5F,QAAQ;CACR,WAAW;CACX,YAAY;CACb;AAED,MAAM,kBAAiE,CACrE;CAAE,IAAI;CAAM,OAAO;CAAO,MAAM;CAAU,EAC1C,GAAG,CAAC,GAAG,0BAA0B,CAAC,CAC/B,MAAM,GAAG,MAAM,EAAE,QAAQ,EAAE,MAAM,CACjC,KACE,WAA2C;CAC1C,IAAI,MAAM;CACV,OAAO,MAAM;CACb,MAAM,sBAAsB,MAAM;CACnC,EACF,CACJ;AAiBD,SAAgB,4BAA4B,EAC1C,UAAU,iBACV,WACA,QACA,GAAG,SACgC;CACnC,MAAM,MAAM,yBAAyB;CACrC,MAAM,QAAQ,IAAI;CAClB,MAAM,WAAW,UAAU;CAE3B,MAAM,UAAU,UAAU;EACxB,gBAAgB;EAChB;EACA,OAAO;GACL;GACA,UAAU,IAAI;GACd;GACA,QAAQ,IAAI;GACZ,YAAY,IAAI;GAChB;GACD;EACD,wBAAwB;GACtB,gBAAgB;GAChB,eAAe;GACf,cAAc;GACf;EACD,OAAO,WACL;GACE;GACM,WAAW;GAClB,EACD,MACD;EACF,CAAC;AAEF,KAAI,OAAQ,QAAO;AAEnB,QACE,oBAAC,uBAAD;EACW;EACT,OAAO,IAAI;EACX,UAAU,IAAI;EACH;EACX"}
|
|
@@ -11,6 +11,8 @@ type SearchColumnFilterId = "outputFields" | "providers" | "tags";
|
|
|
11
11
|
*/
|
|
12
12
|
interface ColumnFilterState {
|
|
13
13
|
value: string;
|
|
14
|
+
setValue: (value: string | null) => void;
|
|
15
|
+
options: ReadonlyArray<FilterSelectOption>;
|
|
14
16
|
isActive: boolean;
|
|
15
17
|
}
|
|
16
18
|
interface SearchCatalogColumnFilterProps extends useRender.ComponentProps<"div", ColumnFilterState> {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"column-filter.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/column-filter.tsx"],"mappings":";;;;;;KASY,oBAAA;;;AAAZ;;UAMiB,iBAAA;EACf,KAAA;EACA,QAAA;AAAA;AAAA,UAGe,8BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,iBAAA;EACxC,EAAA,EAAI,oBAAA;EACJ,WAAA,GAAc,SAAA;EACd,OAAA,GAAU,aAAA,CAAc,kBAAA;AAAA;;;;;;iBA2BV,yBAAA,CAAA;EACd,EAAA;EACA,WAAA;EACA,OAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,8BAAA,GAA8B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
1
|
+
{"version":3,"file":"column-filter.d.mts","names":[],"sources":["../../../../src/components/compound/search-catalog/column-filter.tsx"],"mappings":";;;;;;KASY,oBAAA;;;AAAZ;;UAMiB,iBAAA;EACf,KAAA;EACA,QAAA,GAAW,KAAA;EACX,OAAA,EAAS,aAAA,CAAc,kBAAA;EACvB,QAAA;AAAA;AAAA,UAGe,8BAAA,SACP,SAAA,CAAU,cAAA,QAAsB,iBAAA;EACxC,EAAA,EAAI,oBAAA;EACJ,WAAA,GAAc,SAAA;EACd,OAAA,GAAU,aAAA,CAAc,kBAAA;AAAA;;;;;;iBA2BV,yBAAA,CAAA;EACd,EAAA;EACA,WAAA;EACA,OAAA;EACA,SAAA;EACA,MAAA;EAAA,GACG;AAAA,GACF,8BAAA,GAA8B,oBAAA,CAAA,GAAA,CAAA,OAAA"}
|
|
@@ -41,8 +41,14 @@ function SearchCatalogColumnFilter({ id, placeholder, options, className, render
|
|
|
41
41
|
render,
|
|
42
42
|
state: {
|
|
43
43
|
value,
|
|
44
|
+
setValue,
|
|
45
|
+
options: resolvedOptions,
|
|
44
46
|
isActive: !!value
|
|
45
47
|
},
|
|
48
|
+
stateAttributesMapping: {
|
|
49
|
+
setValue: () => null,
|
|
50
|
+
options: () => null
|
|
51
|
+
},
|
|
46
52
|
props: mergeProps({
|
|
47
53
|
className,
|
|
48
54
|
"data-p0": `catalog-column-filter-${id}`
|