@edo-w/flatline-solid 0.2.0

package/dist/src/components/checkbox/checkbox-group.jsx

@@ -0,0 +1,43 @@
+import clsx from 'clsx/lite';
+import { createSignal, createUniqueId, splitProps } from 'solid-js';
+import { checkboxClass } from './class';
+import { CheckboxGroupContext } from './context';
+import './checkbox-group.css';
+export function CheckboxGroup(props) {
+    const generatedName = createUniqueId();
+    const [local, rest] = splitProps(props, [
+        'class',
+        'children',
+        'value',
+        'defaultValue',
+        'name',
+        'disabled',
+        'onChange',
+    ]);
+    const [internalValue, setInternalValue] = createSignal(local.defaultValue ?? []);
+    const values = () => local.value ?? internalValue();
+    const name = () => local.name ?? generatedName;
+    const disabled = () => Boolean(local.disabled);
+    const toggleValue = (nextValue, checked) => {
+        const current = values();
+        let next = current;
+        if (checked) {
+            if (!current.includes(nextValue)) {
+                next = [...current, nextValue];
+            }
+        }
+        else {
+            next = current.filter((value) => value !== nextValue);
+        }
+        if (local.value === undefined) {
+            setInternalValue(next);
+        }
+        local.onChange?.(next);
+    };
+    return (<CheckboxGroupContext.Provider value={{ name, values, toggleValue, disabled }}>
+			<div class={clsx(checkboxClass.group, local.class)} role="group" {...rest}>
+				{local.children}
+			</div>
+		</CheckboxGroupContext.Provider>);
+}
+//# sourceMappingURL=checkbox-group.jsx.map

package/dist/src/components/checkbox/checkbox-group.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-group.jsx","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox-group.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACpE,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAC;AAEjD,OAAO,sBAAsB,CAAC;AAE9B,MAAM,UAAU,aAAa,CAAC,KAAyB;IACtD,MAAM,aAAa,GAAG,cAAc,EAAE,CAAC;IACvC,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE;QACvC,OAAO;QACP,UAAU;QACV,OAAO;QACP,cAAc;QACd,MAAM;QACN,UAAU;QACV,UAAU;KACV,CAAC,CAAC;IACH,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,YAAY,CAAC,KAAK,CAAC,YAAY,IAAI,EAAE,CAAC,CAAC;IAEjF,MAAM,MAAM,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,KAAK,IAAI,aAAa,EAAE,CAAC;IACpD,MAAM,IAAI,GAAG,GAAG,EAAE,CAAC,KAAK,CAAC,IAAI,IAAI,aAAa,CAAC;IAC/C,MAAM,QAAQ,GAAG,GAAG,EAAE,CAAC,OAAO,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC/C,MAAM,WAAW,GAAG,CAAC,SAAiB,EAAE,OAAgB,EAAE,EAAE;QAC3D,MAAM,OAAO,GAAG,MAAM,EAAE,CAAC;QACzB,IAAI,IAAI,GAAG,OAAO,CAAC;QAEnB,IAAI,OAAO,EAAE,CAAC;YACb,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,EAAE,CAAC;gBAClC,IAAI,GAAG,CAAC,GAAG,OAAO,EAAE,SAAS,CAAC,CAAC;YAChC,CAAC;QACF,CAAC;aAAM,CAAC;YACP,IAAI,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,KAAK,SAAS,CAAC,CAAC;QACvD,CAAC;QAED,IAAI,KAAK,CAAC,KAAK,KAAK,SAAS,EAAE,CAAC;YAC/B,gBAAgB,CAAC,IAAI,CAAC,CAAC;QACxB,CAAC;QAED,KAAK,CAAC,QAAQ,EAAE,CAAC,IAAI,CAAC,CAAC;IACxB,CAAC,CAAC;IAEF,OAAO,CACN,CAAC,oBAAoB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,CAAC,CAC7E;GAAA,CAAC,GAAG,CACH,KAAK,CAAC,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,CAC9C,IAAI,CAAC,OAAO,CACZ,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,KAAK,CAAC,QAAQ,CAChB;GAAA,EAAE,GAAG,CACN;EAAA,EAAE,oBAAoB,CAAC,QAAQ,CAAC,CAChC,CAAC;AACH,CAAC","sourcesContent":["import clsx from 'clsx/lite';\nimport { createSignal, createUniqueId, splitProps } from 'solid-js';\nimport { checkboxClass } from './class';\nimport { CheckboxGroupContext } from './context';\nimport type { CheckboxGroupProps } from './types';\nimport './checkbox-group.css';\n\nexport function CheckboxGroup(props: CheckboxGroupProps) {\n\tconst generatedName = createUniqueId();\n\tconst [local, rest] = splitProps(props, [\n\t\t'class',\n\t\t'children',\n\t\t'value',\n\t\t'defaultValue',\n\t\t'name',\n\t\t'disabled',\n\t\t'onChange',\n\t]);\n\tconst [internalValue, setInternalValue] = createSignal(local.defaultValue ?? []);\n\n\tconst values = () => local.value ?? internalValue();\n\tconst name = () => local.name ?? generatedName;\n\tconst disabled = () => Boolean(local.disabled);\n\tconst toggleValue = (nextValue: string, checked: boolean) => {\n\t\tconst current = values();\n\t\tlet next = current;\n\n\t\tif (checked) {\n\t\t\tif (!current.includes(nextValue)) {\n\t\t\t\tnext = [...current, nextValue];\n\t\t\t}\n\t\t} else {\n\t\t\tnext = current.filter((value) => value !== nextValue);\n\t\t}\n\n\t\tif (local.value === undefined) {\n\t\t\tsetInternalValue(next);\n\t\t}\n\n\t\tlocal.onChange?.(next);\n\t};\n\n\treturn (\n\t\t<CheckboxGroupContext.Provider value={{ name, values, toggleValue, disabled }}>\n\t\t\t<div\n\t\t\t\tclass={clsx(checkboxClass.group, local.class)}\n\t\t\t\trole=\"group\"\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t</div>\n\t\t</CheckboxGroupContext.Provider>\n\t);\n}\n"]}

package/dist/src/components/checkbox/checkbox-root.css

@@ -0,0 +1,85 @@
+@layer components {
+	.fl-checkbox {
+		/* layout */
+		display: inline-flex;
+		align-items: center;
+
+		/* spacing */
+		gap: var(--fl-size-2);
+
+		/* pointer */
+		cursor: pointer;
+		user-select: none;
+	}
+
+	.fl-checkbox[data-disabled] {
+		cursor: var(--fl-disabled-cursor);
+		opacity: var(--fl-disabled-opacity);
+	}
+
+	.fl-checkbox .fl-checkbox_input {
+		/* layout */
+		position: absolute;
+		opacity: 0;
+		width: 1px;
+		height: 1px;
+		pointer-events: none;
+	}
+
+	.fl-checkbox .fl-checkbox_control {
+		/* layout */
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		width: var(--fl-size-4);
+		height: var(--fl-size-4);
+
+		/* background */
+		background: var(--fl-body-bg-color);
+		border: var(--fl-input-border-size, var(--fl-border-size, 1px)) solid
+			var(--fl-input-border-color, var(--fl-border-color));
+		border-radius: var(--fl-radius-sm);
+		color: var(--fl-secondary-text-color);
+
+		/* effects */
+		box-shadow: var(--fl-input-shadow);
+		transition:
+			background var(--fl-animation-duration) ease,
+			border-color var(--fl-animation-duration) ease,
+			color var(--fl-animation-duration) ease;
+	}
+
+	.fl-checkbox .fl-checkbox_indicator {
+		/* layout */
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		width: 100%;
+		height: 100%;
+
+		/* effects */
+		scale: 0;
+		transition: scale var(--fl-animation-duration) ease;
+	}
+
+	.fl-checkbox .fl-checkbox_input:checked + .fl-checkbox_control {
+		background: var(--fl-primary-color);
+		border-color: color-mix(in oklab, var(--fl-primary-color), black 20%);
+		color: var(--fl-primary-text-color);
+	}
+
+	.fl-checkbox .fl-checkbox_input:checked + .fl-checkbox_control .fl-checkbox_indicator {
+		scale: 1;
+	}
+
+	.fl-checkbox .fl-checkbox_input:focus-visible + .fl-checkbox_control {
+		outline: var(--fl-focus-ring-size) solid var(--fl-focus-ring-color);
+		outline-offset: var(--fl-focus-ring-offset);
+	}
+
+	.fl-checkbox .fl-checkbox_label {
+		/* text */
+		color: var(--fl-body-text-color);
+		font-size: var(--fl-text-size-base);
+	}
+}

package/dist/src/components/checkbox/checkbox-root.d.ts

@@ -0,0 +1,4 @@
+import { type JSX } from 'solid-js';
+import type { CheckboxProps } from './types';
+import './checkbox-root.css';
+export declare function CheckboxRoot(props: CheckboxProps): JSX.Element;

package/dist/src/components/checkbox/checkbox-root.jsx

@@ -0,0 +1,55 @@
+import clsx from 'clsx/lite';
+import { createSignal, mergeProps, splitProps } from 'solid-js';
+import { CheckIcon } from '#src/icons';
+import { checkboxClass } from './class';
+import { useCheckboxGroupContext } from './context';
+import './checkbox-root.css';
+export function CheckboxRoot(props) {
+    const context = useCheckboxGroupContext();
+    const merged = mergeProps({
+        type: 'checkbox',
+        value: 'on',
+    }, props);
+    const [local, rest] = splitProps(merged, [
+        'checked',
+        'children',
+        'class',
+        'defaultChecked',
+        'disabled',
+        'name',
+        'onChange',
+        'type',
+        'value',
+    ]);
+    const [internalChecked, setInternalChecked] = createSignal(Boolean(local.defaultChecked));
+    const rootClass = () => clsx(checkboxClass.root, local.class);
+    const checked = () => {
+        if (context) {
+            return context.values().includes(local.value);
+        }
+        return local.checked ?? internalChecked();
+    };
+    const disabled = () => Boolean(context?.disabled() || local.disabled);
+    const name = () => context?.name() ?? local.name;
+    const handleChange = (event) => {
+        const nextChecked = event.currentTarget.checked;
+        local.onChange?.(nextChecked);
+        if (context) {
+            context.toggleValue(local.value, nextChecked);
+            return;
+        }
+        if (local.checked === undefined) {
+            setInternalChecked(nextChecked);
+        }
+    };
+    return (<label class={rootClass()} data-disabled={disabled() ? '' : undefined}>
+			<input class={checkboxClass.input} type="checkbox" value={local.value} name={name()} checked={checked()} disabled={disabled()} onChange={handleChange} {...rest}/>
+			<span class={checkboxClass.control}>
+				<span class={checkboxClass.indicator}>
+					<CheckIcon w="0.875rem" h="0.875rem"/>
+				</span>
+			</span>
+			{local.children ? <span class={checkboxClass.label}>{local.children}</span> : null}
+		</label>);
+}
+//# sourceMappingURL=checkbox-root.jsx.map

package/dist/src/components/checkbox/checkbox-root.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox-root.jsx","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox-root.tsx"],"names":[],"mappings":"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","sourcesContent":["import clsx from 'clsx/lite';\nimport { createSignal, type JSX, mergeProps, splitProps } from 'solid-js';\nimport { CheckIcon } from '#src/icons';\nimport { checkboxClass } from './class';\nimport { useCheckboxGroupContext } from './context';\nimport type { CheckboxProps } from './types';\nimport './checkbox-root.css';\n\nexport function CheckboxRoot(props: CheckboxProps) {\n\tconst context = useCheckboxGroupContext();\n\tconst merged = mergeProps(\n\t\t{\n\t\t\ttype: 'checkbox',\n\t\t\tvalue: 'on',\n\t\t} as const,\n\t\tprops,\n\t);\n\tconst [local, rest] = splitProps(merged, [\n\t\t'checked',\n\t\t'children',\n\t\t'class',\n\t\t'defaultChecked',\n\t\t'disabled',\n\t\t'name',\n\t\t'onChange',\n\t\t'type',\n\t\t'value',\n\t]);\n\tconst [internalChecked, setInternalChecked] = createSignal(Boolean(local.defaultChecked));\n\tconst rootClass = () => clsx(checkboxClass.root, local.class);\n\tconst checked = () => {\n\t\tif (context) {\n\t\t\treturn context.values().includes(local.value);\n\t\t}\n\n\t\treturn local.checked ?? internalChecked();\n\t};\n\tconst disabled = () => Boolean(context?.disabled() || local.disabled);\n\tconst name = () => context?.name() ?? local.name;\n\n\tconst handleChange: JSX.EventHandlerUnion<HTMLInputElement, Event> = (event) => {\n\t\tconst nextChecked = event.currentTarget.checked;\n\t\tlocal.onChange?.(nextChecked);\n\n\t\tif (context) {\n\t\t\tcontext.toggleValue(local.value, nextChecked);\n\t\t\treturn;\n\t\t}\n\n\t\tif (local.checked === undefined) {\n\t\t\tsetInternalChecked(nextChecked);\n\t\t}\n\t};\n\n\treturn (\n\t\t<label\n\t\t\tclass={rootClass()}\n\t\t\tdata-disabled={disabled() ? '' : undefined}\n\t\t>\n\t\t\t<input\n\t\t\t\tclass={checkboxClass.input}\n\t\t\t\ttype=\"checkbox\"\n\t\t\t\tvalue={local.value}\n\t\t\t\tname={name()}\n\t\t\t\tchecked={checked()}\n\t\t\t\tdisabled={disabled()}\n\t\t\t\tonChange={handleChange}\n\t\t\t\t{...rest}\n\t\t\t/>\n\t\t\t<span class={checkboxClass.control}>\n\t\t\t\t<span class={checkboxClass.indicator}>\n\t\t\t\t\t<CheckIcon\n\t\t\t\t\t\tw=\"0.875rem\"\n\t\t\t\t\t\th=\"0.875rem\"\n\t\t\t\t\t/>\n\t\t\t\t</span>\n\t\t\t</span>\n\t\t\t{local.children ? <span class={checkboxClass.label}>{local.children}</span> : null}\n\t\t</label>\n\t);\n}\n"]}

package/dist/src/components/checkbox/checkbox.d.ts

@@ -0,0 +1,9 @@
+import type { JSX } from 'solid-js';
+import { CheckboxGroup } from './checkbox-group';
+import type { CheckboxProps } from './types';
+export type { CheckboxBaseProps, CheckboxGroupBaseProps, CheckboxGroupProps, CheckboxProps } from './types';
+export interface CheckboxComponent {
+    (props: CheckboxProps): JSX.Element;
+    Group: typeof CheckboxGroup;
+}
+export declare const Checkbox: CheckboxComponent;

package/dist/src/components/checkbox/checkbox.jsx

@@ -0,0 +1,6 @@
+import { CheckboxGroup } from './checkbox-group';
+import { CheckboxRoot } from './checkbox-root';
+export const Checkbox = Object.assign(CheckboxRoot, {
+    Group: CheckboxGroup,
+});
+//# sourceMappingURL=checkbox.jsx.map

package/dist/src/components/checkbox/checkbox.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"checkbox.jsx","sourceRoot":"","sources":["../../../../src/components/checkbox/checkbox.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAU/C,MAAM,CAAC,MAAM,QAAQ,GAAsB,MAAM,CAAC,MAAM,CAAC,YAAY,EAAE;IACtE,KAAK,EAAE,aAAa;CACpB,CAAC,CAAC","sourcesContent":["import type { JSX } from 'solid-js';\nimport { CheckboxGroup } from './checkbox-group';\nimport { CheckboxRoot } from './checkbox-root';\nimport type { CheckboxProps } from './types';\n\nexport type { CheckboxBaseProps, CheckboxGroupBaseProps, CheckboxGroupProps, CheckboxProps } from './types';\n\nexport interface CheckboxComponent {\n\t(props: CheckboxProps): JSX.Element;\n\tGroup: typeof CheckboxGroup;\n}\n\nexport const Checkbox: CheckboxComponent = Object.assign(CheckboxRoot, {\n\tGroup: CheckboxGroup,\n});\n"]}

package/dist/src/components/checkbox/class.d.ts

@@ -0,0 +1,8 @@
+export declare const checkboxClass: {
+    readonly group: 'fl-checkbox-group';
+    readonly root: 'fl-checkbox';
+    readonly input: 'fl-checkbox_input';
+    readonly control: 'fl-checkbox_control';
+    readonly indicator: 'fl-checkbox_indicator';
+    readonly label: 'fl-checkbox_label';
+};

package/dist/src/components/checkbox/class.js

@@ -0,0 +1,9 @@
+export const checkboxClass = {
+    group: 'fl-checkbox-group',
+    root: 'fl-checkbox',
+    input: 'fl-checkbox_input',
+    control: 'fl-checkbox_control',
+    indicator: 'fl-checkbox_indicator',
+    label: 'fl-checkbox_label',
+};
+//# sourceMappingURL=class.js.map

package/dist/src/components/checkbox/class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"class.js","sourceRoot":"","sources":["../../../../src/components/checkbox/class.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG;IAC5B,KAAK,EAAE,mBAAmB;IAC1B,IAAI,EAAE,aAAa;IACnB,KAAK,EAAE,mBAAmB;IAC1B,OAAO,EAAE,qBAAqB;IAC9B,SAAS,EAAE,uBAAuB;IAClC,KAAK,EAAE,mBAAmB;CACjB,CAAC","sourcesContent":["export const checkboxClass = {\n\tgroup: 'fl-checkbox-group',\n\troot: 'fl-checkbox',\n\tinput: 'fl-checkbox_input',\n\tcontrol: 'fl-checkbox_control',\n\tindicator: 'fl-checkbox_indicator',\n\tlabel: 'fl-checkbox_label',\n} as const;\n"]}

package/dist/src/components/checkbox/context.d.ts

@@ -0,0 +1,9 @@
+import { type Accessor } from 'solid-js';
+export interface CheckboxGroupContextValue {
+    name: Accessor<string>;
+    values: Accessor<string[]>;
+    toggleValue: (value: string, checked: boolean) => void;
+    disabled: Accessor<boolean>;
+}
+export declare const CheckboxGroupContext: import("solid-js").Context<CheckboxGroupContextValue | undefined>;
+export declare function useCheckboxGroupContext(): CheckboxGroupContextValue | undefined;

package/dist/src/components/checkbox/context.js

@@ -0,0 +1,6 @@
+import { createContext, useContext } from 'solid-js';
+export const CheckboxGroupContext = createContext();
+export function useCheckboxGroupContext() {
+    return useContext(CheckboxGroupContext);
+}
+//# sourceMappingURL=context.js.map

package/dist/src/components/checkbox/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../src/components/checkbox/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAiB,aAAa,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AASpE,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,EAA6B,CAAC;AAE/E,MAAM,UAAU,uBAAuB;IACtC,OAAO,UAAU,CAAC,oBAAoB,CAAC,CAAC;AACzC,CAAC","sourcesContent":["import { type Accessor, createContext, useContext } from 'solid-js';\n\nexport interface CheckboxGroupContextValue {\n\tname: Accessor<string>;\n\tvalues: Accessor<string[]>;\n\ttoggleValue: (value: string, checked: boolean) => void;\n\tdisabled: Accessor<boolean>;\n}\n\nexport const CheckboxGroupContext = createContext<CheckboxGroupContextValue>();\n\nexport function useCheckboxGroupContext() {\n\treturn useContext(CheckboxGroupContext);\n}\n"]}

package/dist/src/components/checkbox/index.d.ts

@@ -0,0 +1,6 @@
+export * from './checkbox';
+export * from './checkbox-group';
+export * from './checkbox-root';
+export * from './class';
+export * from './context';
+export * from './types';

package/dist/src/components/checkbox/index.js

@@ -0,0 +1,7 @@
+export * from './checkbox';
+export * from './checkbox-group';
+export * from './checkbox-root';
+export * from './class';
+export * from './context';
+export * from './types';
+//# sourceMappingURL=index.js.map

package/dist/src/components/checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/checkbox/index.ts"],"names":[],"mappings":"AAAA,cAAc,YAAY,CAAC;AAC3B,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,SAAS,CAAC","sourcesContent":["export * from './checkbox';\nexport * from './checkbox-group';\nexport * from './checkbox-root';\nexport * from './class';\nexport * from './context';\nexport * from './types';\n"]}

package/dist/src/components/checkbox/types.d.ts

@@ -0,0 +1,16 @@
+import type { JSX } from 'solid-js';
+export type CheckboxGroupBaseProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, 'onChange'>;
+export interface CheckboxGroupProps extends CheckboxGroupBaseProps {
+    value?: string[];
+    defaultValue?: string[];
+    name?: string;
+    disabled?: boolean;
+    onChange?: (value: string[]) => void;
+}
+export type CheckboxBaseProps = Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange' | 'size'>;
+export interface CheckboxProps extends CheckboxBaseProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    value?: string;
+    onChange?: (checked: boolean) => void;
+}

package/dist/src/components/checkbox/types.js

@@ -0,0 +1 @@
+//# sourceMappingURL=types.js.map

package/dist/src/components/checkbox/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../src/components/checkbox/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { JSX } from 'solid-js';\n\nexport type CheckboxGroupBaseProps = Omit<JSX.HTMLAttributes<HTMLDivElement>, 'onChange'>;\n\nexport interface CheckboxGroupProps extends CheckboxGroupBaseProps {\n\tvalue?: string[];\n\tdefaultValue?: string[];\n\tname?: string;\n\tdisabled?: boolean;\n\tonChange?: (value: string[]) => void;\n}\n\nexport type CheckboxBaseProps = Omit<JSX.InputHTMLAttributes<HTMLInputElement>, 'type' | 'onChange' | 'size'>;\n\nexport interface CheckboxProps extends CheckboxBaseProps {\n\tchecked?: boolean;\n\tdefaultChecked?: boolean;\n\tvalue?: string;\n\tonChange?: (checked: boolean) => void;\n}\n"]}

package/dist/src/components/combobox/class.d.ts

@@ -0,0 +1,13 @@
+export declare const comboboxClass: {
+    readonly root: 'fl-combobox';
+    readonly control: 'fl-combobox_control';
+    readonly input: 'fl-combobox_input';
+    readonly trigger: 'fl-combobox_trigger';
+    readonly icon: 'fl-combobox_icon';
+    readonly content: 'fl-combobox_content';
+    readonly listbox: 'fl-combobox_listbox';
+    readonly item: 'fl-combobox_item';
+    readonly itemLabel: 'fl-combobox_item-label';
+    readonly itemIndicator: 'fl-combobox_item-indicator';
+    readonly group: 'fl-combobox_group';
+};

package/dist/src/components/combobox/class.js

@@ -0,0 +1,14 @@
+export const comboboxClass = {
+    root: 'fl-combobox',
+    control: 'fl-combobox_control',
+    input: 'fl-combobox_input',
+    trigger: 'fl-combobox_trigger',
+    icon: 'fl-combobox_icon',
+    content: 'fl-combobox_content',
+    listbox: 'fl-combobox_listbox',
+    item: 'fl-combobox_item',
+    itemLabel: 'fl-combobox_item-label',
+    itemIndicator: 'fl-combobox_item-indicator',
+    group: 'fl-combobox_group',
+};
+//# sourceMappingURL=class.js.map

package/dist/src/components/combobox/class.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"class.js","sourceRoot":"","sources":["../../../../src/components/combobox/class.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,aAAa,GAAG;IAC5B,IAAI,EAAE,aAAa;IACnB,OAAO,EAAE,qBAAqB;IAC9B,KAAK,EAAE,mBAAmB;IAC1B,OAAO,EAAE,qBAAqB;IAC9B,IAAI,EAAE,kBAAkB;IACxB,OAAO,EAAE,qBAAqB;IAC9B,OAAO,EAAE,qBAAqB;IAC9B,IAAI,EAAE,kBAAkB;IACxB,SAAS,EAAE,wBAAwB;IACnC,aAAa,EAAE,4BAA4B;IAC3C,KAAK,EAAE,mBAAmB;CACjB,CAAC","sourcesContent":["export const comboboxClass = {\n\troot: 'fl-combobox',\n\tcontrol: 'fl-combobox_control',\n\tinput: 'fl-combobox_input',\n\ttrigger: 'fl-combobox_trigger',\n\ticon: 'fl-combobox_icon',\n\tcontent: 'fl-combobox_content',\n\tlistbox: 'fl-combobox_listbox',\n\titem: 'fl-combobox_item',\n\titemLabel: 'fl-combobox_item-label',\n\titemIndicator: 'fl-combobox_item-indicator',\n\tgroup: 'fl-combobox_group',\n} as const;\n"]}

package/dist/src/components/combobox/combobox-content.css

@@ -0,0 +1,20 @@
+@layer components {
+	.fl-combobox_content {
+		/* layout */
+		position: absolute;
+		top: calc(100% + var(--fl-size-1));
+		left: 0;
+		right: 0;
+		z-index: 10;
+		max-height: 19rem;
+		overflow: hidden;
+
+		/* background */
+		background: var(--fl-body-bg-color);
+		border: var(--fl-border-size, 1px) solid var(--fl-border-color);
+		border-radius: var(--fl-border-radius);
+
+		/* effects */
+		box-shadow: var(--fl-shadow-md);
+	}
+}

package/dist/src/components/combobox/combobox-content.d.ts

@@ -0,0 +1,2 @@
+import type { ComboboxContentProps } from './types';
+export declare function ComboboxContent(props: ComboboxContentProps): import("solid-js").JSX.Element;

package/dist/src/components/combobox/combobox-content.jsx

@@ -0,0 +1,15 @@
+import clsx from 'clsx/lite';
+import { Show, splitProps } from 'solid-js';
+import { comboboxClass } from './class';
+import { useComboboxContext } from './context';
+export function ComboboxContent(props) {
+    const context = useComboboxContext();
+    const [local, rest] = splitProps(props, ['class', 'children']);
+    const rootClass = () => clsx(comboboxClass.content, local.class);
+    return (<Show when={context.isOpen()}>
+			<div class={rootClass()} {...rest}>
+				{local.children}
+			</div>
+		</Show>);
+}
+//# sourceMappingURL=combobox-content.jsx.map

package/dist/src/components/combobox/combobox-content.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-content.jsx","sourceRoot":"","sources":["../../../../src/components/combobox/combobox-content.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAG/C,MAAM,UAAU,eAAe,CAAC,KAA2B;IAC1D,MAAM,OAAO,GAAG,kBAAkB,EAAY,CAAC;IAC/C,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAEjE,OAAO,CACN,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAC5B;GAAA,CAAC,GAAG,CACH,KAAK,CAAC,CAAC,SAAS,EAAE,CAAC,CACnB,IAAI,IAAI,CAAC,CAET;IAAA,CAAC,KAAK,CAAC,QAAQ,CAChB;GAAA,EAAE,GAAG,CACN;EAAA,EAAE,IAAI,CAAC,CACP,CAAC;AACH,CAAC","sourcesContent":["import clsx from 'clsx/lite';\nimport { Show, splitProps } from 'solid-js';\nimport { comboboxClass } from './class';\nimport { useComboboxContext } from './context';\nimport type { ComboboxContentProps } from './types';\n\nexport function ComboboxContent(props: ComboboxContentProps) {\n\tconst context = useComboboxContext<any, any>();\n\tconst [local, rest] = splitProps(props, ['class', 'children']);\n\tconst rootClass = () => clsx(comboboxClass.content, local.class);\n\n\treturn (\n\t\t<Show when={context.isOpen()}>\n\t\t\t<div\n\t\t\t\tclass={rootClass()}\n\t\t\t\t{...rest}\n\t\t\t>\n\t\t\t\t{local.children}\n\t\t\t</div>\n\t\t</Show>\n\t);\n}\n"]}

package/dist/src/components/combobox/combobox-control.css

@@ -0,0 +1,29 @@
+@layer components {
+	.fl-combobox_control {
+		/* layout */
+		display: inline-flex;
+		align-items: stretch;
+		width: 100%;
+		min-width: 0;
+
+		/* background */
+		background: var(--fl-input-bg-color, var(--fl-body-bg-color));
+		border: var(--fl-input-border-size, var(--fl-border-size, 1px)) solid
+			var(--fl-input-border-color, var(--fl-border-color));
+		border-radius: var(--fl-input-border-radius, var(--fl-border-radius));
+
+		/* effects */
+		box-shadow: var(--fl-input-shadow);
+	}
+
+	.fl-combobox_control:focus-within {
+		border-color: var(--fl-input-border-focus-color, var(--fl-focus-ring-color));
+		outline: var(--fl-focus-ring-size) solid var(--fl-focus-ring-color);
+		outline-offset: 0;
+	}
+
+	.fl-combobox_control[data-disabled] {
+		cursor: var(--fl-disabled-cursor);
+		opacity: var(--fl-disabled-opacity);
+	}
+}

package/dist/src/components/combobox/combobox-control.d.ts

@@ -0,0 +1,3 @@
+import { type JSX } from 'solid-js';
+import type { ComboboxControlProps } from './types';
+export declare function ComboboxControl(props: ComboboxControlProps): JSX.Element;

package/dist/src/components/combobox/combobox-control.jsx

@@ -0,0 +1,19 @@
+import clsx from 'clsx/lite';
+import { splitProps } from 'solid-js';
+import { comboboxClass } from './class';
+import { useComboboxContext } from './context';
+import { callEventHandler } from './util';
+export function ComboboxControl(props) {
+    const context = useComboboxContext();
+    const [local, rest] = splitProps(props, ['class', 'onMouseDown']);
+    const rootClass = () => clsx(comboboxClass.control, local.class);
+    const handleMouseDown = (event) => {
+        callEventHandler(local.onMouseDown, event);
+        if (context.disabled() || context.readOnly()) {
+            return;
+        }
+        context.openPopup('preserve');
+    };
+    return (<div class={rootClass()} data-disabled={context.disabled() ? '' : undefined} onMouseDown={handleMouseDown} {...rest}/>);
+}
+//# sourceMappingURL=combobox-control.jsx.map

package/dist/src/components/combobox/combobox-control.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-control.jsx","sourceRoot":"","sources":["../../../../src/components/combobox/combobox-control.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAY,UAAU,EAAE,MAAM,UAAU,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAE/C,OAAO,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAC;AAE1C,MAAM,UAAU,eAAe,CAAC,KAA2B;IAC1D,MAAM,OAAO,GAAG,kBAAkB,EAAY,CAAC;IAC/C,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IAClE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAEjE,MAAM,eAAe,GAAsD,CAAC,KAAK,EAAE,EAAE;QACpF,gBAAgB,CAAC,KAAK,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;QAE3C,IAAI,OAAO,CAAC,QAAQ,EAAE,IAAI,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC;YAC9C,OAAO;QACR,CAAC;QAED,OAAO,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,OAAO,CACN,CAAC,GAAG,CACH,KAAK,CAAC,CAAC,SAAS,EAAE,CAAC,CACnB,aAAa,CAAC,CAAC,OAAO,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,CAAC,CACnD,WAAW,CAAC,CAAC,eAAe,CAAC,CAC7B,IAAI,IAAI,CAAC,EACR,CACF,CAAC;AACH,CAAC","sourcesContent":["import clsx from 'clsx/lite';\nimport { type JSX, splitProps } from 'solid-js';\nimport { comboboxClass } from './class';\nimport { useComboboxContext } from './context';\nimport type { ComboboxControlProps } from './types';\nimport { callEventHandler } from './util';\n\nexport function ComboboxControl(props: ComboboxControlProps) {\n\tconst context = useComboboxContext<any, any>();\n\tconst [local, rest] = splitProps(props, ['class', 'onMouseDown']);\n\tconst rootClass = () => clsx(comboboxClass.control, local.class);\n\n\tconst handleMouseDown: JSX.EventHandlerUnion<HTMLDivElement, MouseEvent> = (event) => {\n\t\tcallEventHandler(local.onMouseDown, event);\n\n\t\tif (context.disabled() || context.readOnly()) {\n\t\t\treturn;\n\t\t}\n\n\t\tcontext.openPopup('preserve');\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclass={rootClass()}\n\t\t\tdata-disabled={context.disabled() ? '' : undefined}\n\t\t\tonMouseDown={handleMouseDown}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"]}

package/dist/src/components/combobox/combobox-group.css

@@ -0,0 +1,31 @@
+@layer components {
+	.fl-combobox_group {
+		/* reset */
+		list-style: none;
+
+		/* layout */
+		display: grid;
+
+		/* spacing */
+		gap: var(--fl-size-1);
+		padding-bottom: var(--fl-size-1);
+
+		/* text */
+		color: var(--fl-body-muted-text-color);
+		font-weight: var(--fl-font-weight-semibold);
+		font-size: var(--fl-text-size-xs);
+	}
+
+	.fl-combobox_group hr {
+		/* spacing */
+		margin-block: var(--fl-size-1-5);
+		margin-inline: calc(var(--fl-size-2) * -1);
+
+		/* background */
+		border-top: var(--fl-border-size, 1px) solid var(--fl-border-color);
+	}
+
+	.fl-combobox_group:first-child hr {
+		display: none;
+	}
+}

package/dist/src/components/combobox/combobox-group.d.ts

@@ -0,0 +1,2 @@
+import type { ComboboxGroupProps } from './types';
+export declare function ComboboxGroup<TOptionGroup = any, TOption = any>(props: ComboboxGroupProps<TOptionGroup, TOption>): import("solid-js").JSX.Element;

package/dist/src/components/combobox/combobox-group.jsx

@@ -0,0 +1,12 @@
+import clsx from 'clsx/lite';
+import { splitProps } from 'solid-js';
+import { comboboxClass } from './class';
+export function ComboboxGroup(props) {
+    const [local, rest] = splitProps(props, ['class', 'group', 'children']);
+    const rootClass = () => clsx(comboboxClass.group, local.class);
+    return (<li class={rootClass()} role="presentation" {...rest}>
+			<hr aria-hidden="true"/>
+			<span>{local.children ?? local.group?.textValue}</span>
+		</li>);
+}
+//# sourceMappingURL=combobox-group.jsx.map

package/dist/src/components/combobox/combobox-group.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-group.jsx","sourceRoot":"","sources":["../../../../src/components/combobox/combobox-group.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxC,MAAM,UAAU,aAAa,CAAoC,KAAgD;IAChH,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,OAAO,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IACxE,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAE/D,OAAO,CACN,CAAC,EAAE,CACF,KAAK,CAAC,CAAC,SAAS,EAAE,CAAC,CACnB,IAAI,CAAC,cAAc,CACnB,IAAI,IAAI,CAAC,CAET;GAAA,CAAC,EAAE,CAAC,WAAW,CAAC,MAAM,EACtB;GAAA,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,KAAK,EAAE,SAAS,CAAC,EAAE,IAAI,CACvD;EAAA,EAAE,EAAE,CAAC,CACL,CAAC;AACH,CAAC","sourcesContent":["import clsx from 'clsx/lite';\nimport { splitProps } from 'solid-js';\nimport { comboboxClass } from './class';\nimport type { ComboboxGroupProps } from './types';\n\nexport function ComboboxGroup<TOptionGroup = any, TOption = any>(props: ComboboxGroupProps<TOptionGroup, TOption>) {\n\tconst [local, rest] = splitProps(props, ['class', 'group', 'children']);\n\tconst rootClass = () => clsx(comboboxClass.group, local.class);\n\n\treturn (\n\t\t<li\n\t\t\tclass={rootClass()}\n\t\t\trole=\"presentation\"\n\t\t\t{...rest}\n\t\t>\n\t\t\t<hr aria-hidden=\"true\" />\n\t\t\t<span>{local.children ?? local.group?.textValue}</span>\n\t\t</li>\n\t);\n}\n"]}

package/dist/src/components/combobox/combobox-hidden-select.d.ts

@@ -0,0 +1,2 @@
+import type { ComboboxHiddenSelectProps } from './types';
+export declare function ComboboxHiddenSelect(props: ComboboxHiddenSelectProps): import("solid-js").JSX.Element;

package/dist/src/components/combobox/combobox-hidden-select.jsx

@@ -0,0 +1,8 @@
+import { splitProps } from 'solid-js';
+import { useComboboxContext } from './context';
+export function ComboboxHiddenSelect(props) {
+    const context = useComboboxContext();
+    const [local, rest] = splitProps(props, ['name', 'value']);
+    return (<input type="hidden" name={local.name ?? context.name()} value={local.value ?? context.selectedItem()?.value ?? ''} {...rest}/>);
+}
+//# sourceMappingURL=combobox-hidden-select.jsx.map

package/dist/src/components/combobox/combobox-hidden-select.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-hidden-select.jsx","sourceRoot":"","sources":["../../../../src/components/combobox/combobox-hidden-select.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,kBAAkB,EAAE,MAAM,WAAW,CAAC;AAG/C,MAAM,UAAU,oBAAoB,CAAC,KAAgC;IACpE,MAAM,OAAO,GAAG,kBAAkB,EAAY,CAAC;IAC/C,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IAE3D,OAAO,CACN,CAAC,KAAK,CACL,IAAI,CAAC,QAAQ,CACb,IAAI,CAAC,CAAC,KAAK,CAAC,IAAI,IAAI,OAAO,CAAC,IAAI,EAAE,CAAC,CACnC,KAAK,CAAC,CAAC,KAAK,CAAC,KAAK,IAAI,OAAO,CAAC,YAAY,EAAE,EAAE,KAAK,IAAI,EAAE,CAAC,CAC1D,IAAI,IAAI,CAAC,EACR,CACF,CAAC;AACH,CAAC","sourcesContent":["import { splitProps } from 'solid-js';\nimport { useComboboxContext } from './context';\nimport type { ComboboxHiddenSelectProps } from './types';\n\nexport function ComboboxHiddenSelect(props: ComboboxHiddenSelectProps) {\n\tconst context = useComboboxContext<any, any>();\n\tconst [local, rest] = splitProps(props, ['name', 'value']);\n\n\treturn (\n\t\t<input\n\t\t\ttype=\"hidden\"\n\t\t\tname={local.name ?? context.name()}\n\t\t\tvalue={local.value ?? context.selectedItem()?.value ?? ''}\n\t\t\t{...rest}\n\t\t/>\n\t);\n}\n"]}

package/dist/src/components/combobox/combobox-icon.css

@@ -0,0 +1,11 @@
+@layer components {
+	.fl-combobox_icon {
+		/* layout */
+		display: inline-flex;
+		align-items: center;
+		justify-content: center;
+		width: var(--fl-size-4);
+		height: var(--fl-size-4);
+		flex: 0 0 auto;
+	}
+}

package/dist/src/components/combobox/combobox-icon.d.ts

@@ -0,0 +1,2 @@
+import type { ComboboxIconProps } from './types';
+export declare function ComboboxIcon(props: ComboboxIconProps): import("solid-js").JSX.Element;

package/dist/src/components/combobox/combobox-icon.jsx

@@ -0,0 +1,12 @@
+import clsx from 'clsx/lite';
+import { splitProps } from 'solid-js';
+import { ChevronDownIcon } from '#src/icons';
+import { comboboxClass } from './class';
+export function ComboboxIcon(props) {
+    const [local, rest] = splitProps(props, ['class', 'children']);
+    const rootClass = () => clsx(comboboxClass.icon, local.class);
+    return (<span class={rootClass()} {...rest}>
+			{local.children ?? <ChevronDownIcon />}
+		</span>);
+}
+//# sourceMappingURL=combobox-icon.jsx.map

package/dist/src/components/combobox/combobox-icon.jsx.map

@@ -0,0 +1 @@
+{"version":3,"file":"combobox-icon.jsx","sourceRoot":"","sources":["../../../../src/components/combobox/combobox-icon.tsx"],"names":[],"mappings":"AAAA,OAAO,IAAI,MAAM,WAAW,CAAC;AAC7B,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,OAAO,EAAE,eAAe,EAAE,MAAM,YAAY,CAAC;AAC7C,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxC,MAAM,UAAU,YAAY,CAAC,KAAwB;IACpD,MAAM,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAC/D,MAAM,SAAS,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC;IAE9D,OAAO,CACN,CAAC,IAAI,CACJ,KAAK,CAAC,CAAC,SAAS,EAAE,CAAC,CACnB,IAAI,IAAI,CAAC,CAET;GAAA,CAAC,KAAK,CAAC,QAAQ,IAAI,CAAC,eAAe,CAAC,AAAD,EAAG,CACvC;EAAA,EAAE,IAAI,CAAC,CACP,CAAC;AACH,CAAC","sourcesContent":["import clsx from 'clsx/lite';\nimport { splitProps } from 'solid-js';\nimport { ChevronDownIcon } from '#src/icons';\nimport { comboboxClass } from './class';\nimport type { ComboboxIconProps } from './types';\n\nexport function ComboboxIcon(props: ComboboxIconProps) {\n\tconst [local, rest] = splitProps(props, ['class', 'children']);\n\tconst rootClass = () => clsx(comboboxClass.icon, local.class);\n\n\treturn (\n\t\t<span\n\t\t\tclass={rootClass()}\n\t\t\t{...rest}\n\t\t>\n\t\t\t{local.children ?? <ChevronDownIcon />}\n\t\t</span>\n\t);\n}\n"]}

package/dist/src/components/combobox/combobox-input.css

@@ -0,0 +1,32 @@
+@layer components {
+	.fl-combobox_input {
+		/* reset */
+		appearance: none;
+		outline: none;
+
+		/* layout */
+		flex: 1 1 auto;
+		min-width: 0;
+		min-height: calc(var(--fl-input-pad-y, var(--fl-size-1-5)) * 2 + 1em);
+
+		/* spacing */
+		padding-inline: var(--fl-input-pad-x, var(--fl-size-2));
+		padding-block: var(--fl-input-pad-y, var(--fl-size-1-5));
+
+		/* background */
+		background: transparent;
+		border: 0;
+
+		/* text */
+		color: var(--fl-input-text-color, var(--fl-body-text-color));
+		font: inherit;
+	}
+
+	.fl-combobox_input::placeholder {
+		color: var(--fl-body-muted-text-color);
+	}
+
+	.fl-combobox_input:disabled {
+		cursor: var(--fl-disabled-cursor);
+	}
+}

package/dist/src/components/combobox/combobox-input.d.ts

@@ -0,0 +1,3 @@
+import { type JSX } from 'solid-js';
+import type { ComboboxInputProps } from './types';
+export declare function ComboboxInput(props: ComboboxInputProps): JSX.Element;