@kjun-ui/native 0.12.0 → 0.12.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.
Files changed (7) hide show
  1. package/dist/index.cjs +11 -5
  2. package/dist/index.js +11 -5
  3. package/dist/index.web.cjs +11 -5
  4. package/dist/index.web.js +11 -5
  5. package/dist/types/shared/package-runtime/use-layer.d.cts +1 -0
  6. package/dist/types/shared/package-runtime/use-layer.d.ts +1 -0
  7. package/package.json +3 -3
package/dist/index.cjs CHANGED
@@ -438,19 +438,25 @@ function useActiveLayerScope() {
438
438
  function currentFocus() {
439
439
  return typeof document === "undefined" ? null : document.activeElement;
440
440
  }
441
+ function domElement(target) {
442
+ const node = target;
443
+ return typeof (node == null ? void 0 : node.matches) === "function" && typeof node.closest === "function" && typeof node.querySelector === "function";
444
+ }
441
445
  function focusTrigger(target) {
442
- if (typeof HTMLElement !== "undefined" && target instanceof HTMLElement) {
446
+ if (domElement(target)) {
443
447
  return target.matches("button,input,[href],[tabindex]") ? target : target.querySelector("button,input,[href],[tabindex]") || target;
444
448
  }
445
449
  return target;
446
450
  }
451
+ function isRestorableFocus(item) {
452
+ return (item == null ? void 0 : item.isConnected) !== false && !(domElement(item) && item.closest("[inert]"));
453
+ }
447
454
  function restoreFocus(target, state, id, fallback2) {
448
- const usable = (item) => (item == null ? void 0 : item.isConnected) !== false && !(typeof HTMLElement !== "undefined" && item instanceof HTMLElement && item.closest("[inert]"));
449
455
  const restore = () => {
450
456
  var _a, _b, _c, _d, _e;
451
457
  if (state.entries.has(id)) return;
452
- if (usable(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
453
- else if (fallback2 && fallback2 !== target && usable(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
458
+ if (isRestorableFocus(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
459
+ else if (fallback2 && fallback2 !== target && isRestorableFocus(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
454
460
  else (_e = (_d = (_c = state.topWindow()) == null ? void 0 : _c.root) == null ? void 0 : _d.focus) == null ? void 0 : _e.call(_d, { preventScroll: true });
455
461
  };
456
462
  if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(restore);
@@ -5336,7 +5342,7 @@ function KjunSelect({
5336
5342
  ...compound ? { paddingHorizontal: import_tokens31.tokens.extensions.timePicker.segmentPadding, paddingRight: import_tokens31.tokens.extensions.timePicker.segmentPadding, paddingLeft: compound.leading ? spec.padding - import_tokens31.tokens.border.controlWidth : import_tokens31.tokens.extensions.timePicker.segmentPadding, gap: import_tokens31.tokens.extensions.timePicker.segmentPadding, backgroundColor: !disabled && (surface.active || surface.hovered) ? colors.hover : "transparent", borderColor: "transparent", outlineWidth: 0 } : {}
5337
5343
  },
5338
5344
  children: [
5339
- /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native36.View, { style: { flex: 1, minWidth: 0, paddingRight: clearable && label ? import_tokens31.tokens.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5345
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native36.View, { style: { ...compound ? { flexGrow: 1, flexShrink: 0 } : { flex: 1, minWidth: 0 }, paddingRight: clearable && label ? import_tokens31.tokens.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5340
5346
  compound && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(KText, { "aria-hidden": true, importantForAccessibility: "no-hide-descendants", style: { ...inputTypeStyle(size), fontVariant: ["tabular-nums"], opacity: 0 }, children: "00" }),
5341
5347
  (renderSelected == null ? void 0 : renderSelected(selectedOption)) || /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(KText, { numberOfLines: 1, style: {
5342
5348
  ...inputTypeStyle(size),
package/dist/index.js CHANGED
@@ -320,19 +320,25 @@ function useActiveLayerScope() {
320
320
  function currentFocus() {
321
321
  return typeof document === "undefined" ? null : document.activeElement;
322
322
  }
323
+ function domElement(target) {
324
+ const node = target;
325
+ return typeof (node == null ? void 0 : node.matches) === "function" && typeof node.closest === "function" && typeof node.querySelector === "function";
326
+ }
323
327
  function focusTrigger(target) {
324
- if (typeof HTMLElement !== "undefined" && target instanceof HTMLElement) {
328
+ if (domElement(target)) {
325
329
  return target.matches("button,input,[href],[tabindex]") ? target : target.querySelector("button,input,[href],[tabindex]") || target;
326
330
  }
327
331
  return target;
328
332
  }
333
+ function isRestorableFocus(item) {
334
+ return (item == null ? void 0 : item.isConnected) !== false && !(domElement(item) && item.closest("[inert]"));
335
+ }
329
336
  function restoreFocus(target, state, id, fallback2) {
330
- const usable = (item) => (item == null ? void 0 : item.isConnected) !== false && !(typeof HTMLElement !== "undefined" && item instanceof HTMLElement && item.closest("[inert]"));
331
337
  const restore = () => {
332
338
  var _a, _b, _c, _d, _e;
333
339
  if (state.entries.has(id)) return;
334
- if (usable(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
335
- else if (fallback2 && fallback2 !== target && usable(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
340
+ if (isRestorableFocus(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
341
+ else if (fallback2 && fallback2 !== target && isRestorableFocus(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
336
342
  else (_e = (_d = (_c = state.topWindow()) == null ? void 0 : _c.root) == null ? void 0 : _d.focus) == null ? void 0 : _e.call(_d, { preventScroll: true });
337
343
  };
338
344
  if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(restore);
@@ -5348,7 +5354,7 @@ function KjunSelect({
5348
5354
  ...compound ? { paddingHorizontal: tokens29.extensions.timePicker.segmentPadding, paddingRight: tokens29.extensions.timePicker.segmentPadding, paddingLeft: compound.leading ? spec.padding - tokens29.border.controlWidth : tokens29.extensions.timePicker.segmentPadding, gap: tokens29.extensions.timePicker.segmentPadding, backgroundColor: !disabled && (surface.active || surface.hovered) ? colors.hover : "transparent", borderColor: "transparent", outlineWidth: 0 } : {}
5349
5355
  },
5350
5356
  children: [
5351
- /* @__PURE__ */ jsxs20(View26, { style: { flex: 1, minWidth: 0, paddingRight: clearable && label ? tokens29.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5357
+ /* @__PURE__ */ jsxs20(View26, { style: { ...compound ? { flexGrow: 1, flexShrink: 0 } : { flex: 1, minWidth: 0 }, paddingRight: clearable && label ? tokens29.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5352
5358
  compound && /* @__PURE__ */ jsx33(KText, { "aria-hidden": true, importantForAccessibility: "no-hide-descendants", style: { ...inputTypeStyle(size), fontVariant: ["tabular-nums"], opacity: 0 }, children: "00" }),
5353
5359
  (renderSelected == null ? void 0 : renderSelected(selectedOption)) || /* @__PURE__ */ jsx33(KText, { numberOfLines: 1, style: {
5354
5360
  ...inputTypeStyle(size),
package/dist/index.web.cjs CHANGED
@@ -438,19 +438,25 @@ function useActiveLayerScope() {
438
438
  function currentFocus() {
439
439
  return typeof document === "undefined" ? null : document.activeElement;
440
440
  }
441
+ function domElement(target) {
442
+ const node = target;
443
+ return typeof (node == null ? void 0 : node.matches) === "function" && typeof node.closest === "function" && typeof node.querySelector === "function";
444
+ }
441
445
  function focusTrigger(target) {
442
- if (typeof HTMLElement !== "undefined" && target instanceof HTMLElement) {
446
+ if (domElement(target)) {
443
447
  return target.matches("button,input,[href],[tabindex]") ? target : target.querySelector("button,input,[href],[tabindex]") || target;
444
448
  }
445
449
  return target;
446
450
  }
451
+ function isRestorableFocus(item) {
452
+ return (item == null ? void 0 : item.isConnected) !== false && !(domElement(item) && item.closest("[inert]"));
453
+ }
447
454
  function restoreFocus(target, state, id, fallback2) {
448
- const usable = (item) => (item == null ? void 0 : item.isConnected) !== false && !(typeof HTMLElement !== "undefined" && item instanceof HTMLElement && item.closest("[inert]"));
449
455
  const restore = () => {
450
456
  var _a, _b, _c, _d, _e;
451
457
  if (state.entries.has(id)) return;
452
- if (usable(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
453
- else if (fallback2 && fallback2 !== target && usable(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
458
+ if (isRestorableFocus(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
459
+ else if (fallback2 && fallback2 !== target && isRestorableFocus(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
454
460
  else (_e = (_d = (_c = state.topWindow()) == null ? void 0 : _c.root) == null ? void 0 : _d.focus) == null ? void 0 : _e.call(_d, { preventScroll: true });
455
461
  };
456
462
  if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(restore);
@@ -5498,7 +5504,7 @@ function KjunSelect({
5498
5504
  ...compound ? { paddingHorizontal: import_tokens32.tokens.extensions.timePicker.segmentPadding, paddingRight: import_tokens32.tokens.extensions.timePicker.segmentPadding, paddingLeft: compound.leading ? spec.padding - import_tokens32.tokens.border.controlWidth : import_tokens32.tokens.extensions.timePicker.segmentPadding, gap: import_tokens32.tokens.extensions.timePicker.segmentPadding, backgroundColor: !disabled && (surface.active || surface.hovered) ? colors.hover : "transparent", borderColor: "transparent", outlineWidth: 0 } : {}
5499
5505
  },
5500
5506
  children: [
5501
- /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native36.View, { style: { flex: 1, minWidth: 0, paddingRight: clearable && label ? import_tokens32.tokens.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5507
+ /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)(import_react_native36.View, { style: { ...compound ? { flexGrow: 1, flexShrink: 0 } : { flex: 1, minWidth: 0 }, paddingRight: clearable && label ? import_tokens32.tokens.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5502
5508
  compound && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(KText, { "aria-hidden": true, importantForAccessibility: "no-hide-descendants", style: { ...inputTypeStyle(size), fontVariant: ["tabular-nums"], opacity: 0 }, children: "00" }),
5503
5509
  (renderSelected == null ? void 0 : renderSelected(selectedOption)) || /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(KText, { numberOfLines: 1, style: {
5504
5510
  ...inputTypeStyle(size),
package/dist/index.web.js CHANGED
@@ -320,19 +320,25 @@ function useActiveLayerScope() {
320
320
  function currentFocus() {
321
321
  return typeof document === "undefined" ? null : document.activeElement;
322
322
  }
323
+ function domElement(target) {
324
+ const node = target;
325
+ return typeof (node == null ? void 0 : node.matches) === "function" && typeof node.closest === "function" && typeof node.querySelector === "function";
326
+ }
323
327
  function focusTrigger(target) {
324
- if (typeof HTMLElement !== "undefined" && target instanceof HTMLElement) {
328
+ if (domElement(target)) {
325
329
  return target.matches("button,input,[href],[tabindex]") ? target : target.querySelector("button,input,[href],[tabindex]") || target;
326
330
  }
327
331
  return target;
328
332
  }
333
+ function isRestorableFocus(item) {
334
+ return (item == null ? void 0 : item.isConnected) !== false && !(domElement(item) && item.closest("[inert]"));
335
+ }
329
336
  function restoreFocus(target, state, id, fallback2) {
330
- const usable = (item) => (item == null ? void 0 : item.isConnected) !== false && !(typeof HTMLElement !== "undefined" && item instanceof HTMLElement && item.closest("[inert]"));
331
337
  const restore = () => {
332
338
  var _a, _b, _c, _d, _e;
333
339
  if (state.entries.has(id)) return;
334
- if (usable(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
335
- else if (fallback2 && fallback2 !== target && usable(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
340
+ if (isRestorableFocus(target)) (_a = target == null ? void 0 : target.focus) == null ? void 0 : _a.call(target, { preventScroll: true });
341
+ else if (fallback2 && fallback2 !== target && isRestorableFocus(fallback2)) (_b = fallback2.focus) == null ? void 0 : _b.call(fallback2, { preventScroll: true });
336
342
  else (_e = (_d = (_c = state.topWindow()) == null ? void 0 : _c.root) == null ? void 0 : _d.focus) == null ? void 0 : _e.call(_d, { preventScroll: true });
337
343
  };
338
344
  if (typeof requestAnimationFrame !== "undefined") requestAnimationFrame(restore);
@@ -5510,7 +5516,7 @@ function KjunSelect({
5510
5516
  ...compound ? { paddingHorizontal: tokens30.extensions.timePicker.segmentPadding, paddingRight: tokens30.extensions.timePicker.segmentPadding, paddingLeft: compound.leading ? spec.padding - tokens30.border.controlWidth : tokens30.extensions.timePicker.segmentPadding, gap: tokens30.extensions.timePicker.segmentPadding, backgroundColor: !disabled && (surface.active || surface.hovered) ? colors.hover : "transparent", borderColor: "transparent", outlineWidth: 0 } : {}
5511
5517
  },
5512
5518
  children: [
5513
- /* @__PURE__ */ jsxs21(View27, { style: { flex: 1, minWidth: 0, paddingRight: clearable && label ? tokens30.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5519
+ /* @__PURE__ */ jsxs21(View27, { style: { ...compound ? { flexGrow: 1, flexShrink: 0 } : { flex: 1, minWidth: 0 }, paddingRight: clearable && label ? tokens30.native.minimumTouchTarget + spec.affixGap : 0 }, children: [
5514
5520
  compound && /* @__PURE__ */ jsx33(KText, { "aria-hidden": true, importantForAccessibility: "no-hide-descendants", style: { ...inputTypeStyle(size), fontVariant: ["tabular-nums"], opacity: 0 }, children: "00" }),
5515
5521
  (renderSelected == null ? void 0 : renderSelected(selectedOption)) || /* @__PURE__ */ jsx33(KText, { numberOfLines: 1, style: {
5516
5522
  ...inputTypeStyle(size),
package/dist/types/shared/package-runtime/use-layer.d.cts CHANGED
@@ -35,6 +35,7 @@ export declare function usePopupFocusGuard(trigger: {
35
35
  };
36
36
  export declare function useActiveLayerScope(): boolean;
37
37
  export declare function focusTrigger(target: FocusTarget | null | undefined): FocusTarget | HTMLElement | null | undefined;
38
+ export declare function isRestorableFocus(item: FocusTarget | null | undefined): boolean;
38
39
  export declare function useLayer(open: boolean, present: boolean, kind: LayerKind, close: () => void, trigger?: {
39
40
  current: FocusTarget | null;
40
41
  }, returnFocus?: () => FocusTarget | null | false | undefined): {
package/dist/types/shared/package-runtime/use-layer.d.ts CHANGED
@@ -35,6 +35,7 @@ export declare function usePopupFocusGuard(trigger: {
35
35
  };
36
36
  export declare function useActiveLayerScope(): boolean;
37
37
  export declare function focusTrigger(target: FocusTarget | null | undefined): FocusTarget | HTMLElement | null | undefined;
38
+ export declare function isRestorableFocus(item: FocusTarget | null | undefined): boolean;
38
39
  export declare function useLayer(open: boolean, present: boolean, kind: LayerKind, close: () => void, trigger?: {
39
40
  current: FocusTarget | null;
40
41
  }, returnFocus?: () => FocusTarget | null | false | undefined): {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kjun-ui/native",
3
- "version": "0.12.0",
3
+ "version": "0.12.2",
4
4
  "license": "MIT",
5
5
  "homepage": "https://ui.kjun.dev",
6
6
  "repository": {
@@ -47,8 +47,8 @@
47
47
  "./package.json": "./package.json"
48
48
  },
49
49
  "dependencies": {
50
- "@kjun-ui/tokens": "0.12.0",
51
- "@kjun-ui/icons": "0.12.0"
50
+ "@kjun-ui/tokens": "0.12.2",
51
+ "@kjun-ui/icons": "0.12.2"
52
52
  },
53
53
  "peerDependencies": {
54
54
  "react": "^19.2.3",