@pixpilot/shadcn-ui 0.4.0 → 0.4.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.
- package/dist/AbsoluteFill.cjs +24 -1
- package/dist/AbsoluteFill.js +21 -1
- package/dist/Alert.cjs +82 -1
- package/dist/Alert.js +77 -1
- package/dist/Button.cjs +84 -1
- package/dist/Button.d.cts +1 -1
- package/dist/Button.d.ts +1 -1
- package/dist/Button.js +79 -1
- package/dist/CloseButtonAbsolute.cjs +20 -1
- package/dist/CloseButtonAbsolute.js +16 -1
- package/dist/CloseButtonRounded.cjs +22 -1
- package/dist/CloseButtonRounded.js +17 -1
- package/dist/Combobox.cjs +53 -1
- package/dist/Combobox.js +48 -1
- package/dist/CommandOptionList.cjs +29 -1
- package/dist/CommandOptionList.js +25 -1
- package/dist/ContentCard.cjs +27 -1
- package/dist/ContentCard.d.cts +1 -1
- package/dist/ContentCard.js +23 -1
- package/dist/DatePicker.cjs +38 -1
- package/dist/DatePicker.d.cts +1 -1
- package/dist/DatePicker.js +33 -1
- package/dist/LoadingOverlay.cjs +65 -1
- package/dist/LoadingOverlay.js +60 -1
- package/dist/Select.cjs +27 -1
- package/dist/Select.d.cts +1 -1
- package/dist/Select.js +23 -1
- package/dist/Slider.cjs +19 -1
- package/dist/Slider.js +15 -1
- package/dist/ThemeToggle.cjs +98 -1
- package/dist/ThemeToggle.js +94 -1
- package/dist/_virtual/rolldown_runtime.cjs +25 -1
- package/dist/confirmation-dialog/ConfirmationDialog.cjs +46 -1
- package/dist/confirmation-dialog/ConfirmationDialog.d.cts +1 -0
- package/dist/confirmation-dialog/ConfirmationDialog.js +42 -1
- package/dist/confirmation-dialog/DialogProvider.cjs +16 -1
- package/dist/confirmation-dialog/DialogProvider.js +12 -1
- package/dist/confirmation-dialog/confirmation-dialogs.cjs +14 -1
- package/dist/confirmation-dialog/confirmation-dialogs.js +12 -1
- package/dist/confirmation-dialog/index.cjs +6 -1
- package/dist/confirmation-dialog/index.js +6 -1
- package/dist/file-upload/FileUpload.cjs +68 -1
- package/dist/file-upload/FileUpload.d.ts +2 -2
- package/dist/file-upload/FileUpload.js +63 -1
- package/dist/file-upload/FileUploadItems.cjs +36 -1
- package/dist/file-upload/FileUploadItems.js +32 -1
- package/dist/file-upload/FileUploadListItem.cjs +88 -1
- package/dist/file-upload/FileUploadListItem.js +82 -1
- package/dist/file-upload/hooks/index.cjs +3 -1
- package/dist/file-upload/hooks/index.d.cts +2 -0
- package/dist/file-upload/hooks/index.js +3 -1
- package/dist/file-upload/hooks/use-file-error.cjs +15 -1
- package/dist/file-upload/hooks/use-file-error.js +13 -1
- package/dist/file-upload/hooks/use-file-upload-progress-callbacks.cjs +34 -1
- package/dist/file-upload/hooks/use-file-upload-progress-callbacks.d.cts +1 -0
- package/dist/file-upload/hooks/use-file-upload-progress-callbacks.js +31 -1
- package/dist/file-upload/hooks/use-file-upload-store.cjs +77 -1
- package/dist/file-upload/hooks/use-file-upload-store.d.cts +2 -0
- package/dist/file-upload/hooks/use-file-upload-store.js +75 -1
- package/dist/file-upload/index.cjs +5 -1
- package/dist/file-upload/index.d.cts +2 -1
- package/dist/file-upload/index.js +5 -1
- package/dist/file-upload/utils/create-placeholder-file.cjs +11 -1
- package/dist/file-upload/utils/create-placeholder-file.js +10 -1
- package/dist/file-upload/utils/get-file-key.cjs +8 -1
- package/dist/file-upload/utils/get-file-key.d.cts +1 -0
- package/dist/file-upload/utils/get-file-key.js +7 -1
- package/dist/file-upload/utils/get-file-meta.cjs +23 -1
- package/dist/file-upload/utils/get-file-meta.d.cts +1 -0
- package/dist/file-upload/utils/get-file-meta.js +21 -1
- package/dist/file-upload/utils/index.d.cts +4 -0
- package/dist/file-upload/utils/is-file-equal.cjs +9 -1
- package/dist/file-upload/utils/is-file-equal.d.cts +1 -0
- package/dist/file-upload/utils/is-file-equal.js +8 -1
- package/dist/file-upload/utils/merge-file-metadata.cjs +26 -1
- package/dist/file-upload/utils/merge-file-metadata.d.cts +1 -0
- package/dist/file-upload/utils/merge-file-metadata.js +26 -1
- package/dist/file-upload-inline/FileUploadInline.cjs +71 -1
- package/dist/file-upload-inline/FileUploadInline.d.ts +2 -2
- package/dist/file-upload-inline/FileUploadInline.js +66 -1
- package/dist/file-upload-inline/FileUploadInlineItem.cjs +94 -1
- package/dist/file-upload-inline/FileUploadInlineItem.js +88 -1
- package/dist/file-upload-inline/defaults.cjs +11 -1
- package/dist/file-upload-inline/defaults.js +10 -1
- package/dist/file-upload-inline/index.cjs +1 -1
- package/dist/file-upload-inline/index.js +1 -1
- package/dist/file-upload-inline/utils.cjs +36 -1
- package/dist/file-upload-inline/utils.js +34 -1
- package/dist/hooks/index.cjs +1 -1
- package/dist/hooks/index.js +1 -1
- package/dist/hooks/use-media-query.cjs +9 -1
- package/dist/hooks/use-media-query.js +7 -1
- package/dist/icon-selector/IconPicker.cjs +93 -1
- package/dist/icon-selector/IconPicker.d.cts +0 -1
- package/dist/icon-selector/IconPicker.d.ts +0 -1
- package/dist/icon-selector/IconPicker.js +88 -1
- package/dist/icon-selector/constants.cjs +6 -1
- package/dist/icon-selector/constants.js +5 -0
- package/dist/icon-selector/icon-picker-container.cjs +35 -1
- package/dist/icon-selector/icon-picker-container.js +32 -1
- package/dist/icon-selector/icon-picker-content.cjs +146 -1
- package/dist/icon-selector/icon-picker-content.js +141 -1
- package/dist/icon-selector/index.cjs +1 -1
- package/dist/icon-selector/index.d.cts +2 -2
- package/dist/icon-selector/index.d.ts +2 -2
- package/dist/icon-selector/index.js +1 -1
- package/dist/icon-selector/use-async-providers.cjs +69 -1
- package/dist/icon-selector/use-async-providers.js +67 -1
- package/dist/icon-selector/utils/is-valid-provider.cjs +11 -1
- package/dist/icon-selector/utils/is-valid-provider.js +10 -1
- package/dist/icon-selector/virtualized-icon-grid.cjs +137 -1
- package/dist/icon-selector/virtualized-icon-grid.js +132 -1
- package/dist/index.cjs +76 -1
- package/dist/index.d.cts +2 -2
- package/dist/index.d.ts +2 -2
- package/dist/index.js +37 -1
- package/dist/node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs +18 -0
- package/dist/node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js +17 -0
- package/dist/node_modules/.pnpm/tailwind-merge@3.4.0/node_modules/tailwind-merge/dist/bundle-mjs.cjs +1894 -0
- package/dist/node_modules/.pnpm/tailwind-merge@3.4.0/node_modules/tailwind-merge/dist/bundle-mjs.js +1893 -0
- package/dist/packages/shadcn/src/lib/utils.cjs +10 -1
- package/dist/packages/shadcn/src/lib/utils.js +10 -1
- package/dist/pagination/Pagination.cjs +156 -1
- package/dist/pagination/Pagination.js +151 -1
- package/dist/pagination/index.cjs +1 -1
- package/dist/pagination/index.js +1 -1
- package/dist/rich-text-editor/RichTextEditor.cjs +132 -1
- package/dist/rich-text-editor/RichTextEditor.js +126 -1
- package/dist/rich-text-editor/index.cjs +1 -1
- package/dist/rich-text-editor/index.js +1 -1
- package/dist/rich-text-editor/predefined-toolbar-options.cjs +84 -1
- package/dist/rich-text-editor/predefined-toolbar-options.js +81 -1
- package/dist/spinner/index.cjs +1 -1
- package/dist/spinner/index.js +1 -1
- package/dist/spinner/spinner.cjs +73 -6
- package/dist/spinner/spinner.js +70 -6
- package/dist/spinner/styles.cjs +24 -12
- package/dist/spinner/styles.js +23 -12
- package/dist/tags-input.cjs +226 -1
- package/dist/tags-input.js +222 -1
- package/dist/theme-provider/ThemeProvider.cjs +27 -1
- package/dist/theme-provider/ThemeProvider.js +23 -1
- package/dist/theme-provider/index.cjs +4 -1
- package/dist/theme-provider/index.js +4 -1
- package/dist/toast/AlertToast.cjs +36 -1
- package/dist/toast/AlertToast.js +31 -1
- package/dist/toast/index.cjs +1 -1
- package/dist/toast/index.js +1 -1
- package/dist/toast/toast.cjs +75 -1
- package/dist/toast/toast.js +66 -1
- package/package.json +2 -2
- package/dist/_virtual/rolldown_runtime.js +0 -1
- package/dist/node_modules/.pnpm/@diceui_shared@0.12.0_@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@1_2c51ffe880f01dd537d5b6a13313daf4/node_modules/@diceui/shared/dist/index.cjs +0 -1
- package/dist/node_modules/.pnpm/@diceui_shared@0.12.0_@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@1_2c51ffe880f01dd537d5b6a13313daf4/node_modules/@diceui/shared/dist/index.js +0 -1
- package/dist/node_modules/.pnpm/@diceui_tags-input@0.7.2_@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__reac_e193dc2ff0d426ed009417f8d89778fd/node_modules/@diceui/tags-input/dist/index.cjs +0 -1
- package/dist/node_modules/.pnpm/@diceui_tags-input@0.7.2_@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__reac_e193dc2ff0d426ed009417f8d89778fd/node_modules/@diceui/tags-input/dist/index.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_core@1.7.3/node_modules/@floating-ui/core/dist/floating-ui.core.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_core@1.7.3/node_modules/@floating-ui/core/dist/floating-ui.core.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_dom@1.7.4/node_modules/@floating-ui/dom/dist/floating-ui.dom.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react-dom@2.1.6_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react-dom@2.1.6_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react-dom/dist/floating-ui.react-dom.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.esm.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.esm.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.utils.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_react@0.27.16_react-dom@19.2.0_react@19.2.0__react@19.2.0/node_modules/@floating-ui/react/dist/floating-ui.react.utils.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.cjs +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.dom.js +0 -1
- package/dist/node_modules/.pnpm/@floating-ui_utils@0.2.10/node_modules/@floating-ui/utils/dist/floating-ui.utils.js +0 -1
- package/dist/node_modules/.pnpm/tabbable@6.3.0/node_modules/tabbable/dist/index.cjs +0 -1
- package/dist/node_modules/.pnpm/tabbable@6.3.0/node_modules/tabbable/dist/index.esm.js +0 -1
- package/dist/packages/shadcn/src/components/index.cjs +0 -1
- package/dist/packages/shadcn/src/components/index.js +0 -1
- package/dist/packages/shadcn/src/components/ui/OrContinueWithSeparator.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/OrContinueWithSeparator.js +0 -1
- package/dist/packages/shadcn/src/components/ui/alert-dialog.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/alert-dialog.js +0 -1
- package/dist/packages/shadcn/src/components/ui/alert.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/alert.js +0 -1
- package/dist/packages/shadcn/src/components/ui/avatar.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/avatar.js +0 -1
- package/dist/packages/shadcn/src/components/ui/badge.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/badge.js +0 -1
- package/dist/packages/shadcn/src/components/ui/button.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/button.js +0 -1
- package/dist/packages/shadcn/src/components/ui/calendar.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/calendar.js +0 -1
- package/dist/packages/shadcn/src/components/ui/card.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/card.js +0 -1
- package/dist/packages/shadcn/src/components/ui/checkbox.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/checkbox.js +0 -1
- package/dist/packages/shadcn/src/components/ui/command.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/command.js +0 -1
- package/dist/packages/shadcn/src/components/ui/dialog.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/dialog.js +0 -1
- package/dist/packages/shadcn/src/components/ui/dropdown-menu.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/dropdown-menu.js +0 -1
- package/dist/packages/shadcn/src/components/ui/file-upload.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/file-upload.js +0 -1
- package/dist/packages/shadcn/src/components/ui/form.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/form.js +0 -1
- package/dist/packages/shadcn/src/components/ui/index.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/index.js +0 -1
- package/dist/packages/shadcn/src/components/ui/input.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/input.js +0 -1
- package/dist/packages/shadcn/src/components/ui/label.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/label.js +0 -1
- package/dist/packages/shadcn/src/components/ui/pagination.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/pagination.js +0 -1
- package/dist/packages/shadcn/src/components/ui/popover.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/popover.js +0 -1
- package/dist/packages/shadcn/src/components/ui/radio-group.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/radio-group.js +0 -1
- package/dist/packages/shadcn/src/components/ui/select.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/select.js +0 -1
- package/dist/packages/shadcn/src/components/ui/separator.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/separator.js +0 -1
- package/dist/packages/shadcn/src/components/ui/shadcn-io/tags/index.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/shadcn-io/tags/index.js +0 -1
- package/dist/packages/shadcn/src/components/ui/shadcn-io/tags-input-inline/index.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/shadcn-io/tags-input-inline/index.js +0 -1
- package/dist/packages/shadcn/src/components/ui/sheet.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/sheet.js +0 -1
- package/dist/packages/shadcn/src/components/ui/slider.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/slider.js +0 -1
- package/dist/packages/shadcn/src/components/ui/switch.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/switch.js +0 -1
- package/dist/packages/shadcn/src/components/ui/tabs.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/tabs.js +0 -1
- package/dist/packages/shadcn/src/components/ui/textarea.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/textarea.js +0 -1
- package/dist/packages/shadcn/src/components/ui/tooltip.cjs +0 -1
- package/dist/packages/shadcn/src/components/ui/tooltip.js +0 -1
- package/dist/packages/shadcn/src/lib/index.cjs +0 -1
- package/dist/packages/shadcn/src/lib/index.js +0 -1
|
@@ -1 +1,10 @@
|
|
|
1
|
-
const
|
|
1
|
+
const require_clsx = require('../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.cjs');
|
|
2
|
+
const require_bundle_mjs = require('../../../../node_modules/.pnpm/tailwind-merge@3.4.0/node_modules/tailwind-merge/dist/bundle-mjs.cjs');
|
|
3
|
+
|
|
4
|
+
//#region ../shadcn/src/lib/utils.ts
|
|
5
|
+
function cn(...inputs) {
|
|
6
|
+
return require_bundle_mjs.twMerge(require_clsx.clsx(inputs));
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
//#endregion
|
|
10
|
+
exports.cn = cn;
|
|
@@ -1 +1,10 @@
|
|
|
1
|
-
import{clsx
|
|
1
|
+
import { clsx } from "../../../../node_modules/.pnpm/clsx@2.1.1/node_modules/clsx/dist/clsx.js";
|
|
2
|
+
import { twMerge } from "../../../../node_modules/.pnpm/tailwind-merge@3.4.0/node_modules/tailwind-merge/dist/bundle-mjs.js";
|
|
3
|
+
|
|
4
|
+
//#region ../shadcn/src/lib/utils.ts
|
|
5
|
+
function cn(...inputs) {
|
|
6
|
+
return twMerge(clsx(inputs));
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
//#endregion
|
|
10
|
+
export { cn };
|
|
@@ -1 +1,156 @@
|
|
|
1
|
-
const
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
|
|
2
|
+
let __pixpilot_shadcn = require("@pixpilot/shadcn");
|
|
3
|
+
__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
|
|
4
|
+
let lucide_react = require("lucide-react");
|
|
5
|
+
lucide_react = require_rolldown_runtime.__toESM(lucide_react);
|
|
6
|
+
let react = require("react");
|
|
7
|
+
react = require_rolldown_runtime.__toESM(react);
|
|
8
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
9
|
+
react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
|
|
10
|
+
|
|
11
|
+
//#region src/pagination/Pagination.tsx
|
|
12
|
+
/**
|
|
13
|
+
* Reusable pagination component with configurable page number display.
|
|
14
|
+
*
|
|
15
|
+
* @example
|
|
16
|
+
* // Full variant - default with page numbers
|
|
17
|
+
* <Pagination
|
|
18
|
+
* page={currentPage}
|
|
19
|
+
* totalPages={totalPages}
|
|
20
|
+
* onPageChange={handlePageChange}
|
|
21
|
+
* variant="full"
|
|
22
|
+
* />
|
|
23
|
+
*
|
|
24
|
+
* @example
|
|
25
|
+
* // Compact variant - page indicator with first/prev/next/last buttons
|
|
26
|
+
* <Pagination
|
|
27
|
+
* page={currentPage}
|
|
28
|
+
* totalPages={totalPages}
|
|
29
|
+
* onPageChange={handlePageChange}
|
|
30
|
+
* variant="compact"
|
|
31
|
+
* />
|
|
32
|
+
*
|
|
33
|
+
* @example
|
|
34
|
+
* // Simple variant - only prev/next buttons
|
|
35
|
+
* <Pagination
|
|
36
|
+
* page={currentPage}
|
|
37
|
+
* totalPages={totalPages}
|
|
38
|
+
* onPageChange={handlePageChange}
|
|
39
|
+
* variant="simple"
|
|
40
|
+
* showPageInfo={true}
|
|
41
|
+
* />
|
|
42
|
+
*/
|
|
43
|
+
const Pagination = ({ page, totalPages, onPageChange, maxVisiblePages = 6, variant = "full", showPageInfo = false, className }) => {
|
|
44
|
+
if (totalPages <= 1) return null;
|
|
45
|
+
const handlePageClick = (newPage) => (e) => {
|
|
46
|
+
e.preventDefault();
|
|
47
|
+
onPageChange(e, newPage);
|
|
48
|
+
};
|
|
49
|
+
/**
|
|
50
|
+
* Generate page numbers to show.
|
|
51
|
+
* Always shows exactly maxVisiblePages numbers (or less if totalPages is smaller).
|
|
52
|
+
* Examples with maxVisiblePages=4:
|
|
53
|
+
* - Total 10, Page 1: [1, 2, 3, ellipsis, 10]
|
|
54
|
+
* - Total 10, Page 5: [1, ellipsis, 5, ellipsis, 10]
|
|
55
|
+
* - Total 10, Page 10: [1, ellipsis, 8, 9, 10]
|
|
56
|
+
*/
|
|
57
|
+
const getPageNumbers = () => {
|
|
58
|
+
const pages$1 = [];
|
|
59
|
+
if (totalPages <= maxVisiblePages) {
|
|
60
|
+
for (let i = 1; i <= totalPages; i++) pages$1.push(i);
|
|
61
|
+
return pages$1;
|
|
62
|
+
}
|
|
63
|
+
const firstPage = 1;
|
|
64
|
+
const lastPage = totalPages;
|
|
65
|
+
const reservedSlots = 2;
|
|
66
|
+
const canFitAtStart = page <= maxVisiblePages - 1;
|
|
67
|
+
const canFitAtEnd = page >= totalPages - (maxVisiblePages - reservedSlots);
|
|
68
|
+
if (canFitAtStart) {
|
|
69
|
+
for (let i = 1; i < maxVisiblePages; i++) pages$1.push(i);
|
|
70
|
+
pages$1.push("ellipsis-end");
|
|
71
|
+
pages$1.push(lastPage);
|
|
72
|
+
} else if (canFitAtEnd) {
|
|
73
|
+
pages$1.push(firstPage);
|
|
74
|
+
pages$1.push("ellipsis-start");
|
|
75
|
+
for (let i = totalPages - (maxVisiblePages - reservedSlots); i <= totalPages; i++) pages$1.push(i);
|
|
76
|
+
} else {
|
|
77
|
+
const middleSlots = maxVisiblePages - reservedSlots;
|
|
78
|
+
const halfSlots = 2;
|
|
79
|
+
pages$1.push(firstPage);
|
|
80
|
+
pages$1.push("ellipsis-start");
|
|
81
|
+
let start = page - Math.floor(middleSlots / halfSlots);
|
|
82
|
+
let end = start + middleSlots - 1;
|
|
83
|
+
start = Math.max(firstPage + 1, start);
|
|
84
|
+
end = Math.min(lastPage - 1, end);
|
|
85
|
+
if (end - start + 1 < middleSlots) if (start === firstPage + 1) end = start + middleSlots - 1;
|
|
86
|
+
else start = end - middleSlots + 1;
|
|
87
|
+
for (let i = start; i <= end; i++) pages$1.push(i);
|
|
88
|
+
pages$1.push("ellipsis-end");
|
|
89
|
+
pages$1.push(lastPage);
|
|
90
|
+
}
|
|
91
|
+
return pages$1;
|
|
92
|
+
};
|
|
93
|
+
const pages = getPageNumbers();
|
|
94
|
+
if (variant === "compact") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Pagination, {
|
|
95
|
+
className,
|
|
96
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.PaginationContent, { children: [
|
|
97
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationLink, {
|
|
98
|
+
onClick: handlePageClick(1),
|
|
99
|
+
"aria-label": "Go to first page",
|
|
100
|
+
className: "gap-1 px-2",
|
|
101
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronsLeft, { className: "h-4 w-4" })
|
|
102
|
+
}) }),
|
|
103
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }),
|
|
104
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
105
|
+
className: "flex h-9 items-center justify-center px-4 text-sm font-medium",
|
|
106
|
+
children: [
|
|
107
|
+
page,
|
|
108
|
+
"/",
|
|
109
|
+
totalPages
|
|
110
|
+
]
|
|
111
|
+
}) }),
|
|
112
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) }),
|
|
113
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationLink, {
|
|
114
|
+
onClick: handlePageClick(totalPages),
|
|
115
|
+
"aria-label": "Go to last page",
|
|
116
|
+
className: "gap-1 px-2",
|
|
117
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronsRight, { className: "h-4 w-4" })
|
|
118
|
+
}) })
|
|
119
|
+
] })
|
|
120
|
+
});
|
|
121
|
+
if (variant === "simple") return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
122
|
+
className: `flex items-center justify-center gap-4 ${className ?? ""}`,
|
|
123
|
+
children: [showPageInfo && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
124
|
+
className: "text-sm whitespace-nowrap",
|
|
125
|
+
children: [
|
|
126
|
+
"Page ",
|
|
127
|
+
page,
|
|
128
|
+
" of ",
|
|
129
|
+
totalPages
|
|
130
|
+
]
|
|
131
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Pagination, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.PaginationContent, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) })] }) })]
|
|
132
|
+
});
|
|
133
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
134
|
+
className: `flex items-center justify-center gap-4 ${className ?? ""}`,
|
|
135
|
+
children: [showPageInfo && /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("span", {
|
|
136
|
+
className: "text-sm whitespace-nowrap",
|
|
137
|
+
children: [
|
|
138
|
+
"Page ",
|
|
139
|
+
page,
|
|
140
|
+
" of ",
|
|
141
|
+
totalPages
|
|
142
|
+
]
|
|
143
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Pagination, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.PaginationContent, { children: [
|
|
144
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }),
|
|
145
|
+
pages.map((p) => typeof p === "string" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationEllipsis, {}) }, p) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationLink, {
|
|
146
|
+
onClick: handlePageClick(p),
|
|
147
|
+
isActive: p === page,
|
|
148
|
+
children: p
|
|
149
|
+
}) }, p)),
|
|
150
|
+
/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationItem, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) })
|
|
151
|
+
] }) })]
|
|
152
|
+
});
|
|
153
|
+
};
|
|
154
|
+
|
|
155
|
+
//#endregion
|
|
156
|
+
exports.Pagination = Pagination;
|
|
@@ -1 +1,151 @@
|
|
|
1
|
-
import{Pagination
|
|
1
|
+
import { Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious } from "@pixpilot/shadcn";
|
|
2
|
+
import { ChevronsLeft, ChevronsRight } from "lucide-react";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
|
|
6
|
+
//#region src/pagination/Pagination.tsx
|
|
7
|
+
/**
|
|
8
|
+
* Reusable pagination component with configurable page number display.
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* // Full variant - default with page numbers
|
|
12
|
+
* <Pagination
|
|
13
|
+
* page={currentPage}
|
|
14
|
+
* totalPages={totalPages}
|
|
15
|
+
* onPageChange={handlePageChange}
|
|
16
|
+
* variant="full"
|
|
17
|
+
* />
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* // Compact variant - page indicator with first/prev/next/last buttons
|
|
21
|
+
* <Pagination
|
|
22
|
+
* page={currentPage}
|
|
23
|
+
* totalPages={totalPages}
|
|
24
|
+
* onPageChange={handlePageChange}
|
|
25
|
+
* variant="compact"
|
|
26
|
+
* />
|
|
27
|
+
*
|
|
28
|
+
* @example
|
|
29
|
+
* // Simple variant - only prev/next buttons
|
|
30
|
+
* <Pagination
|
|
31
|
+
* page={currentPage}
|
|
32
|
+
* totalPages={totalPages}
|
|
33
|
+
* onPageChange={handlePageChange}
|
|
34
|
+
* variant="simple"
|
|
35
|
+
* showPageInfo={true}
|
|
36
|
+
* />
|
|
37
|
+
*/
|
|
38
|
+
const Pagination$1 = ({ page, totalPages, onPageChange, maxVisiblePages = 6, variant = "full", showPageInfo = false, className }) => {
|
|
39
|
+
if (totalPages <= 1) return null;
|
|
40
|
+
const handlePageClick = (newPage) => (e) => {
|
|
41
|
+
e.preventDefault();
|
|
42
|
+
onPageChange(e, newPage);
|
|
43
|
+
};
|
|
44
|
+
/**
|
|
45
|
+
* Generate page numbers to show.
|
|
46
|
+
* Always shows exactly maxVisiblePages numbers (or less if totalPages is smaller).
|
|
47
|
+
* Examples with maxVisiblePages=4:
|
|
48
|
+
* - Total 10, Page 1: [1, 2, 3, ellipsis, 10]
|
|
49
|
+
* - Total 10, Page 5: [1, ellipsis, 5, ellipsis, 10]
|
|
50
|
+
* - Total 10, Page 10: [1, ellipsis, 8, 9, 10]
|
|
51
|
+
*/
|
|
52
|
+
const getPageNumbers = () => {
|
|
53
|
+
const pages$1 = [];
|
|
54
|
+
if (totalPages <= maxVisiblePages) {
|
|
55
|
+
for (let i = 1; i <= totalPages; i++) pages$1.push(i);
|
|
56
|
+
return pages$1;
|
|
57
|
+
}
|
|
58
|
+
const firstPage = 1;
|
|
59
|
+
const lastPage = totalPages;
|
|
60
|
+
const reservedSlots = 2;
|
|
61
|
+
const canFitAtStart = page <= maxVisiblePages - 1;
|
|
62
|
+
const canFitAtEnd = page >= totalPages - (maxVisiblePages - reservedSlots);
|
|
63
|
+
if (canFitAtStart) {
|
|
64
|
+
for (let i = 1; i < maxVisiblePages; i++) pages$1.push(i);
|
|
65
|
+
pages$1.push("ellipsis-end");
|
|
66
|
+
pages$1.push(lastPage);
|
|
67
|
+
} else if (canFitAtEnd) {
|
|
68
|
+
pages$1.push(firstPage);
|
|
69
|
+
pages$1.push("ellipsis-start");
|
|
70
|
+
for (let i = totalPages - (maxVisiblePages - reservedSlots); i <= totalPages; i++) pages$1.push(i);
|
|
71
|
+
} else {
|
|
72
|
+
const middleSlots = maxVisiblePages - reservedSlots;
|
|
73
|
+
const halfSlots = 2;
|
|
74
|
+
pages$1.push(firstPage);
|
|
75
|
+
pages$1.push("ellipsis-start");
|
|
76
|
+
let start = page - Math.floor(middleSlots / halfSlots);
|
|
77
|
+
let end = start + middleSlots - 1;
|
|
78
|
+
start = Math.max(firstPage + 1, start);
|
|
79
|
+
end = Math.min(lastPage - 1, end);
|
|
80
|
+
if (end - start + 1 < middleSlots) if (start === firstPage + 1) end = start + middleSlots - 1;
|
|
81
|
+
else start = end - middleSlots + 1;
|
|
82
|
+
for (let i = start; i <= end; i++) pages$1.push(i);
|
|
83
|
+
pages$1.push("ellipsis-end");
|
|
84
|
+
pages$1.push(lastPage);
|
|
85
|
+
}
|
|
86
|
+
return pages$1;
|
|
87
|
+
};
|
|
88
|
+
const pages = getPageNumbers();
|
|
89
|
+
if (variant === "compact") return /* @__PURE__ */ jsx(Pagination, {
|
|
90
|
+
className,
|
|
91
|
+
children: /* @__PURE__ */ jsxs(PaginationContent, { children: [
|
|
92
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationLink, {
|
|
93
|
+
onClick: handlePageClick(1),
|
|
94
|
+
"aria-label": "Go to first page",
|
|
95
|
+
className: "gap-1 px-2",
|
|
96
|
+
children: /* @__PURE__ */ jsx(ChevronsLeft, { className: "h-4 w-4" })
|
|
97
|
+
}) }),
|
|
98
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }),
|
|
99
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsxs("span", {
|
|
100
|
+
className: "flex h-9 items-center justify-center px-4 text-sm font-medium",
|
|
101
|
+
children: [
|
|
102
|
+
page,
|
|
103
|
+
"/",
|
|
104
|
+
totalPages
|
|
105
|
+
]
|
|
106
|
+
}) }),
|
|
107
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) }),
|
|
108
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationLink, {
|
|
109
|
+
onClick: handlePageClick(totalPages),
|
|
110
|
+
"aria-label": "Go to last page",
|
|
111
|
+
className: "gap-1 px-2",
|
|
112
|
+
children: /* @__PURE__ */ jsx(ChevronsRight, { className: "h-4 w-4" })
|
|
113
|
+
}) })
|
|
114
|
+
] })
|
|
115
|
+
});
|
|
116
|
+
if (variant === "simple") return /* @__PURE__ */ jsxs("div", {
|
|
117
|
+
className: `flex items-center justify-center gap-4 ${className ?? ""}`,
|
|
118
|
+
children: [showPageInfo && /* @__PURE__ */ jsxs("span", {
|
|
119
|
+
className: "text-sm whitespace-nowrap",
|
|
120
|
+
children: [
|
|
121
|
+
"Page ",
|
|
122
|
+
page,
|
|
123
|
+
" of ",
|
|
124
|
+
totalPages
|
|
125
|
+
]
|
|
126
|
+
}), /* @__PURE__ */ jsx(Pagination, { children: /* @__PURE__ */ jsxs(PaginationContent, { children: [/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }), /* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) })] }) })]
|
|
127
|
+
});
|
|
128
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
129
|
+
className: `flex items-center justify-center gap-4 ${className ?? ""}`,
|
|
130
|
+
children: [showPageInfo && /* @__PURE__ */ jsxs("span", {
|
|
131
|
+
className: "text-sm whitespace-nowrap",
|
|
132
|
+
children: [
|
|
133
|
+
"Page ",
|
|
134
|
+
page,
|
|
135
|
+
" of ",
|
|
136
|
+
totalPages
|
|
137
|
+
]
|
|
138
|
+
}), /* @__PURE__ */ jsx(Pagination, { children: /* @__PURE__ */ jsxs(PaginationContent, { children: [
|
|
139
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationPrevious, { onClick: handlePageClick(Math.max(1, page - 1)) }) }),
|
|
140
|
+
pages.map((p) => typeof p === "string" ? /* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationEllipsis, {}) }, p) : /* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationLink, {
|
|
141
|
+
onClick: handlePageClick(p),
|
|
142
|
+
isActive: p === page,
|
|
143
|
+
children: p
|
|
144
|
+
}) }, p)),
|
|
145
|
+
/* @__PURE__ */ jsx(PaginationItem, { children: /* @__PURE__ */ jsx(PaginationNext, { onClick: handlePageClick(Math.min(totalPages, page + 1)) }) })
|
|
146
|
+
] }) })]
|
|
147
|
+
});
|
|
148
|
+
};
|
|
149
|
+
|
|
150
|
+
//#endregion
|
|
151
|
+
export { Pagination$1 as Pagination };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const
|
|
1
|
+
const require_Pagination = require('./Pagination.cjs');
|
package/dist/pagination/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Pagination
|
|
1
|
+
import { Pagination } from "./Pagination.js";
|
|
@@ -1 +1,132 @@
|
|
|
1
|
-
const
|
|
1
|
+
const require_rolldown_runtime = require('../_virtual/rolldown_runtime.cjs');
|
|
2
|
+
const require_predefined_toolbar_options = require('./predefined-toolbar-options.cjs');
|
|
3
|
+
let __pixpilot_shadcn = require("@pixpilot/shadcn");
|
|
4
|
+
__pixpilot_shadcn = require_rolldown_runtime.__toESM(__pixpilot_shadcn);
|
|
5
|
+
let react = require("react");
|
|
6
|
+
react = require_rolldown_runtime.__toESM(react);
|
|
7
|
+
let react_jsx_runtime = require("react/jsx-runtime");
|
|
8
|
+
react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);
|
|
9
|
+
let __tiptap_react = require("@tiptap/react");
|
|
10
|
+
__tiptap_react = require_rolldown_runtime.__toESM(__tiptap_react);
|
|
11
|
+
let __tiptap_starter_kit = require("@tiptap/starter-kit");
|
|
12
|
+
__tiptap_starter_kit = require_rolldown_runtime.__toESM(__tiptap_starter_kit);
|
|
13
|
+
|
|
14
|
+
//#region src/rich-text-editor/RichTextEditor.tsx
|
|
15
|
+
const ToolbarButton = ({ onClick, isActive, disabled, children, tooltip }) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(__pixpilot_shadcn.Tooltip, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipTrigger, {
|
|
16
|
+
asChild: true,
|
|
17
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.Button, {
|
|
18
|
+
type: "button",
|
|
19
|
+
variant: isActive ? "default" : "ghost",
|
|
20
|
+
size: "sm",
|
|
21
|
+
onMouseDown: (event) => {
|
|
22
|
+
event.preventDefault();
|
|
23
|
+
},
|
|
24
|
+
onClick,
|
|
25
|
+
disabled,
|
|
26
|
+
className: "h-8 w-8 p-0",
|
|
27
|
+
children
|
|
28
|
+
})
|
|
29
|
+
}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__pixpilot_shadcn.TooltipContent, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", { children: tooltip }) })] });
|
|
30
|
+
const defaultExtensions = [];
|
|
31
|
+
const defaultToolbarOptions = [
|
|
32
|
+
"bold",
|
|
33
|
+
"italic",
|
|
34
|
+
"underline",
|
|
35
|
+
"strike",
|
|
36
|
+
"code",
|
|
37
|
+
"|",
|
|
38
|
+
"heading1",
|
|
39
|
+
"heading2",
|
|
40
|
+
"heading3",
|
|
41
|
+
"|",
|
|
42
|
+
"bulletList",
|
|
43
|
+
"orderedList",
|
|
44
|
+
"|",
|
|
45
|
+
"blockquote",
|
|
46
|
+
"codeBlock"
|
|
47
|
+
];
|
|
48
|
+
const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, editable = true, className, contentClassName, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps }) => {
|
|
49
|
+
const [, forceRender] = react.default.useReducer((x) => x + 1, 0);
|
|
50
|
+
const defaultEditorProps = { attributes: { class: (0, __pixpilot_shadcn.cn)("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:my-2", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:my-2", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:my-2", "[&_p]:my-2", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:my-2", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:my-2", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:my-2 [&_blockquote]:italic", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono", contentClassName) } };
|
|
51
|
+
const mergedEditorProps = {
|
|
52
|
+
...defaultEditorProps,
|
|
53
|
+
...customEditorProps,
|
|
54
|
+
attributes: {
|
|
55
|
+
...defaultEditorProps.attributes,
|
|
56
|
+
...customEditorProps?.attributes,
|
|
57
|
+
class: (0, __pixpilot_shadcn.cn)(defaultEditorProps.attributes.class, (customEditorProps?.attributes)?.class)
|
|
58
|
+
}
|
|
59
|
+
};
|
|
60
|
+
const editorInstance = (0, __tiptap_react.useEditor)({
|
|
61
|
+
extensions: [__tiptap_starter_kit.default].concat(extensions),
|
|
62
|
+
content,
|
|
63
|
+
editable,
|
|
64
|
+
onUpdate: ({ editor: updatedEditor }) => {
|
|
65
|
+
onChange?.(updatedEditor.getHTML());
|
|
66
|
+
},
|
|
67
|
+
editorProps: mergedEditorProps
|
|
68
|
+
});
|
|
69
|
+
react.default.useEffect(() => {
|
|
70
|
+
if (editorInstance == null) return () => {};
|
|
71
|
+
const rerender = () => {
|
|
72
|
+
forceRender();
|
|
73
|
+
};
|
|
74
|
+
editorInstance.on("selectionUpdate", rerender);
|
|
75
|
+
editorInstance.on("transaction", rerender);
|
|
76
|
+
editorInstance.on("focus", rerender);
|
|
77
|
+
editorInstance.on("blur", rerender);
|
|
78
|
+
return () => {
|
|
79
|
+
editorInstance.off("selectionUpdate", rerender);
|
|
80
|
+
editorInstance.off("transaction", rerender);
|
|
81
|
+
editorInstance.off("focus", rerender);
|
|
82
|
+
editorInstance.off("blur", rerender);
|
|
83
|
+
};
|
|
84
|
+
}, [editorInstance]);
|
|
85
|
+
if (editorInstance == null) return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
86
|
+
className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", className),
|
|
87
|
+
children: [showToolbar && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "flex flex-wrap items-center gap-1 border-b p-2 h-10" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
88
|
+
className: "min-h-[200px] p-4 text-sm leading-relaxed",
|
|
89
|
+
children: "Loading editor..."
|
|
90
|
+
})]
|
|
91
|
+
});
|
|
92
|
+
const handleCommand = (commandFn) => {
|
|
93
|
+
try {
|
|
94
|
+
commandFn();
|
|
95
|
+
} catch {}
|
|
96
|
+
};
|
|
97
|
+
const renderToolbar = () => {
|
|
98
|
+
if (!showToolbar) return null;
|
|
99
|
+
const isEditorFocused = editorInstance.isFocused;
|
|
100
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
|
|
101
|
+
className: "flex flex-wrap items-center gap-1 border-b p-2",
|
|
102
|
+
children: toolbarOptions.map((option, index) => {
|
|
103
|
+
if (option === "|") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: "mx-1 h-6 w-px bg-border" }, `separator-${index}`);
|
|
104
|
+
if (typeof option === "string") {
|
|
105
|
+
const predefinedOption = require_predefined_toolbar_options.predefinedToolbarOptions[option];
|
|
106
|
+
if (!predefinedOption) return null;
|
|
107
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
|
|
108
|
+
onClick: () => handleCommand(() => predefinedOption.onClick(editorInstance)),
|
|
109
|
+
isActive: isEditorFocused && (predefinedOption.isActive?.(editorInstance) ?? false),
|
|
110
|
+
tooltip: predefinedOption.tooltip,
|
|
111
|
+
children: predefinedOption.icon
|
|
112
|
+
}, option);
|
|
113
|
+
}
|
|
114
|
+
const customOption = option;
|
|
115
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ToolbarButton, {
|
|
116
|
+
onClick: () => handleCommand(() => customOption.onClick(editorInstance)),
|
|
117
|
+
isActive: isEditorFocused && (customOption.isActive?.(editorInstance) ?? false),
|
|
118
|
+
tooltip: customOption.tooltip,
|
|
119
|
+
children: customOption.icon
|
|
120
|
+
}, `custom-${index}-${customOption.tooltip}`);
|
|
121
|
+
})
|
|
122
|
+
});
|
|
123
|
+
};
|
|
124
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
|
|
125
|
+
className: (0, __pixpilot_shadcn.cn)("border rounded-md bg-background", className),
|
|
126
|
+
children: [renderToolbar(), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(__tiptap_react.EditorContent, { editor: editorInstance })]
|
|
127
|
+
});
|
|
128
|
+
};
|
|
129
|
+
RichTextEditor.displayName = "RichTextEditor";
|
|
130
|
+
|
|
131
|
+
//#endregion
|
|
132
|
+
exports.RichTextEditor = RichTextEditor;
|
|
@@ -1 +1,126 @@
|
|
|
1
|
-
import{predefinedToolbarOptions
|
|
1
|
+
import { predefinedToolbarOptions } from "./predefined-toolbar-options.js";
|
|
2
|
+
import { Button, Tooltip, TooltipContent, TooltipTrigger, cn } from "@pixpilot/shadcn";
|
|
3
|
+
import React from "react";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
import { EditorContent, useEditor } from "@tiptap/react";
|
|
6
|
+
import StarterKit from "@tiptap/starter-kit";
|
|
7
|
+
|
|
8
|
+
//#region src/rich-text-editor/RichTextEditor.tsx
|
|
9
|
+
const ToolbarButton = ({ onClick, isActive, disabled, children, tooltip }) => /* @__PURE__ */ jsxs(Tooltip, { children: [/* @__PURE__ */ jsx(TooltipTrigger, {
|
|
10
|
+
asChild: true,
|
|
11
|
+
children: /* @__PURE__ */ jsx(Button, {
|
|
12
|
+
type: "button",
|
|
13
|
+
variant: isActive ? "default" : "ghost",
|
|
14
|
+
size: "sm",
|
|
15
|
+
onMouseDown: (event) => {
|
|
16
|
+
event.preventDefault();
|
|
17
|
+
},
|
|
18
|
+
onClick,
|
|
19
|
+
disabled,
|
|
20
|
+
className: "h-8 w-8 p-0",
|
|
21
|
+
children
|
|
22
|
+
})
|
|
23
|
+
}), /* @__PURE__ */ jsx(TooltipContent, { children: /* @__PURE__ */ jsx("p", { children: tooltip }) })] });
|
|
24
|
+
const defaultExtensions = [];
|
|
25
|
+
const defaultToolbarOptions = [
|
|
26
|
+
"bold",
|
|
27
|
+
"italic",
|
|
28
|
+
"underline",
|
|
29
|
+
"strike",
|
|
30
|
+
"code",
|
|
31
|
+
"|",
|
|
32
|
+
"heading1",
|
|
33
|
+
"heading2",
|
|
34
|
+
"heading3",
|
|
35
|
+
"|",
|
|
36
|
+
"bulletList",
|
|
37
|
+
"orderedList",
|
|
38
|
+
"|",
|
|
39
|
+
"blockquote",
|
|
40
|
+
"codeBlock"
|
|
41
|
+
];
|
|
42
|
+
const RichTextEditor = ({ content, onChange, extensions = defaultExtensions, editable = true, className, contentClassName, showToolbar = true, toolbarOptions = defaultToolbarOptions, editorProps: customEditorProps }) => {
|
|
43
|
+
const [, forceRender] = React.useReducer((x) => x + 1, 0);
|
|
44
|
+
const defaultEditorProps = { attributes: { class: cn("min-h-[200px] p-4 text-sm leading-relaxed focus:outline-none", "[&_h1]:text-3xl [&_h1]:font-bold [&_h1]:leading-tight [&_h1]:my-2", "[&_h2]:text-2xl [&_h2]:font-bold [&_h2]:leading-tight [&_h2]:my-2", "[&_h3]:text-xl [&_h3]:font-bold [&_h3]:leading-tight [&_h3]:my-2", "[&_p]:my-2", "[&_ul]:list-disc [&_ul]:pl-6 [&_ul]:my-2", "[&_ol]:list-decimal [&_ol]:pl-6 [&_ol]:my-2", "[&_blockquote]:border-l-4 [&_blockquote]:border-border [&_blockquote]:pl-4 [&_blockquote]:my-2 [&_blockquote]:italic", "[&_code]:bg-muted [&_code]:px-1 [&_code]:py-0.5 [&_code]:rounded [&_code]:text-[0.875em] [&_code]:font-mono", "[&_pre]:bg-muted [&_pre]:p-4 [&_pre]:rounded [&_pre]:overflow-x-auto [&_pre]:font-mono", contentClassName) } };
|
|
45
|
+
const mergedEditorProps = {
|
|
46
|
+
...defaultEditorProps,
|
|
47
|
+
...customEditorProps,
|
|
48
|
+
attributes: {
|
|
49
|
+
...defaultEditorProps.attributes,
|
|
50
|
+
...customEditorProps?.attributes,
|
|
51
|
+
class: cn(defaultEditorProps.attributes.class, (customEditorProps?.attributes)?.class)
|
|
52
|
+
}
|
|
53
|
+
};
|
|
54
|
+
const editorInstance = useEditor({
|
|
55
|
+
extensions: [StarterKit].concat(extensions),
|
|
56
|
+
content,
|
|
57
|
+
editable,
|
|
58
|
+
onUpdate: ({ editor: updatedEditor }) => {
|
|
59
|
+
onChange?.(updatedEditor.getHTML());
|
|
60
|
+
},
|
|
61
|
+
editorProps: mergedEditorProps
|
|
62
|
+
});
|
|
63
|
+
React.useEffect(() => {
|
|
64
|
+
if (editorInstance == null) return () => {};
|
|
65
|
+
const rerender = () => {
|
|
66
|
+
forceRender();
|
|
67
|
+
};
|
|
68
|
+
editorInstance.on("selectionUpdate", rerender);
|
|
69
|
+
editorInstance.on("transaction", rerender);
|
|
70
|
+
editorInstance.on("focus", rerender);
|
|
71
|
+
editorInstance.on("blur", rerender);
|
|
72
|
+
return () => {
|
|
73
|
+
editorInstance.off("selectionUpdate", rerender);
|
|
74
|
+
editorInstance.off("transaction", rerender);
|
|
75
|
+
editorInstance.off("focus", rerender);
|
|
76
|
+
editorInstance.off("blur", rerender);
|
|
77
|
+
};
|
|
78
|
+
}, [editorInstance]);
|
|
79
|
+
if (editorInstance == null) return /* @__PURE__ */ jsxs("div", {
|
|
80
|
+
className: cn("border rounded-md bg-background", className),
|
|
81
|
+
children: [showToolbar && /* @__PURE__ */ jsx("div", { className: "flex flex-wrap items-center gap-1 border-b p-2 h-10" }), /* @__PURE__ */ jsx("div", {
|
|
82
|
+
className: "min-h-[200px] p-4 text-sm leading-relaxed",
|
|
83
|
+
children: "Loading editor..."
|
|
84
|
+
})]
|
|
85
|
+
});
|
|
86
|
+
const handleCommand = (commandFn) => {
|
|
87
|
+
try {
|
|
88
|
+
commandFn();
|
|
89
|
+
} catch {}
|
|
90
|
+
};
|
|
91
|
+
const renderToolbar = () => {
|
|
92
|
+
if (!showToolbar) return null;
|
|
93
|
+
const isEditorFocused = editorInstance.isFocused;
|
|
94
|
+
return /* @__PURE__ */ jsx("div", {
|
|
95
|
+
className: "flex flex-wrap items-center gap-1 border-b p-2",
|
|
96
|
+
children: toolbarOptions.map((option, index) => {
|
|
97
|
+
if (option === "|") return /* @__PURE__ */ jsx("div", { className: "mx-1 h-6 w-px bg-border" }, `separator-${index}`);
|
|
98
|
+
if (typeof option === "string") {
|
|
99
|
+
const predefinedOption = predefinedToolbarOptions[option];
|
|
100
|
+
if (!predefinedOption) return null;
|
|
101
|
+
return /* @__PURE__ */ jsx(ToolbarButton, {
|
|
102
|
+
onClick: () => handleCommand(() => predefinedOption.onClick(editorInstance)),
|
|
103
|
+
isActive: isEditorFocused && (predefinedOption.isActive?.(editorInstance) ?? false),
|
|
104
|
+
tooltip: predefinedOption.tooltip,
|
|
105
|
+
children: predefinedOption.icon
|
|
106
|
+
}, option);
|
|
107
|
+
}
|
|
108
|
+
const customOption = option;
|
|
109
|
+
return /* @__PURE__ */ jsx(ToolbarButton, {
|
|
110
|
+
onClick: () => handleCommand(() => customOption.onClick(editorInstance)),
|
|
111
|
+
isActive: isEditorFocused && (customOption.isActive?.(editorInstance) ?? false),
|
|
112
|
+
tooltip: customOption.tooltip,
|
|
113
|
+
children: customOption.icon
|
|
114
|
+
}, `custom-${index}-${customOption.tooltip}`);
|
|
115
|
+
})
|
|
116
|
+
});
|
|
117
|
+
};
|
|
118
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
119
|
+
className: cn("border rounded-md bg-background", className),
|
|
120
|
+
children: [renderToolbar(), /* @__PURE__ */ jsx(EditorContent, { editor: editorInstance })]
|
|
121
|
+
});
|
|
122
|
+
};
|
|
123
|
+
RichTextEditor.displayName = "RichTextEditor";
|
|
124
|
+
|
|
125
|
+
//#endregion
|
|
126
|
+
export { RichTextEditor };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
const
|
|
1
|
+
const require_RichTextEditor = require('./RichTextEditor.cjs');
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{RichTextEditor
|
|
1
|
+
import { RichTextEditor } from "./RichTextEditor.js";
|