@thewaver/ss-components 0.0.1 → 0.0.2

package/dist/Fundamentals/Stepper/Stepper.js

@@ -0,0 +1,164 @@
+import { access } from "../../Utils/propUtils.js";
+import { InteractionWrapper } from "../InteractionWrapper/InteractionWrapper.js";
+import { stepperBody, stepperConnector, stepperEntry, stepperItem, stepperList, stepperTail, stepperTailConnector } from "./Stepper.css.js";
+import { Index, Show, createMemo } from "solid-js";
+import { className, createComponent, delegateEvents, effect, insert, setAttribute, setStyleProperty, template, use } from "solid-js/web";
+//#region src/Fundamentals/Stepper/Stepper.tsx
+var _tmpl$ = /*#__PURE__*/ template(`<button type=button>`);
+var _tmpl$2 = /*#__PURE__*/ template(`<span>`);
+var _tmpl$3 = /*#__PURE__*/ template(`<ol>`);
+var _tmpl$4 = /*#__PURE__*/ template(`<li>`);
+var _tmpl$5 = /*#__PURE__*/ template(`<span aria-hidden=true>`);
+var _tmpl$6 = /*#__PURE__*/ template(`<div><div>`);
+var DEFAULT_STEPPER_DIR = "row";
+var DEFAULT_STEPPER_GAP = 0;
+var StepperItem = (props) => {
+	const getIsNavigable = () => access(props.step).isNavigable ?? false;
+	const handleClick = () => {
+		if (!getIsNavigable()) return;
+		props.onSelect(access(props.step).value);
+	};
+	return createComponent(Show, {
+		get when() {
+			return getIsNavigable();
+		},
+		get fallback() {
+			return (() => {
+				var _el$2 = _tmpl$2();
+				use((element) => props.ref?.(element), _el$2);
+				className(_el$2, stepperItem);
+				insert(_el$2, () => props.renderContent(() => access(props.flags)));
+				effect((_p$) => {
+					var _v$4 = access(props.step).id, _v$5 = access(props.ariaLabel), _v$6 = access(props.flags).isCurrent ? "step" : void 0, _v$7 = access(props.flags).isDisabled || void 0;
+					_v$4 !== _p$.e && setAttribute(_el$2, "id", _p$.e = _v$4);
+					_v$5 !== _p$.t && setAttribute(_el$2, "aria-label", _p$.t = _v$5);
+					_v$6 !== _p$.a && setAttribute(_el$2, "aria-current", _p$.a = _v$6);
+					_v$7 !== _p$.o && setAttribute(_el$2, "aria-disabled", _p$.o = _v$7);
+					return _p$;
+				}, {
+					e: void 0,
+					t: void 0,
+					a: void 0,
+					o: void 0
+				});
+				return _el$2;
+			})();
+		},
+		get children() {
+			var _el$ = _tmpl$();
+			_el$.$$click = handleClick;
+			use((element) => props.ref?.(element), _el$);
+			className(_el$, stepperItem);
+			insert(_el$, () => props.renderContent(() => access(props.flags)));
+			effect((_p$) => {
+				var _v$ = access(props.step).id, _v$2 = access(props.ariaLabel), _v$3 = access(props.flags).isCurrent ? "step" : void 0;
+				_v$ !== _p$.e && setAttribute(_el$, "id", _p$.e = _v$);
+				_v$2 !== _p$.t && setAttribute(_el$, "aria-label", _p$.t = _v$2);
+				_v$3 !== _p$.a && setAttribute(_el$, "aria-current", _p$.a = _v$3);
+				return _p$;
+			}, {
+				e: void 0,
+				t: void 0,
+				a: void 0
+			});
+			return _el$;
+		}
+	});
+};
+var Stepper = (props) => {
+	const getDir = createMemo(() => access(props.dir) ?? DEFAULT_STEPPER_DIR);
+	const getLastIndex = createMemo(() => access(props.steps).length - 1);
+	return (() => {
+		var _el$3 = _tmpl$3();
+		className(_el$3, stepperList);
+		insert(_el$3, createComponent(Index, {
+			get each() {
+				return access(props.steps);
+			},
+			children: (getStep, index) => {
+				const getTooltipDefs = () => props.computeTooltipDefs?.(getStep(), index);
+				const getHasConnector = () => props.renderConnector !== void 0 && index !== getLastIndex();
+				return (() => {
+					var _el$4 = _tmpl$4();
+					className(_el$4, stepperEntry);
+					insert(_el$4, createComponent(InteractionWrapper, {
+						isDisabled: () => !(getStep().isNavigable ?? false),
+						isReachableWhenDisabled: () => getTooltipDefs() !== void 0,
+						tooltipDefs: getTooltipDefs,
+						extraFlags: () => ({ isCurrent: getStep().value === access(props.currentValue) }),
+						renderControl: (setElementRef, getFlags) => createComponent(StepperItem, {
+							ref(r$) {
+								var _ref$ = setElementRef;
+								typeof _ref$ === "function" ? _ref$(r$) : setElementRef = r$;
+							},
+							step: getStep,
+							flags: getFlags,
+							ariaLabel: () => props.computeStepAriaLabel(getStep(), index),
+							renderContent: (getItemFlags) => props.renderStep(getStep, getItemFlags),
+							onSelect: (value) => props.onCurrentChange?.(value)
+						})
+					}), null);
+					insert(_el$4, createComponent(Show, {
+						get when() {
+							return props.renderBody;
+						},
+						get fallback() {
+							return createComponent(Show, {
+								get when() {
+									return getHasConnector();
+								},
+								get children() {
+									var _el$5 = _tmpl$5();
+									className(_el$5, stepperConnector);
+									insert(_el$5, props.renderConnector);
+									return _el$5;
+								}
+							});
+						},
+						children: (getRenderBody) => (() => {
+							var _el$6 = _tmpl$6(), _el$8 = _el$6.firstChild;
+							className(_el$6, stepperTail);
+							insert(_el$6, createComponent(Show, {
+								get when() {
+									return getHasConnector();
+								},
+								get children() {
+									var _el$7 = _tmpl$5();
+									insert(_el$7, props.renderConnector);
+									effect(() => className(_el$7, [stepperConnector, stepperTailConnector].join(" ")));
+									return _el$7;
+								}
+							}), _el$8);
+							className(_el$8, stepperBody);
+							insert(_el$8, () => getRenderBody()(getStep, index));
+							return _el$6;
+						})()
+					}), null);
+					effect((_$p) => setStyleProperty(_el$4, "flex-direction", getDir()));
+					return _el$4;
+				})();
+			}
+		}));
+		effect((_p$) => {
+			var _v$8 = getDir(), _v$9 = getDir() === "row" ? "wrap" : void 0, _v$0 = `${access(props.gap) ?? DEFAULT_STEPPER_GAP}px`, _v$1 = access(props.ariaLabel), _v$10 = getDir() === "column" ? "vertical" : void 0;
+			_v$8 !== _p$.e && setStyleProperty(_el$3, "flex-direction", _p$.e = _v$8);
+			_v$9 !== _p$.t && setStyleProperty(_el$3, "flex-wrap", _p$.t = _v$9);
+			_v$0 !== _p$.a && setStyleProperty(_el$3, "gap", _p$.a = _v$0);
+			_v$1 !== _p$.o && setAttribute(_el$3, "aria-label", _p$.o = _v$1);
+			_v$10 !== _p$.i && setAttribute(_el$3, "aria-orientation", _p$.i = _v$10);
+			return _p$;
+		}, {
+			e: void 0,
+			t: void 0,
+			a: void 0,
+			o: void 0,
+			i: void 0
+		});
+		return _el$3;
+	})();
+};
+delegateEvents(["click"]);
+//#endregion
+export { Stepper };
+
+//# sourceMappingURL=Stepper.js.map

package/dist/Fundamentals/Stepper/Stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stepper.js","names":["Index","Show","createMemo","access","InteractionWrapper","StepperDir","StepperItemProps","StepperProps","styles","DEFAULT_STEPPER_DIR","DEFAULT_STEPPER_GAP","StepperItem","props","TValue","TState","getIsNavigable","step","isNavigable","handleClick","onSelect","value","_$createComponent","when","fallback","_el$2","_tmpl$2","_$use","element","ref","_$className","stepperItem","_$insert","renderContent","flags","_$effect","_p$","_v$4","id","_v$5","ariaLabel","_v$6","isCurrent","undefined","_v$7","isDisabled","e","_$setAttribute","t","a","o","children","_el$","_tmpl$","$$click","_v$","_v$2","_v$3","Stepper","getDir","dir","getLastIndex","steps","length","_el$3","_tmpl$3","stepperList","each","getStep","index","getTooltipDefs","computeTooltipDefs","getHasConnector","renderConnector","_el$4","_tmpl$4","stepperEntry","isReachableWhenDisabled","tooltipDefs","extraFlags","currentValue","renderControl","setElementRef","getFlags","r$","_ref$","computeStepAriaLabel","getItemFlags","renderStep","onCurrentChange","renderBody","_el$5","_tmpl$5","stepperConnector","getRenderBody","_el$6","_tmpl$6","_el$8","firstChild","stepperTail","_el$7","stepperTailConnector","join","stepperBody","_$p","_$setStyleProperty","_v$8","_v$9","_v$0","gap","_v$1","_v$10","i","_$delegateEvents"],"sources":["../../../src/Fundamentals/Stepper/Stepper.tsx"],"sourcesContent":["import { Index, Show, createMemo } from \"solid-js\";\r\n\r\nimport { access } from \"../../Utils/propUtils\";\r\nimport { InteractionWrapper } from \"../InteractionWrapper/InteractionWrapper\";\r\nimport type { StepperDir, StepperItemProps, StepperProps } from \"./Stepper.types\";\r\n\r\nimport * as styles from \"./Stepper.css\";\r\n\r\nconst DEFAULT_STEPPER_DIR: StepperDir = \"row\";\r\nconst DEFAULT_STEPPER_GAP = 0;\r\n\r\nconst StepperItem = <TValue, TState>(props: StepperItemProps<TValue, TState>) => {\r\n    const getIsNavigable = () => access(props.step).isNavigable ?? false;\r\n\r\n    const handleClick = () => {\r\n        if (!getIsNavigable()) return;\r\n\r\n        props.onSelect(access(props.step).value);\r\n    };\r\n\r\n    return (\r\n        <Show\r\n            when={getIsNavigable()}\r\n            fallback={\r\n                <span\r\n                    ref={(element) => props.ref?.(element)}\r\n                    class={styles.stepperItem}\r\n                    id={access(props.step).id}\r\n                    aria-label={access(props.ariaLabel)}\r\n                    aria-current={access(props.flags).isCurrent ? \"step\" : undefined}\r\n                    aria-disabled={access(props.flags).isDisabled || undefined}\r\n                >\r\n                    {props.renderContent(() => access(props.flags))}\r\n                </span>\r\n            }\r\n        >\r\n            <button\r\n                type=\"button\"\r\n                ref={(element) => props.ref?.(element)}\r\n                class={styles.stepperItem}\r\n                id={access(props.step).id}\r\n                aria-label={access(props.ariaLabel)}\r\n                aria-current={access(props.flags).isCurrent ? \"step\" : undefined}\r\n                onClick={handleClick}\r\n            >\r\n                {props.renderContent(() => access(props.flags))}\r\n            </button>\r\n        </Show>\r\n    );\r\n};\r\n\r\nexport const Stepper = <TValue, TState>(props: StepperProps<TValue, TState>) => {\r\n    const getDir = createMemo(() => access(props.dir) ?? DEFAULT_STEPPER_DIR);\r\n\r\n    const getLastIndex = createMemo(() => access(props.steps).length - 1);\r\n\r\n    return (\r\n        <ol\r\n            class={styles.stepperList}\r\n            style={{\r\n                \"flex-direction\": getDir(),\r\n                \"flex-wrap\": getDir() === \"row\" ? \"wrap\" : undefined,\r\n                \"gap\": `${access(props.gap) ?? DEFAULT_STEPPER_GAP}px`,\r\n            }}\r\n            aria-label={access(props.ariaLabel)}\r\n            aria-orientation={getDir() === \"column\" ? \"vertical\" : undefined}\r\n        >\r\n            <Index each={access(props.steps)}>\r\n                {(getStep, index) => {\r\n                    const getTooltipDefs = () => props.computeTooltipDefs?.(getStep(), index);\r\n\r\n                    const getHasConnector = () => props.renderConnector !== undefined && index !== getLastIndex();\r\n\r\n                    return (\r\n                        <li class={styles.stepperEntry} style={{ \"flex-direction\": getDir() }}>\r\n                            <InteractionWrapper\r\n                                isDisabled={() => !(getStep().isNavigable ?? false)}\r\n                                isReachableWhenDisabled={() => getTooltipDefs() !== undefined}\r\n                                tooltipDefs={getTooltipDefs}\r\n                                extraFlags={() => ({ isCurrent: getStep().value === access(props.currentValue) })}\r\n                                renderControl={(setElementRef, getFlags) => (\r\n                                    <StepperItem\r\n                                        ref={setElementRef}\r\n                                        step={getStep}\r\n                                        flags={getFlags}\r\n                                        ariaLabel={() => props.computeStepAriaLabel(getStep(), index)}\r\n                                        renderContent={(getItemFlags) => props.renderStep(getStep, getItemFlags)}\r\n                                        onSelect={(value) => props.onCurrentChange?.(value)}\r\n                                    />\r\n                                )}\r\n                            />\r\n\r\n                            <Show\r\n                                when={props.renderBody}\r\n                                fallback={\r\n                                    <Show when={getHasConnector()}>\r\n                                        <span class={styles.stepperConnector} aria-hidden=\"true\">\r\n                                            {props.renderConnector!()}\r\n                                        </span>\r\n                                    </Show>\r\n                                }\r\n                            >\r\n                                {(getRenderBody) => (\r\n                                    <div class={styles.stepperTail}>\r\n                                        <Show when={getHasConnector()}>\r\n                                            <span\r\n                                                class={[styles.stepperConnector, styles.stepperTailConnector].join(\" \")}\r\n                                                aria-hidden=\"true\"\r\n                                            >\r\n                                                {props.renderConnector!()}\r\n                                            </span>\r\n                                        </Show>\r\n\r\n                                        <div class={styles.stepperBody}>{getRenderBody()(getStep, index)}</div>\r\n                                    </div>\r\n                                )}\r\n                            </Show>\r\n                        </li>\r\n                    );\r\n                }}\r\n            </Index>\r\n        </ol>\r\n    );\r\n};\r\n"],"mappings":"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"}

package/dist/Fundamentals/Table/Table.css.js

@@ -0,0 +1,17 @@
+/* empty css                         */
+//#region src/Fundamentals/Table/Table.css.ts
+var tableTemplateVar = "var(--tcb3cd0)";
+var tableResizerWidthVar = "var(--tcb3cd1)";
+var tableRoot = "tcb3cd2";
+var tableHeader = "tcb3cd3";
+var tableBody = "tcb3cd4";
+var tableRow = "tcb3cd5";
+var tableWindowedRow = "tcb3cd6";
+var tableCell = "tcb3cd7";
+var tableMarkerBefore = "tcb3cd9 tcb3cd8";
+var tableMarkerAfter = "tcb3cda tcb3cd8";
+var tableResizer = "tcb3cdb";
+//#endregion
+export { tableBody, tableCell, tableHeader, tableMarkerAfter, tableMarkerBefore, tableResizer, tableResizerWidthVar, tableRoot, tableRow, tableTemplateVar, tableWindowedRow };
+
+//# sourceMappingURL=Table.css.js.map

package/dist/Fundamentals/Table/Table.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.css.js","names":[],"sources":["../../../src/Fundamentals/Table/Table.css.ts"],"sourcesContent":["import { createVar, style } from \"@vanilla-extract/css\";\r\n\r\nexport const tableTemplateVar = createVar();\r\nexport const tableResizerWidthVar = createVar();\r\n\r\nexport const tableRoot = style({\r\n    display: \"block\",\r\n    width: \"100%\",\r\n});\r\n\r\nexport const tableHeader = style({\r\n    position: \"sticky\",\r\n    top: 0,\r\n    zIndex: 1,\r\n});\r\n\r\nexport const tableBody = style({\r\n    position: \"relative\",\r\n    width: \"100%\",\r\n});\r\n\r\nexport const tableRow = style({\r\n    display: \"grid\",\r\n    gridTemplateColumns: tableTemplateVar,\r\n    width: \"100%\",\r\n});\r\n\r\nexport const tableWindowedRow = style({\r\n    position: \"absolute\",\r\n    top: 0,\r\n    left: 0,\r\n});\r\n\r\nexport const tableCell = style({\r\n    position: \"relative\",\r\n    minWidth: 0,\r\n});\r\n\r\nconst tableMarker = style({\r\n    position: \"absolute\",\r\n    top: 0,\r\n    bottom: 0,\r\n    pointerEvents: \"none\",\r\n});\r\n\r\nexport const tableMarkerBefore = style([tableMarker, { left: 0 }]);\r\n\r\nexport const tableMarkerAfter = style([tableMarker, { right: 0 }]);\r\n\r\nexport const tableResizer = style({\r\n    position: \"absolute\",\r\n    top: 0,\r\n    right: 0,\r\n    bottom: 0,\r\n    width: tableResizerWidthVar,\r\n    padding: 0,\r\n    border: \"none\",\r\n    background: \"none\",\r\n    cursor: \"col-resize\",\r\n    touchAction: \"none\",\r\n    userSelect: \"none\",\r\n});\r\n"],"mappings":""}