@css-hooks/core 1.2.1 → 1.3.0

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.
Files changed (4) hide show
  1. package/cjs/index.js +35 -20
  2. package/esm/index.js +35 -20
  3. package/package.json +1 -1
  4. package/types/index.d.ts +7 -1
package/cjs/index.js CHANGED
@@ -32,26 +32,41 @@ function genericStringify(_, value) {
32
32
  return null;
33
33
  }
34
34
  exports.genericStringify = genericStringify;
35
+ function hash(obj) {
36
+ const jsonString = JSON.stringify(obj);
37
+ let hashValue = 0;
38
+ for (let i = 0; i < jsonString.length; i++) {
39
+ const charCode = jsonString.charCodeAt(i);
40
+ hashValue = (hashValue << 5) - hashValue + charCode;
41
+ hashValue &= 0x7fffffff;
42
+ }
43
+ return hashValue.toString(36);
44
+ }
35
45
  function buildHooksSystem(stringify = genericStringify) {
36
- return function createHooks(config) {
46
+ return function createHooks(config, options) {
37
47
  const stringifyImpl = (propertyName, value) => {
38
48
  return typeof value === "string" && value.startsWith("var(")
39
49
  ? value
40
50
  : stringify(propertyName, value);
41
51
  };
42
- function forEachHook(obj, callback) {
43
- return Object.entries(obj)
52
+ const hookId = (options === null || options === void 0 ? void 0 : options.hookNameToId) ||
53
+ ((hookName) => {
54
+ const specHash = hash(config[hookName]);
55
+ return (options === null || options === void 0 ? void 0 : options.debug)
56
+ ? `${hookName.replace(/[^A-Za-z0-9-]/g, "_")}-${specHash}`
57
+ : specHash;
58
+ });
59
+ function forEachHook(properties, callback) {
60
+ return Object.entries(properties)
44
61
  .filter(([key]) => key in config)
45
- .forEach(([key, value]) => {
46
- callback(key,
47
- /* eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-argument */
48
- value);
62
+ .forEach(([hookName, value]) => {
63
+ callback(hookName, value);
49
64
  });
50
65
  }
51
66
  function hooksImpl(properties, fallback = propertyName => stringifyImpl(propertyName, properties[propertyName])) {
52
- forEachHook(properties, (key, hook) => {
53
- hooksImpl(hook, propertyName => {
54
- let v = stringifyImpl(propertyName, hook[propertyName]);
67
+ forEachHook(properties, (hookName, innerProperties) => {
68
+ hooksImpl(innerProperties, propertyName => {
69
+ let v = stringifyImpl(propertyName, innerProperties[propertyName]);
55
70
  if (v === null) {
56
71
  v = fallback(propertyName);
57
72
  }
@@ -60,8 +75,8 @@ function buildHooksSystem(stringify = genericStringify) {
60
75
  }
61
76
  return v;
62
77
  });
63
- for (const propertyName in hook) {
64
- const v1 = stringifyImpl(propertyName, hook[propertyName]);
78
+ for (const propertyName in innerProperties) {
79
+ const v1 = stringifyImpl(propertyName, innerProperties[propertyName]);
65
80
  if (v1 !== null) {
66
81
  let v0 = fallback(propertyName);
67
82
  if (v0 === null) {
@@ -69,11 +84,11 @@ function buildHooksSystem(stringify = genericStringify) {
69
84
  }
70
85
  /* eslint-disable @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any */
71
86
  properties[propertyName] =
72
- `var(--${String(key)}-1, ${v1}) var(--${String(key)}-0, ${v0})`;
87
+ `var(--${hookId(hookName)}-1, ${v1}) var(--${hookId(hookName)}-0, ${v0})`;
73
88
  /* eslint-enable @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any */
74
89
  }
75
90
  }
76
- delete properties[key];
91
+ delete properties[hookName];
77
92
  });
78
93
  return properties;
79
94
  }
@@ -107,7 +122,7 @@ function buildHooksSystem(stringify = genericStringify) {
107
122
  }
108
123
  return [name, nest(definition)];
109
124
  })
110
- .flatMap(function css([name, definition]) {
125
+ .flatMap(([name, definition]) => (function css(name, definition) {
111
126
  if (!isHookSpec(definition)) {
112
127
  return [];
113
128
  }
@@ -120,7 +135,7 @@ function buildHooksSystem(stringify = genericStringify) {
120
135
  return [];
121
136
  }
122
137
  if (!b) {
123
- return css.bind(this)([name, a]);
138
+ return css(name, a);
124
139
  }
125
140
  extraCSS = [
126
141
  {
@@ -142,7 +157,7 @@ function buildHooksSystem(stringify = genericStringify) {
142
157
  return [];
143
158
  }
144
159
  if (!b) {
145
- return css.bind(this)([name, a]);
160
+ return css(name, a);
146
161
  }
147
162
  extraCSS = [
148
163
  {
@@ -159,8 +174,8 @@ function buildHooksSystem(stringify = genericStringify) {
159
174
  }
160
175
  if (operator) {
161
176
  return [
162
- ...css.bind(this)([`${name}A`, a]),
163
- ...css.bind(this)([`${name}B`, b]),
177
+ ...css(`${name}A`, a),
178
+ ...css(`${name}B`, b),
164
179
  ...extraCSS,
165
180
  ];
166
181
  }
@@ -179,7 +194,7 @@ function buildHooksSystem(stringify = genericStringify) {
179
194
  }
180
195
  }
181
196
  return rule === undefined ? [] : [{ init, rule }];
182
- })
197
+ })(hookId(name), definition))
183
198
  .reduce((acc, { init = "", rule = "" }) => ({
184
199
  init: acc.init + init,
185
200
  rule: acc.rule + rule,
package/esm/index.js CHANGED
@@ -28,26 +28,41 @@ export function genericStringify(_, value) {
28
28
  }
29
29
  return null;
30
30
  }
31
+ function hash(obj) {
32
+ const jsonString = JSON.stringify(obj);
33
+ let hashValue = 0;
34
+ for (let i = 0; i < jsonString.length; i++) {
35
+ const charCode = jsonString.charCodeAt(i);
36
+ hashValue = (hashValue << 5) - hashValue + charCode;
37
+ hashValue &= 0x7fffffff;
38
+ }
39
+ return hashValue.toString(36);
40
+ }
31
41
  export function buildHooksSystem(stringify = genericStringify) {
32
- return function createHooks(config) {
42
+ return function createHooks(config, options) {
33
43
  const stringifyImpl = (propertyName, value) => {
34
44
  return typeof value === "string" && value.startsWith("var(")
35
45
  ? value
36
46
  : stringify(propertyName, value);
37
47
  };
38
- function forEachHook(obj, callback) {
39
- return Object.entries(obj)
48
+ const hookId = (options === null || options === void 0 ? void 0 : options.hookNameToId) ||
49
+ ((hookName) => {
50
+ const specHash = hash(config[hookName]);
51
+ return (options === null || options === void 0 ? void 0 : options.debug)
52
+ ? `${hookName.replace(/[^A-Za-z0-9-]/g, "_")}-${specHash}`
53
+ : specHash;
54
+ });
55
+ function forEachHook(properties, callback) {
56
+ return Object.entries(properties)
40
57
  .filter(([key]) => key in config)
41
- .forEach(([key, value]) => {
42
- callback(key,
43
- /* eslint-disable-next-line @typescript-eslint/no-explicit-any,@typescript-eslint/no-unsafe-argument */
44
- value);
58
+ .forEach(([hookName, value]) => {
59
+ callback(hookName, value);
45
60
  });
46
61
  }
47
62
  function hooksImpl(properties, fallback = propertyName => stringifyImpl(propertyName, properties[propertyName])) {
48
- forEachHook(properties, (key, hook) => {
49
- hooksImpl(hook, propertyName => {
50
- let v = stringifyImpl(propertyName, hook[propertyName]);
63
+ forEachHook(properties, (hookName, innerProperties) => {
64
+ hooksImpl(innerProperties, propertyName => {
65
+ let v = stringifyImpl(propertyName, innerProperties[propertyName]);
51
66
  if (v === null) {
52
67
  v = fallback(propertyName);
53
68
  }
@@ -56,8 +71,8 @@ export function buildHooksSystem(stringify = genericStringify) {
56
71
  }
57
72
  return v;
58
73
  });
59
- for (const propertyName in hook) {
60
- const v1 = stringifyImpl(propertyName, hook[propertyName]);
74
+ for (const propertyName in innerProperties) {
75
+ const v1 = stringifyImpl(propertyName, innerProperties[propertyName]);
61
76
  if (v1 !== null) {
62
77
  let v0 = fallback(propertyName);
63
78
  if (v0 === null) {
@@ -65,11 +80,11 @@ export function buildHooksSystem(stringify = genericStringify) {
65
80
  }
66
81
  /* eslint-disable @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any */
67
82
  properties[propertyName] =
68
- `var(--${String(key)}-1, ${v1}) var(--${String(key)}-0, ${v0})`;
83
+ `var(--${hookId(hookName)}-1, ${v1}) var(--${hookId(hookName)}-0, ${v0})`;
69
84
  /* eslint-enable @typescript-eslint/no-unsafe-assignment,@typescript-eslint/no-explicit-any */
70
85
  }
71
86
  }
72
- delete properties[key];
87
+ delete properties[hookName];
73
88
  });
74
89
  return properties;
75
90
  }
@@ -103,7 +118,7 @@ export function buildHooksSystem(stringify = genericStringify) {
103
118
  }
104
119
  return [name, nest(definition)];
105
120
  })
106
- .flatMap(function css([name, definition]) {
121
+ .flatMap(([name, definition]) => (function css(name, definition) {
107
122
  if (!isHookSpec(definition)) {
108
123
  return [];
109
124
  }
@@ -116,7 +131,7 @@ export function buildHooksSystem(stringify = genericStringify) {
116
131
  return [];
117
132
  }
118
133
  if (!b) {
119
- return css.bind(this)([name, a]);
134
+ return css(name, a);
120
135
  }
121
136
  extraCSS = [
122
137
  {
@@ -138,7 +153,7 @@ export function buildHooksSystem(stringify = genericStringify) {
138
153
  return [];
139
154
  }
140
155
  if (!b) {
141
- return css.bind(this)([name, a]);
156
+ return css(name, a);
142
157
  }
143
158
  extraCSS = [
144
159
  {
@@ -155,8 +170,8 @@ export function buildHooksSystem(stringify = genericStringify) {
155
170
  }
156
171
  if (operator) {
157
172
  return [
158
- ...css.bind(this)([`${name}A`, a]),
159
- ...css.bind(this)([`${name}B`, b]),
173
+ ...css(`${name}A`, a),
174
+ ...css(`${name}B`, b),
160
175
  ...extraCSS,
161
176
  ];
162
177
  }
@@ -175,7 +190,7 @@ export function buildHooksSystem(stringify = genericStringify) {
175
190
  }
176
191
  }
177
192
  return rule === undefined ? [] : [{ init, rule }];
178
- })
193
+ })(hookId(name), definition))
179
194
  .reduce((acc, { init = "", rule = "" }) => ({
180
195
  init: acc.init + init,
181
196
  rule: acc.rule + rule,
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@css-hooks/core",
3
3
  "description": "CSS Hooks core library",
4
- "version": "1.2.1",
4
+ "version": "1.3.0",
5
5
  "author": "Nick Saunders",
6
6
  "devDependencies": {
7
7
  "@tsconfig/strictest": "^2.0.1",
package/types/index.d.ts CHANGED
@@ -10,7 +10,13 @@ type WithHooksImpl<Properties, HookProperties, HookPropertiesSub extends HookPro
10
10
  } : never>>;
11
11
  /** @internal */
12
12
  export declare function genericStringify(_: unknown, value: unknown): string | null;
13
- export declare function buildHooksSystem<Properties = Record<string, unknown>>(stringify?: (propertyName: keyof Properties, value: unknown) => string | null): <HookProperties extends string>(config: Record<HookProperties, HookSpec>) => readonly [`*{${string}}undefined` | `*{${string}}${string}`, (properties: WithHooks<HookProperties, Properties>) => Properties];
13
+ export declare function buildHooksSystem<Properties = Record<string, unknown>>(stringify?: (propertyName: keyof Properties, value: unknown) => string | null): <HookProperties extends string>(config: Record<HookProperties, HookSpec>, options?: {
14
+ debug?: boolean; /** @internal */
15
+ hookNameToId?: undefined;
16
+ } | {
17
+ debug?: undefined;
18
+ /** @internal */ hookNameToId?: (hookName: string) => string;
19
+ } | undefined) => readonly [`*{${string}}undefined` | `*{${string}}${string}`, (properties: WithHooks<HookProperties, Properties>) => Properties];
14
20
  /**
15
21
  * A list of hooks offered as a "sensible default" to solve the most common use cases.
16
22
  */