@oneflowui/ui 0.8.4 → 0.8.6

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 (36) hide show
  1. package/README.en.md +296 -0
  2. package/README.md +296 -0
  3. package/dist/components/ai/AiMessageList.vue.js +1 -1
  4. package/dist/components/ai/AiMessageList.vue2.js +28 -27
  5. package/dist/components/common/ThemeScope.vue.d.ts +24 -0
  6. package/dist/components/common/ThemeScope.vue.js +24 -0
  7. package/dist/components/common/ThemeScope.vue2.js +4 -0
  8. package/dist/components/common/ThemeScopeScene.vue.d.ts +31 -0
  9. package/dist/components/common/ThemeScopeScene.vue.js +7 -0
  10. package/dist/components/common/ThemeScopeScene.vue2.js +56 -0
  11. package/dist/components/common/index.d.ts +2 -0
  12. package/dist/components/database/DatabaseView.vue.d.ts +4 -4
  13. package/dist/components/database/DatabaseView.vue.js +4 -4
  14. package/dist/components/database/DatabaseView.vue2.js +135 -134
  15. package/dist/components/database/index.d.ts +1 -1
  16. package/dist/components/kanban/KanbanColumn.vue.js +3 -3
  17. package/dist/components/kanban/KanbanColumn.vue2.js +31 -30
  18. package/dist/components/table/DataTable.vue.js +2 -2
  19. package/dist/components/table/DataTable.vue2.js +251 -249
  20. package/dist/composables/index.d.ts +5 -3
  21. package/dist/composables/useDataTableLayout.d.ts +1 -0
  22. package/dist/composables/useDataTableLayout.js +29 -26
  23. package/dist/composables/useDatabaseView.d.ts +1 -1
  24. package/dist/composables/useDatabaseView.js +311 -284
  25. package/dist/composables/useDatabaseViewMiddleware.d.ts +56 -0
  26. package/dist/composables/useDatabaseViewMiddleware.js +158 -0
  27. package/dist/composables/useVirtualList.d.ts +11 -0
  28. package/dist/composables/useVirtualList.js +146 -104
  29. package/dist/composables.js +74 -0
  30. package/dist/contracts/database.d.ts +23 -0
  31. package/dist/index.d.ts +6 -3
  32. package/dist/index.js +267 -253
  33. package/dist/style.css +1 -1
  34. package/dist/theme.d.ts +1 -0
  35. package/dist/theme.js +4 -0
  36. package/package.json +16 -2
@@ -14,8 +14,8 @@ export { useMarkdown } from './useMarkdown';
14
14
  export type { UseMarkdownOptions } from './useMarkdown';
15
15
  export { useInlineEdit } from './useInlineEdit';
16
16
  export type { EditingCell } from './useInlineEdit';
17
- export { useVirtualList } from './useVirtualList';
18
- export type { UseVirtualListOptions, VirtualItem } from './useVirtualList';
17
+ export { createVirtualListState, useVirtualList, useVirtualListStateCache } from './useVirtualList';
18
+ export type { UseVirtualListOptions, VirtualItem, VirtualListState } from './useVirtualList';
19
19
  export { useToast } from './useToast';
20
20
  export type { UseToastOptions, ToastType, ToastItem } from './useToast';
21
21
  export { useTableData } from './useTableData';
@@ -45,7 +45,9 @@ export type { SupabaseQueryBuilder, SupabaseFilterBuilder, UseSupabaseProviderOp
45
45
  export { useViewPersistence, createLocalStorageBackend, createSupabaseBackend, } from './useViewPersistence';
46
46
  export type { ViewStorageBackend, SupabaseViewBackendOptions, UseViewPersistenceOptions, } from './useViewPersistence';
47
47
  export { useDatabaseView } from './useDatabaseView';
48
- export type { DatabaseViewMode, DatabaseViewFetchParams, DatabaseViewFetchResult, DatabaseViewProvider, DatabaseSchemaEvent, DatabaseViewActions, DatabaseViewDetailOptions, DatabaseViewNavigationOptions, UseDatabaseViewOptions, UseDatabaseViewResult, } from './useDatabaseView';
48
+ export { composeDatabaseViewMiddlewares, createDatabaseViewAnalyticsMiddleware, createDatabaseViewPresetInputs, createDatabaseViewPresetBundle, createDatabaseViewPresetMiddleware, createDatabaseViewToastMiddleware, createDatabaseViewOptimisticMiddleware, } from './useDatabaseViewMiddleware';
49
+ export type { DatabaseViewActionContext, DatabaseViewActionErrorContext, DatabaseViewActionMiddleware, DatabaseViewActionMiddlewareList, DatabaseViewMode, DatabaseViewFetchParams, DatabaseViewFetchResult, DatabaseViewProvider, DatabaseSchemaEvent, DatabaseViewActions, DatabaseViewDetailOptions, DatabaseViewNavigationOptions, UseDatabaseViewOptions, UseDatabaseViewResult, } from './useDatabaseView';
50
+ export type { DatabaseViewAnalyticsEvent, DatabaseViewAnalyticsMiddlewareOptions, DatabaseViewPresetMiddlewareOptions, DatabaseViewPresetBundle, DatabaseViewPresetBundleOptions, DatabaseViewMiddlewareInput, DatabaseViewOptimisticMiddlewareOptions, DatabaseViewToastMiddlewareOptions, } from './useDatabaseViewMiddleware';
49
51
  export { useDatabaseViewport, useDatabaseWorkspaceState } from './useDatabaseWorkspace';
50
52
  export { useSearch } from './useSearch';
51
53
  export type { UseSearchOptions, SearchHighlight } from './useSearch';
@@ -5,6 +5,7 @@ export declare function useDataTableLayout(params: {
5
5
  density: Ref<Density>;
6
6
  containerResponsive: Ref<boolean>;
7
7
  isMobile: Ref<boolean>;
8
+ onContainerWidthChange?: (width: number) => void;
8
9
  }): {
9
10
  tableContainerWidth: Ref<number, number>;
10
11
  containerDensity: import('vue').ComputedRef<Density>;
@@ -1,38 +1,41 @@
1
- import { ref as m, onMounted as g, onBeforeUnmount as y, computed as n } from "vue";
1
+ import { ref as x, onMounted as g, onBeforeUnmount as w, computed as o } from "vue";
2
2
  import { TABLE_DENSITY_METRICS as h } from "../types/data-table.js";
3
- function x(c) {
4
- const { tableContainerRef: o, density: l, containerResponsive: f, isMobile: v } = c, e = m(0);
5
- let t = null;
6
- function d() {
3
+ function M(v) {
4
+ const { tableContainerRef: r, density: u, containerResponsive: s, isMobile: b, onContainerWidthChange: a } = v, e = x(0);
5
+ let n = null;
6
+ function f() {
7
7
  var i;
8
- e.value = ((i = o.value) == null ? void 0 : i.clientWidth) ?? 0;
8
+ const l = ((i = r.value) == null ? void 0 : i.clientWidth) ?? 0;
9
+ l !== e.value && (e.value = l, a == null || a(l));
9
10
  }
10
11
  g(() => {
11
- d(), !(typeof ResizeObserver > "u" || !o.value) && (t = new ResizeObserver((i) => {
12
- const u = i[0];
13
- u && (e.value = u.contentRect.width);
14
- }), t.observe(o.value));
15
- }), y(() => {
16
- t == null || t.disconnect(), t = null;
12
+ f(), !(typeof ResizeObserver > "u" || !r.value) && (n = new ResizeObserver((l) => {
13
+ const i = l[0];
14
+ if (!i) return;
15
+ const c = i.contentRect.width;
16
+ c !== e.value && (e.value = c, a == null || a(c));
17
+ }), n.observe(r.value));
18
+ }), w(() => {
19
+ n == null || n.disconnect(), n = null;
17
20
  });
18
- const r = n(() => !f.value || v.value ? l.value : e.value > 0 && e.value <= 860 ? "compact" : e.value > 0 && e.value <= 1080 && l.value === "comfortable" ? "standard" : l.value), a = n(() => h[r.value]), s = n(() => `of-data-table--${r.value}`), b = n(() => e.value > 0 && e.value <= 860 ? "of-data-table--container-tight" : e.value > 0 && e.value <= 1080 ? "of-data-table--container-medium" : "of-data-table--container-wide"), p = n(() => ({
19
- "--of-data-table-group-row-height": `${a.value.groupRowHeight}px`,
20
- "--of-data-table-mobile-card-padding-x": `${a.value.mobileCardPaddingX}px`,
21
- "--of-data-table-mobile-card-padding-y": `${a.value.mobileCardPaddingY}px`,
22
- "--of-data-table-new-row-padding-x": `${a.value.mobileCardPaddingX}px`,
23
- "--of-data-table-new-row-padding-y": `${a.value.mobileCardPaddingY}px`,
24
- "--of-data-table-fill-min-width": `${a.value.fillMinWidth}px`
21
+ const d = o(() => !s.value || b.value ? u.value : e.value > 0 && e.value <= 860 ? "compact" : e.value > 0 && e.value <= 1080 && u.value === "comfortable" ? "standard" : u.value), t = o(() => h[d.value]), p = o(() => `of-data-table--${d.value}`), m = o(() => e.value > 0 && e.value <= 860 ? "of-data-table--container-tight" : e.value > 0 && e.value <= 1080 ? "of-data-table--container-medium" : "of-data-table--container-wide"), y = o(() => ({
22
+ "--of-data-table-group-row-height": `${t.value.groupRowHeight}px`,
23
+ "--of-data-table-mobile-card-padding-x": `${t.value.mobileCardPaddingX}px`,
24
+ "--of-data-table-mobile-card-padding-y": `${t.value.mobileCardPaddingY}px`,
25
+ "--of-data-table-new-row-padding-x": `${t.value.mobileCardPaddingX}px`,
26
+ "--of-data-table-new-row-padding-y": `${t.value.mobileCardPaddingY}px`,
27
+ "--of-data-table-fill-min-width": `${t.value.fillMinWidth}px`
25
28
  }));
26
29
  return {
27
30
  tableContainerWidth: e,
28
- containerDensity: r,
29
- densityMetrics: a,
30
- densityClass: s,
31
- containerWidthClass: b,
32
- densityStyle: p,
33
- syncTableContainerWidth: d
31
+ containerDensity: d,
32
+ densityMetrics: t,
33
+ densityClass: p,
34
+ containerWidthClass: m,
35
+ densityStyle: y,
36
+ syncTableContainerWidth: f
34
37
  };
35
38
  }
36
39
  export {
37
- x as useDataTableLayout
40
+ M as useDataTableLayout
38
41
  };
@@ -1,4 +1,4 @@
1
1
  import { DataRecord } from '../types';
2
2
  import { UseDatabaseViewOptions, UseDatabaseViewResult } from '../contracts/database';
3
- export type { DatabaseViewMode, DatabaseViewFetchParams, DatabaseViewFetchResult, DatabaseViewProvider, DatabaseSchemaEvent, DatabaseViewActions, DatabaseViewDetailOptions, DatabaseViewNavigationOptions, UseDatabaseViewOptions, UseDatabaseViewResult, } from '../contracts/database';
3
+ export type { DatabaseViewActionContext, DatabaseViewActionErrorContext, DatabaseViewActionMiddleware, DatabaseViewActionMiddlewareList, DatabaseViewMode, DatabaseViewFetchParams, DatabaseViewFetchResult, DatabaseViewProvider, DatabaseSchemaEvent, DatabaseViewActions, DatabaseViewDetailOptions, DatabaseViewNavigationOptions, UseDatabaseViewOptions, UseDatabaseViewResult, } from '../contracts/database';
4
4
  export declare function useDatabaseView<T extends DataRecord = DataRecord>(options: UseDatabaseViewOptions<T>): UseDatabaseViewResult<T>;