@css-hooks/solid 0.6.0

package/cjs/index.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.recommended = exports.createHooks = exports.stringifyValue = void 0;
+const core_1 = require("@css-hooks/core");
+/** @internal */
+function stringifyValue(_, value) {
+    if (typeof value === "string") {
+        return value;
+    }
+    if (typeof value === "number") {
+        return `${value}`;
+    }
+    return null;
+}
+exports.stringifyValue = stringifyValue;
+/**
+ * Creates the hooks specified in the configuration.
+ *
+ * @param config - The hooks to build
+ *
+ * @returns The CSS required to enable the configured hooks, along with the corresponding `hooks` function for use in components.
+ */
+exports.createHooks = (0, core_1.buildHooksSystem)(stringifyValue);
+function keybab(r) {
+    /* eslint-disable @typescript-eslint/no-unsafe-return,@typescript-eslint/no-explicit-any */
+    return Object.fromEntries(Object.entries(r).map(([key, value]) => [
+        key.replace(/[A-Z]/g, x => `-${x.toLowerCase()}`),
+        value,
+    ]));
+    /* eslint-enable @typescript-eslint/no-unsafe-return,@typescript-eslint/no-explicit-any */
+}
+/**
+ * A list of hooks offered as a "sensible default" to solve the most common use cases.
+ */
+exports.recommended = keybab(core_1.recommended);

package/esm/index.js

@@ -0,0 +1,31 @@
+import { buildHooksSystem, recommended as coreRecommended, } from "@css-hooks/core";
+/** @internal */
+export function stringifyValue(_, value) {
+    if (typeof value === "string") {
+        return value;
+    }
+    if (typeof value === "number") {
+        return `${value}`;
+    }
+    return null;
+}
+/**
+ * Creates the hooks specified in the configuration.
+ *
+ * @param config - The hooks to build
+ *
+ * @returns The CSS required to enable the configured hooks, along with the corresponding `hooks` function for use in components.
+ */
+export const createHooks = buildHooksSystem(stringifyValue);
+function keybab(r) {
+    /* eslint-disable @typescript-eslint/no-unsafe-return,@typescript-eslint/no-explicit-any */
+    return Object.fromEntries(Object.entries(r).map(([key, value]) => [
+        key.replace(/[A-Z]/g, x => `-${x.toLowerCase()}`),
+        value,
+    ]));
+    /* eslint-enable @typescript-eslint/no-unsafe-return,@typescript-eslint/no-explicit-any */
+}
+/**
+ * A list of hooks offered as a "sensible default" to solve the most common use cases.
+ */
+export const recommended = keybab(coreRecommended);

package/package.json

@@ -0,0 +1,49 @@
+{
+  "name": "@css-hooks/solid",
+  "description": "CSS Hooks for Solid",
+  "version": "0.6.0",
+  "author": "Nick Saunders",
+  "dependencies": {
+    "@css-hooks/core": "^0.6.0",
+    "ts-toolbelt": "^9.6.0"
+  },
+  "devDependencies": {
+    "@tsconfig/node-lts": "^18.12.3",
+    "@tsconfig/strictest": "^2.0.1",
+    "@types/jest": "^29.5.3",
+    "@typescript-eslint/eslint-plugin": "^6.3.0",
+    "@typescript-eslint/parser": "^6.3.0",
+    "eslint": "^8.47.0",
+    "jest": "^29.6.2",
+    "rimraf": "^5.0.1",
+    "solid-js": "^1.7.11",
+    "ts-jest": "^29.1.1",
+    "typescript": "^5.1.6"
+  },
+  "files": [
+    "cjs",
+    "esm",
+    "types"
+  ],
+  "license": "MIT",
+  "main": "cjs",
+  "module": "esm",
+  "peerDependencies": {
+    "solid-js": ">=1.0.0 <2.0.0"
+  },
+  "private": false,
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/css-hooks/css-hooks.git",
+    "directory": "packages/solid"
+  },
+  "scripts": {
+    "clean": "rimraf cjs esm types",
+    "lint": "eslint __tests__ src .*.*js *.*js",
+    "postversion": "npm install @css-hooks/core@^$npm_package_version --force",
+    "prepublishOnly": "tsc -p tsconfig.dist.json --outDir cjs --module commonjs && tsc -p tsconfig.dist.json --outDir esm --module es6 && tsc -p tsconfig.dist.json --declaration --emitDeclarationOnly --outDir types",
+    "test": "jest"
+  },
+  "type": "module",
+  "types": "types"
+}

package/types/index.d.ts

@@ -0,0 +1,46 @@
+import type { JSX } from "solid-js";
+/** @internal */
+export declare function stringifyValue(_: string, value: unknown): string | null;
+/**
+ * Creates the hooks specified in the configuration.
+ *
+ * @param config - The hooks to build
+ *
+ * @returns The CSS required to enable the configured hooks, along with the corresponding `hooks` function for use in components.
+ */
+export declare const createHooks: <HookProperties extends string | number | symbol>(config: Record<HookProperties, `@container ${string}` | `@media ${string}` | `:${string}` | `${string}&${string}`>) => readonly [string, (properties: import("@css-hooks/core").WithHooks<HookProperties, JSX.CSSProperties>) => JSX.CSSProperties];
+/**
+ * A list of hooks offered as a "sensible default" to solve the most common use cases.
+ */
+export declare const recommended: {
+    active: ":active";
+    autofill: ":autofill";
+    checked: ":checked";
+    default: ":default";
+    disabled: ":disabled";
+    empty: ":empty";
+    enabled: ":enabled";
+    "even-child": ":nth-child(even)";
+    "first-child": ":first-child";
+    "first-of-type": ":first-of-type";
+    focus: ":focus";
+    "focus-visible": ":focus-visible";
+    "focus-within": ":focus-within";
+    hover: ":hover";
+    "in-range": ":in-range";
+    indeterminate: ":indeterminate";
+    invalid: ":invalid";
+    "last-child": ":last-child";
+    "last-of-type": ":last-of-type";
+    "odd-child": ":nth-child(odd)";
+    "only-child": ":only-child";
+    "only-of-type": ":only-of-type";
+    "out-of-range": ":out-of-range";
+    "placeholder-shown": ":placeholder-shown";
+    "read-only": ":read-only";
+    "read-write": ":read-write";
+    required: ":required";
+    target: ":target";
+    valid: ":valid";
+    visited: ":visited";
+};