@rotki/ui-library 3.1.1 → 3.1.2

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.
@@ -2,8 +2,25 @@ import { computed, hasInjectionContext, inject, isRef, provide, toValue } from "
2
2
  //#region src/composables/defaults/field.ts
3
3
  /** The app-wide default, set through `createRui({ defaults: { field } })`. */
4
4
  var FieldSymbol = Symbol.for("rui:field");
5
- /** A default for every field below a component, set with `provideFieldDefaults` or `RuiFieldDefaults`. */
5
+ /**
6
+ * A default for every field below a component, set with `provideFieldDefaults` or `RuiFieldDefaults`.
7
+ * Every copy of the library on a page shares this key, so a change to what it holds must keep
8
+ * reading every shape an older copy provides.
9
+ */
6
10
  var FieldScopeSymbol = Symbol.for("rui:field-scope");
11
+ function isFieldScope(scope) {
12
+ return typeof scope === "object" && !isRef(scope) && typeof scope.labelPlacement === "function";
13
+ }
14
+ /** The nearest scope, read in either shape. */
15
+ function injectFieldScope() {
16
+ const scope = inject(FieldScopeSymbol, void 0);
17
+ if (scope === void 0 || scope === null) return void 0;
18
+ if (isFieldScope(scope)) return scope;
19
+ return {
20
+ labelPlacement: () => toValue(scope),
21
+ details: () => void 0
22
+ };
23
+ }
7
24
  function createFieldDefaults(options) {
8
25
  return {
9
26
  labelPlacement: "top",
@@ -23,7 +40,7 @@ function provideFieldDefaults(options) {
23
40
  labelPlacement: options,
24
41
  details: void 0
25
42
  };
26
- const parent = inject(FieldScopeSymbol, void 0);
43
+ const parent = injectFieldScope();
27
44
  provide(FieldScopeSymbol, {
28
45
  labelPlacement: () => toValue(labelPlacement) ?? parent?.labelPlacement(),
29
46
  details: () => toValue(details) ?? parent?.details()
@@ -34,7 +51,7 @@ function provideFieldDefaults(options) {
34
51
  * app default, then `top`.
35
52
  */
36
53
  function useLabelPlacement(placement) {
37
- const scope = inject(FieldScopeSymbol, void 0);
54
+ const scope = injectFieldScope();
38
55
  const app = inject(FieldSymbol, void 0);
39
56
  return computed(() => toValue(placement) ?? scope?.labelPlacement() ?? (app ? toValue(app.labelPlacement) : void 0) ?? "top");
40
57
  }
@@ -45,7 +62,7 @@ function useLabelPlacement(placement) {
45
62
  */
46
63
  function useInheritedDetails() {
47
64
  if (!hasInjectionContext()) return () => void 0;
48
- const scope = inject(FieldScopeSymbol, void 0);
65
+ const scope = injectFieldScope();
49
66
  const app = inject(FieldSymbol, void 0);
50
67
  return () => scope?.details() ?? (app ? toValue(app.details) : void 0);
51
68
  }
@@ -1 +1 @@
1
- {"version":3,"file":"field.js","names":[],"sources":["../../../src/composables/defaults/field.ts"],"sourcesContent":["import type { FormDetails } from '@/utils/form-text-detail';\nimport { type ComputedRef, hasInjectionContext, type InjectionKey, type MaybeRef, type MaybeRefOrGetter } from 'vue';\n\n/**\n * Where a field shows its label.\n *\n * - `top`: a label above a bordered field (the default).\n * - `hidden`: no visible label; the label is still announced to screen readers.\n * For search and filter fields whose placeholder and icon say what they are.\n */\nexport type LabelPlacement = 'top' | 'hidden';\n\nexport interface FieldOptions {\n labelPlacement: MaybeRef<LabelPlacement>;\n details: MaybeRef<FormDetails>;\n}\n\n/** What a `provideFieldDefaults` or `RuiFieldDefaults` scope sets; an unset key falls through to the scope above. */\nexport interface FieldScopeOptions {\n labelPlacement?: MaybeRefOrGetter<LabelPlacement | undefined>;\n details?: MaybeRefOrGetter<FormDetails | undefined>;\n}\n\ninterface FieldScope {\n labelPlacement: () => LabelPlacement | undefined;\n details: () => FormDetails | undefined;\n}\n\n/** The app-wide default, set through `createRui({ defaults: { field } })`. */\nexport const FieldSymbol: InjectionKey<FieldOptions> = Symbol.for('rui:field');\n\n/** A default for every field below a component, set with `provideFieldDefaults` or `RuiFieldDefaults`. */\nconst FieldScopeSymbol: InjectionKey<FieldScope> = Symbol.for('rui:field-scope');\n\nexport function createFieldDefaults(options?: Partial<FieldOptions>): FieldOptions {\n return {\n labelPlacement: 'top',\n details: 'reserve',\n ...options,\n };\n}\n\nfunction isScopeOptions(\n options: FieldScopeOptions | MaybeRefOrGetter<LabelPlacement | undefined>,\n): options is FieldScopeOptions {\n return typeof options === 'object' && !isRef(options);\n}\n\n/**\n * Sets defaults for every field rendered below the calling component. A key left unset\n * keeps what an enclosing scope set. Passing a placement alone is the 3.0 form.\n */\nexport function provideFieldDefaults(options: FieldScopeOptions | MaybeRefOrGetter<LabelPlacement | undefined>): void {\n const { labelPlacement, details } = isScopeOptions(options) ? options : { labelPlacement: options, details: undefined };\n const parent = inject(FieldScopeSymbol, undefined);\n\n provide(FieldScopeSymbol, {\n labelPlacement: () => toValue(labelPlacement) ?? parent?.labelPlacement(),\n details: () => toValue(details) ?? parent?.details(),\n });\n}\n\n/**\n * The placement a field uses: its own prop, then the nearest scope, then the\n * app default, then `top`.\n */\nexport function useLabelPlacement(placement: MaybeRefOrGetter<LabelPlacement | undefined>): ComputedRef<LabelPlacement> {\n const scope = inject(FieldScopeSymbol, undefined);\n const app = inject(FieldSymbol, undefined);\n\n return computed<LabelPlacement>(() =>\n toValue(placement)\n ?? scope?.labelPlacement()\n ?? (app ? toValue(app.labelPlacement) : undefined)\n ?? 'top',\n );\n}\n\n/**\n * The details mode the scope and app give a control that sets none itself: the nearest\n * scope, then the app default. `undefined` when neither sets one. Outside a component\n * setup there is nothing to inject, so it is always `undefined` there.\n */\nexport function useInheritedDetails(): () => FormDetails | undefined {\n if (!hasInjectionContext())\n return () => undefined;\n\n const scope = inject(FieldScopeSymbol, undefined);\n const app = inject(FieldSymbol, undefined);\n\n return () => scope?.details() ?? (app ? toValue(app.details) : undefined);\n}\n"],"mappings":";;;AA6BA,IAAa,cAA0C,OAAO,IAAI,WAAW;;AAG7E,IAAM,mBAA6C,OAAO,IAAI,iBAAiB;AAE/E,SAAgB,oBAAoB,SAA+C;CACjF,OAAO;EACL,gBAAgB;EAChB,SAAS;EACT,GAAG;CACL;AACF;AAEA,SAAS,eACP,SAC8B;CAC9B,OAAO,OAAO,YAAY,YAAY,CAAC,MAAM,OAAO;AACtD;;;;;AAMA,SAAgB,qBAAqB,SAAiF;CACpH,MAAM,EAAE,gBAAgB,YAAY,eAAe,OAAO,IAAI,UAAU;EAAE,gBAAgB;EAAS,SAAS,KAAA;CAAU;CACtH,MAAM,SAAS,OAAO,kBAAkB,KAAA,CAAS;CAEjD,QAAQ,kBAAkB;EACxB,sBAAsB,QAAQ,cAAc,KAAK,QAAQ,eAAe;EACxE,eAAe,QAAQ,OAAO,KAAK,QAAQ,QAAQ;CACrD,CAAC;AACH;;;;;AAMA,SAAgB,kBAAkB,WAAsF;CACtH,MAAM,QAAQ,OAAO,kBAAkB,KAAA,CAAS;CAChD,MAAM,MAAM,OAAO,aAAa,KAAA,CAAS;CAEzC,OAAO,eACL,QAAQ,SAAS,KACd,OAAO,eAAe,MACrB,MAAM,QAAQ,IAAI,cAAc,IAAI,KAAA,MACrC,KACL;AACF;;;;;;AAOA,SAAgB,sBAAqD;CACnE,IAAI,CAAC,oBAAoB,GACvB,aAAa,KAAA;CAEf,MAAM,QAAQ,OAAO,kBAAkB,KAAA,CAAS;CAChD,MAAM,MAAM,OAAO,aAAa,KAAA,CAAS;CAEzC,aAAa,OAAO,QAAQ,MAAM,MAAM,QAAQ,IAAI,OAAO,IAAI,KAAA;AACjE"}
1
+ {"version":3,"file":"field.js","names":[],"sources":["../../../src/composables/defaults/field.ts"],"sourcesContent":["import type { FormDetails } from '@/utils/form-text-detail';\nimport { type ComputedRef, hasInjectionContext, type InjectionKey, type MaybeRef, type MaybeRefOrGetter } from 'vue';\n\n/**\n * Where a field shows its label.\n *\n * - `top`: a label above a bordered field (the default).\n * - `hidden`: no visible label; the label is still announced to screen readers.\n * For search and filter fields whose placeholder and icon say what they are.\n */\nexport type LabelPlacement = 'top' | 'hidden';\n\nexport interface FieldOptions {\n labelPlacement: MaybeRef<LabelPlacement>;\n details: MaybeRef<FormDetails>;\n}\n\n/** What a `provideFieldDefaults` or `RuiFieldDefaults` scope sets; an unset key falls through to the scope above. */\nexport interface FieldScopeOptions {\n labelPlacement?: MaybeRefOrGetter<LabelPlacement | undefined>;\n details?: MaybeRefOrGetter<FormDetails | undefined>;\n}\n\ninterface FieldScope {\n labelPlacement: () => LabelPlacement | undefined;\n details: () => FormDetails | undefined;\n}\n\n/** The app-wide default, set through `createRui({ defaults: { field } })`. */\nexport const FieldSymbol: InjectionKey<FieldOptions> = Symbol.for('rui:field');\n\n/**\n * What 3.0 provided under the scope key: the placement itself. A 3.0 copy bundled into\n * another package still provides it, and `Symbol.for` hands it to this copy.\n */\ntype LegacyFieldScope = MaybeRefOrGetter<LabelPlacement | undefined>;\n\n/**\n * A default for every field below a component, set with `provideFieldDefaults` or `RuiFieldDefaults`.\n * Every copy of the library on a page shares this key, so a change to what it holds must keep\n * reading every shape an older copy provides.\n */\nconst FieldScopeSymbol: InjectionKey<FieldScope | LegacyFieldScope | null> = Symbol.for('rui:field-scope');\n\nfunction isFieldScope(scope: FieldScope | LegacyFieldScope): scope is FieldScope {\n return typeof scope === 'object' && !isRef(scope) && typeof scope.labelPlacement === 'function';\n}\n\n/** The nearest scope, read in either shape. */\nfunction injectFieldScope(): FieldScope | undefined {\n const scope = inject(FieldScopeSymbol, undefined);\n if (scope === undefined || scope === null)\n return undefined;\n if (isFieldScope(scope))\n return scope;\n\n return {\n labelPlacement: () => toValue(scope),\n details: () => undefined,\n };\n}\n\nexport function createFieldDefaults(options?: Partial<FieldOptions>): FieldOptions {\n return {\n labelPlacement: 'top',\n details: 'reserve',\n ...options,\n };\n}\n\nfunction isScopeOptions(\n options: FieldScopeOptions | MaybeRefOrGetter<LabelPlacement | undefined>,\n): options is FieldScopeOptions {\n return typeof options === 'object' && !isRef(options);\n}\n\n/**\n * Sets defaults for every field rendered below the calling component. A key left unset\n * keeps what an enclosing scope set. Passing a placement alone is the 3.0 form.\n */\nexport function provideFieldDefaults(options: FieldScopeOptions | MaybeRefOrGetter<LabelPlacement | undefined>): void {\n const { labelPlacement, details } = isScopeOptions(options) ? options : { labelPlacement: options, details: undefined };\n const parent = injectFieldScope();\n\n provide(FieldScopeSymbol, {\n labelPlacement: () => toValue(labelPlacement) ?? parent?.labelPlacement(),\n details: () => toValue(details) ?? parent?.details(),\n });\n}\n\n/**\n * The placement a field uses: its own prop, then the nearest scope, then the\n * app default, then `top`.\n */\nexport function useLabelPlacement(placement: MaybeRefOrGetter<LabelPlacement | undefined>): ComputedRef<LabelPlacement> {\n const scope = injectFieldScope();\n const app = inject(FieldSymbol, undefined);\n\n return computed<LabelPlacement>(() =>\n toValue(placement)\n ?? scope?.labelPlacement()\n ?? (app ? toValue(app.labelPlacement) : undefined)\n ?? 'top',\n );\n}\n\n/**\n * The details mode the scope and app give a control that sets none itself: the nearest\n * scope, then the app default. `undefined` when neither sets one. Outside a component\n * setup there is nothing to inject, so it is always `undefined` there.\n */\nexport function useInheritedDetails(): () => FormDetails | undefined {\n if (!hasInjectionContext())\n return () => undefined;\n\n const scope = injectFieldScope();\n const app = inject(FieldSymbol, undefined);\n\n return () => scope?.details() ?? (app ? toValue(app.details) : undefined);\n}\n"],"mappings":";;;AA6BA,IAAa,cAA0C,OAAO,IAAI,WAAW;;;;;;AAa7E,IAAM,mBAAuE,OAAO,IAAI,iBAAiB;AAEzG,SAAS,aAAa,OAA2D;CAC/E,OAAO,OAAO,UAAU,YAAY,CAAC,MAAM,KAAK,KAAK,OAAO,MAAM,mBAAmB;AACvF;;AAGA,SAAS,mBAA2C;CAClD,MAAM,QAAQ,OAAO,kBAAkB,KAAA,CAAS;CAChD,IAAI,UAAU,KAAA,KAAa,UAAU,MACnC,OAAO,KAAA;CACT,IAAI,aAAa,KAAK,GACpB,OAAO;CAET,OAAO;EACL,sBAAsB,QAAQ,KAAK;EACnC,eAAe,KAAA;CACjB;AACF;AAEA,SAAgB,oBAAoB,SAA+C;CACjF,OAAO;EACL,gBAAgB;EAChB,SAAS;EACT,GAAG;CACL;AACF;AAEA,SAAS,eACP,SAC8B;CAC9B,OAAO,OAAO,YAAY,YAAY,CAAC,MAAM,OAAO;AACtD;;;;;AAMA,SAAgB,qBAAqB,SAAiF;CACpH,MAAM,EAAE,gBAAgB,YAAY,eAAe,OAAO,IAAI,UAAU;EAAE,gBAAgB;EAAS,SAAS,KAAA;CAAU;CACtH,MAAM,SAAS,iBAAiB;CAEhC,QAAQ,kBAAkB;EACxB,sBAAsB,QAAQ,cAAc,KAAK,QAAQ,eAAe;EACxE,eAAe,QAAQ,OAAO,KAAK,QAAQ,QAAQ;CACrD,CAAC;AACH;;;;;AAMA,SAAgB,kBAAkB,WAAsF;CACtH,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,MAAM,OAAO,aAAa,KAAA,CAAS;CAEzC,OAAO,eACL,QAAQ,SAAS,KACd,OAAO,eAAe,MACrB,MAAM,QAAQ,IAAI,cAAc,IAAI,KAAA,MACrC,KACL;AACF;;;;;;AAOA,SAAgB,sBAAqD;CACnE,IAAI,CAAC,oBAAoB,GACvB,aAAa,KAAA;CAEf,MAAM,QAAQ,iBAAiB;CAC/B,MAAM,MAAM,OAAO,aAAa,KAAA,CAAS;CAEzC,aAAa,OAAO,QAAQ,MAAM,MAAM,QAAQ,IAAI,OAAO,IAAI,KAAA;AACjE"}
@@ -2,7 +2,7 @@
2
2
  "$schema": "http://json.schemastore.org/web-types",
3
3
  "framework": "vue",
4
4
  "name": "@rotki/ui-library",
5
- "version": "3.1.1",
5
+ "version": "3.1.2",
6
6
  "js-types-syntax": "typescript",
7
7
  "description-markup": "markdown",
8
8
  "contributions": {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rotki/ui-library",
3
- "version": "3.1.1",
3
+ "version": "3.1.2",
4
4
  "description": "A vue design system and component library for rotki",
5
5
  "type": "module",
6
6
  "keywords": [