@spacesync/client 0.1.0

package/dist/use-client-pagination.d.ts

@@ -0,0 +1,22 @@
+type UseClientPaginationOptions = {
+    initialPageSize?: number;
+    pageSizeOptions?: readonly number[];
+    resetDeps?: unknown[];
+};
+type UseClientPaginationResult<T> = {
+    page: number;
+    setPage: (page: number) => void;
+    pageSize: number;
+    setPageSize: (size: number) => void;
+    pageSizeOptions: readonly number[];
+    pageItems: T[];
+    totalItems: number;
+    totalPages: number;
+    rangeStart: number;
+    rangeEnd: number;
+    canPrev: boolean;
+    canNext: boolean;
+};
+declare function useClientPagination<T>(items: T[], { initialPageSize, pageSizeOptions, resetDeps, }?: UseClientPaginationOptions): UseClientPaginationResult<T>;
+
+export { type UseClientPaginationOptions, type UseClientPaginationResult, useClientPagination };

package/dist/use-client-pagination.js

@@ -0,0 +1,51 @@
+import { useState, useEffect, useMemo } from 'react';
+
+// src/hooks/use-client-pagination.ts
+var DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100];
+function useClientPagination(items, {
+  initialPageSize = 25,
+  pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,
+  resetDeps = []
+} = {}) {
+  const [page, setPage] = useState(1);
+  const [pageSize, setPageSizeState] = useState(initialPageSize);
+  useEffect(() => {
+    setPage(1);
+  }, resetDeps);
+  const totalItems = items.length;
+  const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));
+  useEffect(() => {
+    if (page > totalPages) {
+      setPage(totalPages);
+    }
+  }, [page, totalPages]);
+  const pageItems = useMemo(() => {
+    if (totalItems === 0) return [];
+    const start = (page - 1) * pageSize;
+    return items.slice(start, start + pageSize);
+  }, [items, page, pageSize, totalItems]);
+  const rangeStart = totalItems === 0 ? 0 : (page - 1) * pageSize + 1;
+  const rangeEnd = totalItems === 0 ? 0 : Math.min(page * pageSize, totalItems);
+  const setPageSize = (size) => {
+    setPageSizeState(size);
+    setPage(1);
+  };
+  return {
+    page,
+    setPage,
+    pageSize,
+    setPageSize,
+    pageSizeOptions,
+    pageItems,
+    totalItems,
+    totalPages,
+    rangeStart,
+    rangeEnd,
+    canPrev: page > 1,
+    canNext: page < totalPages
+  };
+}
+
+export { useClientPagination };
+//# sourceMappingURL=use-client-pagination.js.map
+//# sourceMappingURL=use-client-pagination.js.map

package/dist/use-client-pagination.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-client-pagination.ts"],"names":[],"mappings":";;;AAEA,IAAM,yBAAA,GAA4B,CAAC,EAAA,EAAI,EAAA,EAAI,IAAI,GAAG,CAAA;AAuB3C,SAAS,oBACd,KAAA,EACA;AAAA,EACE,eAAA,GAAkB,EAAA;AAAA,EAClB,eAAA,GAAkB,yBAAA;AAAA,EAClB,YAAY;AACd,CAAA,GAAgC,EAAC,EACH;AAC9B,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAS,CAAC,CAAA;AAClC,EAAA,MAAM,CAAC,QAAA,EAAU,gBAAgB,CAAA,GAAI,SAAS,eAAe,CAAA;AAE7D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,EAEX,GAAG,SAAS,CAAA;AAEZ,EAAA,MAAM,aAAa,KAAA,CAAM,MAAA;AACzB,EAAA,MAAM,UAAA,GAAa,KAAK,GAAA,CAAI,CAAA,EAAG,KAAK,IAAA,CAAK,UAAA,GAAa,QAAQ,CAAC,CAAA;AAE/D,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,OAAO,UAAA,EAAY;AACrB,MAAA,OAAA,CAAQ,UAAU,CAAA;AAAA,IACpB;AAAA,EACF,CAAA,EAAG,CAAC,IAAA,EAAM,UAAU,CAAC,CAAA;AAErB,EAAA,MAAM,SAAA,GAAY,QAAQ,MAAM;AAC9B,IAAA,IAAI,UAAA,KAAe,CAAA,EAAG,OAAO,EAAC;AAC9B,IAAA,MAAM,KAAA,GAAA,CAAS,OAAO,CAAA,IAAK,QAAA;AAC3B,IAAA,OAAO,KAAA,CAAM,KAAA,CAAM,KAAA,EAAO,KAAA,GAAQ,QAAQ,CAAA;AAAA,EAC5C,GAAG,CAAC,KAAA,EAAO,IAAA,EAAM,QAAA,EAAU,UAAU,CAAC,CAAA;AAEtC,EAAA,MAAM,aAAa,UAAA,KAAe,CAAA,GAAI,CAAA,GAAA,CAAK,IAAA,GAAO,KAAK,QAAA,GAAW,CAAA;AAClE,EAAA,MAAM,QAAA,GAAW,eAAe,CAAA,GAAI,CAAA,GAAI,KAAK,GAAA,CAAI,IAAA,GAAO,UAAU,UAAU,CAAA;AAE5E,EAAA,MAAM,WAAA,GAAc,CAAC,IAAA,KAAiB;AACpC,IAAA,gBAAA,CAAiB,IAAI,CAAA;AACrB,IAAA,OAAA,CAAQ,CAAC,CAAA;AAAA,EACX,CAAA;AAEA,EAAA,OAAO;AAAA,IACL,IAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA;AAAA,IACA,eAAA;AAAA,IACA,SAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,UAAA;AAAA,IACA,QAAA;AAAA,IACA,SAAS,IAAA,GAAO,CAAA;AAAA,IAChB,SAAS,IAAA,GAAO;AAAA,GAClB;AACF","file":"use-client-pagination.js","sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\n\nconst DEFAULT_PAGE_SIZE_OPTIONS = [10, 25, 50, 100] as const;\n\nexport type UseClientPaginationOptions = {\n  initialPageSize?: number;\n  pageSizeOptions?: readonly number[];\n  resetDeps?: unknown[];\n};\n\nexport type UseClientPaginationResult<T> = {\n  page: number;\n  setPage: (page: number) => void;\n  pageSize: number;\n  setPageSize: (size: number) => void;\n  pageSizeOptions: readonly number[];\n  pageItems: T[];\n  totalItems: number;\n  totalPages: number;\n  rangeStart: number;\n  rangeEnd: number;\n  canPrev: boolean;\n  canNext: boolean;\n};\n\nexport function useClientPagination<T>(\n  items: T[],\n  {\n    initialPageSize = 25,\n    pageSizeOptions = DEFAULT_PAGE_SIZE_OPTIONS,\n    resetDeps = [],\n  }: UseClientPaginationOptions = {},\n): UseClientPaginationResult<T> {\n  const [page, setPage] = useState(1);\n  const [pageSize, setPageSizeState] = useState(initialPageSize);\n\n  useEffect(() => {\n    setPage(1);\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- resetDeps is caller-controlled\n  }, resetDeps);\n\n  const totalItems = items.length;\n  const totalPages = Math.max(1, Math.ceil(totalItems / pageSize));\n\n  useEffect(() => {\n    if (page > totalPages) {\n      setPage(totalPages);\n    }\n  }, [page, totalPages]);\n\n  const pageItems = useMemo(() => {\n    if (totalItems === 0) return [];\n    const start = (page - 1) * pageSize;\n    return items.slice(start, start + pageSize);\n  }, [items, page, pageSize, totalItems]);\n\n  const rangeStart = totalItems === 0 ? 0 : (page - 1) * pageSize + 1;\n  const rangeEnd = totalItems === 0 ? 0 : Math.min(page * pageSize, totalItems);\n\n  const setPageSize = (size: number) => {\n    setPageSizeState(size);\n    setPage(1);\n  };\n\n  return {\n    page,\n    setPage,\n    pageSize,\n    setPageSize,\n    pageSizeOptions,\n    pageItems,\n    totalItems,\n    totalPages,\n    rangeStart,\n    rangeEnd,\n    canPrev: page > 1,\n    canNext: page < totalPages,\n  };\n}\n"]}

package/dist/use-client-sort.d.ts

@@ -0,0 +1,20 @@
+type SortDirection = "asc" | "desc";
+type ClientSortState<K extends string> = {
+    key: K;
+    direction: SortDirection;
+};
+type UseClientSortOptions<K extends string> = {
+    defaultSort: ClientSortState<K>;
+    resetDeps?: unknown[];
+    /** Per-column direction when activating a new column (defaults to asc). */
+    initialDirectionForKey?: Partial<Record<K, SortDirection>>;
+};
+type UseClientSortResult<K extends string> = {
+    sort: ClientSortState<K>;
+    setSort: (sort: ClientSortState<K>) => void;
+    toggleSort: (key: K) => void;
+};
+declare function useClientSort<K extends string>({ defaultSort, resetDeps, initialDirectionForKey, }: UseClientSortOptions<K>): UseClientSortResult<K>;
+declare function sortBy<T, K extends string>(items: T[], sort: ClientSortState<K>, comparators: Record<K, (a: T, b: T) => number>): T[];
+
+export { type ClientSortState, type SortDirection, type UseClientSortOptions, type UseClientSortResult, sortBy, useClientSort };

package/dist/use-client-sort.js

@@ -0,0 +1,41 @@
+import { useState, useEffect, useCallback } from 'react';
+
+// src/hooks/use-client-sort.ts
+function useClientSort({
+  defaultSort,
+  resetDeps = [],
+  initialDirectionForKey
+}) {
+  const [sort, setSort] = useState(defaultSort);
+  useEffect(() => {
+    setSort(defaultSort);
+  }, resetDeps);
+  const toggleSort = useCallback(
+    (key) => {
+      setSort((prev) => {
+        if (prev.key === key) {
+          return {
+            key,
+            direction: prev.direction === "asc" ? "desc" : "asc"
+          };
+        }
+        return {
+          key,
+          direction: initialDirectionForKey?.[key] ?? "asc"
+        };
+      });
+    },
+    [initialDirectionForKey]
+  );
+  return { sort, setSort, toggleSort };
+}
+function sortBy(items, sort, comparators) {
+  const compare = comparators[sort.key];
+  if (!compare) return [...items];
+  const directionMultiplier = sort.direction === "asc" ? 1 : -1;
+  return [...items].sort((a, b) => compare(a, b) * directionMultiplier);
+}
+
+export { sortBy, useClientSort };
+//# sourceMappingURL=use-client-sort.js.map
+//# sourceMappingURL=use-client-sort.js.map

package/dist/use-client-sort.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hooks/use-client-sort.ts"],"names":[],"mappings":";;;AAsBO,SAAS,aAAA,CAAgC;AAAA,EAC9C,WAAA;AAAA,EACA,YAAY,EAAC;AAAA,EACb;AACF,CAAA,EAAoD;AAClD,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAA6B,WAAW,CAAA;AAEhE,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,OAAA,CAAQ,WAAW,CAAA;AAAA,EAErB,GAAG,SAAS,CAAA;AAEZ,EAAA,MAAM,UAAA,GAAa,WAAA;AAAA,IACjB,CAAC,GAAA,KAAW;AACV,MAAA,OAAA,CAAQ,CAAC,IAAA,KAAS;AAChB,QAAA,IAAI,IAAA,CAAK,QAAQ,GAAA,EAAK;AACpB,UAAA,OAAO;AAAA,YACL,GAAA;AAAA,YACA,SAAA,EAAW,IAAA,CAAK,SAAA,KAAc,KAAA,GAAQ,MAAA,GAAS;AAAA,WACjD;AAAA,QACF;AACA,QAAA,OAAO;AAAA,UACL,GAAA;AAAA,UACA,SAAA,EAAW,sBAAA,GAAyB,GAAG,CAAA,IAAK;AAAA,SAC9C;AAAA,MACF,CAAC,CAAA;AAAA,IACH,CAAA;AAAA,IACA,CAAC,sBAAsB;AAAA,GACzB;AAEA,EAAA,OAAO,EAAE,IAAA,EAAM,OAAA,EAAS,UAAA,EAAW;AACrC;AAEO,SAAS,MAAA,CACd,KAAA,EACA,IAAA,EACA,WAAA,EACK;AACL,EAAA,MAAM,OAAA,GAAU,WAAA,CAAY,IAAA,CAAK,GAAG,CAAA;AACpC,EAAA,IAAI,CAAC,OAAA,EAAS,OAAO,CAAC,GAAG,KAAK,CAAA;AAE9B,EAAA,MAAM,mBAAA,GAAsB,IAAA,CAAK,SAAA,KAAc,KAAA,GAAQ,CAAA,GAAI,EAAA;AAC3D,EAAA,OAAO,CAAC,GAAG,KAAK,CAAA,CAAE,IAAA,CAAK,CAAC,CAAA,EAAG,CAAA,KAAM,OAAA,CAAQ,CAAA,EAAG,CAAC,CAAA,GAAI,mBAAmB,CAAA;AACtE","file":"use-client-sort.js","sourcesContent":["import { useCallback, useEffect, useState } from \"react\";\n\nexport type SortDirection = \"asc\" | \"desc\";\n\nexport type ClientSortState<K extends string> = {\n  key: K;\n  direction: SortDirection;\n};\n\nexport type UseClientSortOptions<K extends string> = {\n  defaultSort: ClientSortState<K>;\n  resetDeps?: unknown[];\n  /** Per-column direction when activating a new column (defaults to asc). */\n  initialDirectionForKey?: Partial<Record<K, SortDirection>>;\n};\n\nexport type UseClientSortResult<K extends string> = {\n  sort: ClientSortState<K>;\n  setSort: (sort: ClientSortState<K>) => void;\n  toggleSort: (key: K) => void;\n};\n\nexport function useClientSort<K extends string>({\n  defaultSort,\n  resetDeps = [],\n  initialDirectionForKey,\n}: UseClientSortOptions<K>): UseClientSortResult<K> {\n  const [sort, setSort] = useState<ClientSortState<K>>(defaultSort);\n\n  useEffect(() => {\n    setSort(defaultSort);\n    // eslint-disable-next-line react-hooks/exhaustive-deps -- resetDeps is caller-controlled\n  }, resetDeps);\n\n  const toggleSort = useCallback(\n    (key: K) => {\n      setSort((prev) => {\n        if (prev.key === key) {\n          return {\n            key,\n            direction: prev.direction === \"asc\" ? \"desc\" : \"asc\",\n          };\n        }\n        return {\n          key,\n          direction: initialDirectionForKey?.[key] ?? \"asc\",\n        };\n      });\n    },\n    [initialDirectionForKey],\n  );\n\n  return { sort, setSort, toggleSort };\n}\n\nexport function sortBy<T, K extends string>(\n  items: T[],\n  sort: ClientSortState<K>,\n  comparators: Record<K, (a: T, b: T) => number>,\n): T[] {\n  const compare = comparators[sort.key];\n  if (!compare) return [...items];\n\n  const directionMultiplier = sort.direction === \"asc\" ? 1 : -1;\n  return [...items].sort((a, b) => compare(a, b) * directionMultiplier);\n}\n"]}

package/package.json

@@ -0,0 +1,208 @@
+{
+  "name": "@spacesync/client",
+  "version": "0.1.0",
+  "description": "Reusable SpaceSync React UI, shell, theme, and API client primitives.",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "exports": {
+    "./api": {
+      "types": "./dist/api.d.ts",
+      "import": "./dist/api.js"
+    },
+    "./forms": {
+      "types": "./dist/forms.d.ts",
+      "import": "./dist/forms.js"
+    },
+    "./ui": {
+      "types": "./dist/ui.d.ts",
+      "import": "./dist/ui.js"
+    },
+    "./app-web-shell": {
+      "types": "./dist/app-web-shell.d.ts",
+      "import": "./dist/app-web-shell.js"
+    },
+    "./app-shell-mobile-nav": {
+      "types": "./dist/app-shell-mobile-nav.d.ts",
+      "import": "./dist/app-shell-mobile-nav.js"
+    },
+    "./app-modal": {
+      "types": "./dist/app-modal.d.ts",
+      "import": "./dist/app-modal.js"
+    },
+    "./page-list-chrome": {
+      "types": "./dist/page-list-chrome.d.ts",
+      "import": "./dist/page-list-chrome.js"
+    },
+    "./detail-page-header": {
+      "types": "./dist/detail-page-header.d.ts",
+      "import": "./dist/detail-page-header.js"
+    },
+    "./use-client-pagination": {
+      "types": "./dist/use-client-pagination.d.ts",
+      "import": "./dist/use-client-pagination.js"
+    },
+    "./use-client-sort": {
+      "types": "./dist/use-client-sort.d.ts",
+      "import": "./dist/use-client-sort.js"
+    },
+    "./shell-top-bar": {
+      "types": "./dist/shell-top-bar.d.ts",
+      "import": "./dist/shell-top-bar.js"
+    },
+    "./shell-sidebar-nav": {
+      "types": "./dist/shell-sidebar-nav.d.ts",
+      "import": "./dist/shell-sidebar-nav.js"
+    },
+    "./shell-top-bar-chrome": {
+      "types": "./dist/shell-top-bar-chrome.d.ts",
+      "import": "./dist/shell-top-bar-chrome.js"
+    },
+    "./notification-sidebar-preview": {
+      "types": "./dist/notification-sidebar-preview.d.ts",
+      "import": "./dist/notification-sidebar-preview.js"
+    },
+    "./lib/dateDisplay": {
+      "types": "./dist/lib/dateDisplay.d.ts",
+      "import": "./dist/lib/dateDisplay.js"
+    },
+    "./live-resource-meta": {
+      "types": "./dist/live-resource-meta.d.ts",
+      "import": "./dist/live-resource-meta.js"
+    },
+    "./live-space-pulse-dot": {
+      "types": "./dist/live-space-pulse-dot.d.ts",
+      "import": "./dist/live-space-pulse-dot.js"
+    },
+    "./support-presence-status": {
+      "types": "./dist/support-presence-status.d.ts",
+      "import": "./dist/support-presence-status.js"
+    },
+    "./layout-canvas-view": {
+      "types": "./dist/layout-canvas-view.d.ts",
+      "import": "./dist/layout-canvas-view.js"
+    },
+    "./floor-switcher": {
+      "types": "./dist/floor-switcher.d.ts",
+      "import": "./dist/floor-switcher.js"
+    },
+    "./file-viewer-dialog": {
+      "types": "./dist/file-viewer-dialog.d.ts",
+      "import": "./dist/file-viewer-dialog.js"
+    },
+    "./file-picker-field": {
+      "types": "./dist/file-picker-field.d.ts",
+      "import": "./dist/file-picker-field.js"
+    },
+    "./platform-support-message-composer": {
+      "types": "./dist/platform-support-message-composer.d.ts",
+      "import": "./dist/platform-support-message-composer.js"
+    },
+    "./chat-stick-to-bottom": {
+      "types": "./dist/chat-stick-to-bottom.d.ts",
+      "import": "./dist/chat-stick-to-bottom.js"
+    },
+    "./image-picker-field": {
+      "types": "./dist/image-picker-field.d.ts",
+      "import": "./dist/image-picker-field.js"
+    },
+    "./booking-schedule-calendars": {
+      "types": "./dist/booking-schedule-calendars.d.ts",
+      "import": "./dist/booking-schedule-calendars.js"
+    },
+    "./analog-clock-picker": {
+      "types": "./dist/analog-clock-picker.d.ts",
+      "import": "./dist/analog-clock-picker.js"
+    },
+    "./shell-theme": {
+      "types": "./dist/shell-theme.d.ts",
+      "import": "./dist/shell-theme.js"
+    },
+    "./theme-provider": {
+      "types": "./dist/theme-provider.d.ts",
+      "import": "./dist/theme-provider.js"
+    },
+    "./theme-appearance-control": {
+      "types": "./dist/theme-appearance-control.d.ts",
+      "import": "./dist/theme-appearance-control.js"
+    },
+    "./theme-boot-script": {
+      "types": "./dist/theme-boot-script.d.ts",
+      "import": "./dist/theme-boot-script.js"
+    },
+    "./styles/theme.css": "./dist/styles/theme.css"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "dependencies": {
+    "@fontsource-variable/inter": "^5.2.8",
+    "@hookform/resolvers": "^5.4.0",
+    "@radix-ui/react-accordion": "1.2.3",
+    "@radix-ui/react-alert-dialog": "1.1.6",
+    "@radix-ui/react-aspect-ratio": "1.1.2",
+    "@radix-ui/react-avatar": "1.1.3",
+    "@radix-ui/react-checkbox": "1.1.4",
+    "@radix-ui/react-collapsible": "1.1.3",
+    "@radix-ui/react-context-menu": "2.2.6",
+    "@radix-ui/react-dialog": "1.1.6",
+    "@radix-ui/react-dropdown-menu": "2.1.6",
+    "@radix-ui/react-hover-card": "1.1.6",
+    "@radix-ui/react-label": "2.1.2",
+    "@radix-ui/react-menubar": "1.1.6",
+    "@radix-ui/react-navigation-menu": "1.2.5",
+    "@radix-ui/react-popover": "1.1.6",
+    "@radix-ui/react-progress": "1.1.2",
+    "@radix-ui/react-radio-group": "1.2.3",
+    "@radix-ui/react-scroll-area": "1.2.3",
+    "@radix-ui/react-select": "2.1.6",
+    "@radix-ui/react-separator": "1.1.2",
+    "@radix-ui/react-slider": "1.2.3",
+    "@radix-ui/react-slot": "1.1.2",
+    "@radix-ui/react-switch": "1.1.3",
+    "@radix-ui/react-tabs": "1.1.3",
+    "@radix-ui/react-toggle": "1.1.2",
+    "@radix-ui/react-toggle-group": "1.1.2",
+    "@radix-ui/react-tooltip": "1.1.8",
+    "axios": "^1.18.1",
+    "class-variance-authority": "0.7.1",
+    "clsx": "2.1.1",
+    "cmdk": "1.1.1",
+    "embla-carousel-react": "8.6.0",
+    "framer-motion": "^12.38.0",
+    "input-otp": "1.4.2",
+    "lucide-react": "0.487.0",
+    "next-themes": "0.4.6",
+    "react-day-picker": "8.10.1",
+    "react-hook-form": "7.55.0",
+    "react-resizable-panels": "2.1.7",
+    "recharts": "2.15.2",
+    "sonner": "2.0.3",
+    "tailwind-merge": "3.2.0",
+    "vaul": "1.1.2",
+    "zod": "^3.24.1"
+  },
+  "scripts": {
+    "build": "tsup",
+    "typecheck": "tsc --noEmit -p tsconfig.json",
+    "prepack": "pnpm build",
+    "prepublishOnly": "pnpm typecheck"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.28",
+    "@types/react-dom": "^18.3.7",
+    "tsup": "^8.5.1",
+    "typescript": "^6.0.3"
+  }
+}