@mamrp/components 1.0.35 → 1.0.36

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 (19) hide show
  1. package/dist/charts/index.d.mts +0 -0
  2. package/dist/charts/index.d.ts +0 -0
  3. package/dist/charts/index.js +0 -0
  4. package/dist/charts/index.js.map +1 -1
  5. package/dist/charts/index.mjs +0 -0
  6. package/dist/charts/index.mjs.map +1 -1
  7. package/dist/index.d.mts +0 -0
  8. package/dist/index.d.ts +0 -0
  9. package/dist/index.js +0 -0
  10. package/dist/index.js.map +0 -0
  11. package/dist/index.mjs +0 -0
  12. package/dist/index.mjs.map +0 -0
  13. package/dist/selectors/index.d.mts +0 -0
  14. package/dist/selectors/index.d.ts +0 -0
  15. package/dist/selectors/index.js +0 -0
  16. package/dist/selectors/index.js.map +1 -1
  17. package/dist/selectors/index.mjs +0 -0
  18. package/dist/selectors/index.mjs.map +1 -1
  19. package/package.json +3 -3
package/dist/charts/index.d.mts CHANGED
File without changes
package/dist/charts/index.d.ts CHANGED
File without changes
package/dist/charts/index.js CHANGED
File without changes
package/dist/charts/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/charts/index.ts","../../react-shim.js","../../src/charts/bar/index.tsx","../../src/charts/pie/index.tsx"],"sourcesContent":["export { default as BarChart } from \"./bar\";\nexport { default as PieChart } from \"./pie\";\n","import * as React from \"react\";\nexport { React };\n","import { Chart } from \"react-chartjs-2\";\r\nimport {\r\n Chart as ChartJS,\r\n BarElement,\r\n LineElement,\r\n PointElement,\r\n CategoryScale,\r\n LinearScale,\r\n Tooltip,\r\n Legend,\r\n Chart as ChartType,\r\n} from \"chart.js\";\r\nimport { Box } from \"@mui/material\";\r\n\r\nChartJS.register(\r\n BarElement,\r\n LineElement,\r\n PointElement,\r\n CategoryScale,\r\n LinearScale,\r\n Tooltip,\r\n Legend\r\n);\r\n\r\ninterface Props {\r\n labels: string[];\r\n datasets: {\r\n label: string;\r\n data: number[];\r\n backgroundColor: string;\r\n borderColor?: string;\r\n borderWidth?: number;\r\n type?: \"line\";\r\n order?: number;\r\n tension?: number;\r\n pointRadius?: number;\r\n fill?: boolean;\r\n }[];\r\n height?: number;\r\n}\r\n/**\r\n * 📊 BarChart — کامپوننت نمودار میله‌ای (Bar/Combo)\r\n *\r\n * @component BarChart\r\n *\r\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای محور افقی (X).\r\n * @param {Array<{\r\n * label: string,\r\n * data: number[],\r\n * backgroundColor: string,\r\n * borderColor?: string,\r\n * borderWidth?: number,\r\n * type?: \"line\",\r\n * order?: number,\r\n * tension?: number,\r\n * pointRadius?: number,\r\n * fill?: boolean\r\n * }>} datasets - آرایه‌ای از آبجکت‌های داده برای هر سری نمودار.\r\n * - label: عنوان داده‌ها (نمایش در legend)\r\n * - data: آرایه‌ای از مقادیر هر سری\r\n * - backgroundColor: رنگ میله یا خط\r\n * - borderColor: (اختیاری) رنگ خط دور میله یا خط\r\n * - borderWidth: (اختیاری) ضخامت خط دور میله یا خط\r\n * - type: (اختیاری) اگر \"line\" باشد، سری به صورت خطی نمایش داده می‌شود (نمودار ترکیبی)\r\n * - order: (اختیاری) ترتیب رسم سری (سری با order بالاتر روی بقیه قرار می‌گیرد)\r\n * - tension: (اختیاری) میزان خمیدگی خط (برای سری‌های خطی)\r\n * - pointRadius: (اختیاری) شعاع نقاط روی خط (برای سری‌های خطی)\r\n * - fill: (اختیاری) پر شدن زیر خط (برای سری‌های خطی)\r\n *\r\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\r\n *\r\n * @description\r\n * این کامپوننت یک نمودار میله‌ای (Bar) یا ترکیبی Bar/Line با قابلیت شخصی‌سازی کامل است.\r\n * - پشتیبانی از فونت وزیر و راست‌چین\r\n * - ریسپانسیو و مناسب صفحات فارسی\r\n * - امکان نمایش چند سری داده به صورت میله‌ای و خطی همزمان (Combo)\r\n * - شخصی‌سازی رنگ، ضخامت، ترتیب و استایل هر سری\r\n *\r\n * @returns {JSX.Element} یک نمودار میله‌ای یا ترکیبی با داده‌های ورودی\r\n *\r\n * @example\r\n * ```jsx\r\n * <BarChart\r\n * labels={[\"شنبه\", \"یکشنبه\", \"دوشنبه\"]}\r\n * datasets={[\r\n * {\r\n * label: \"فروش\",\r\n * data: [10, 20, 15],\r\n * backgroundColor: \"rgba(75,192,192,0.7)\",\r\n * },\r\n * {\r\n * label: \"میانگین\",\r\n * data: [12, 18, 14],\r\n * borderColor: \"red\",\r\n * backgroundColor: \"transparent\",\r\n * type: \"line\",\r\n * order: 0,\r\n * borderWidth: 3,\r\n * tension: 0.4,\r\n * pointRadius: 4,\r\n * fill: false,\r\n * },\r\n * ]}\r\n * height={400}\r\n * />\r\n * ```\r\n */\r\nexport default function BarChart({ labels, datasets, height }: Props) {\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n ticks: {\r\n font: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 14,\r\n },\r\n },\r\n },\r\n x: {\r\n ticks: {\r\n autoSkip: false,\r\n font: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 13,\r\n },\r\n },\r\n },\r\n },\r\n plugins: {\r\n tooltip: {\r\n bodyFont: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 14,\r\n },\r\n titleFont: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 16,\r\n },\r\n },\r\n legend: {\r\n labels: {\r\n generateLabels: function (chart: ChartType) {\r\n const labels =\r\n ChartJS.defaults.plugins.legend.labels.generateLabels(chart);\r\n return labels.map((label) => ({\r\n ...label,\r\n text: \" \" + label.text + \" \",\r\n boxWidth: 40,\r\n boxHeight: 20,\r\n }));\r\n },\r\n padding: 15,\r\n usePointStyle: true,\r\n font: {\r\n size: 16,\r\n family: \"'Vazir', sans-serif\",\r\n },\r\n boxWidth: 40,\r\n paddingBottom: 10,\r\n },\r\n },\r\n },\r\n };\r\n\r\n return (\r\n <Box height={height ?? 600}>\r\n <Chart type=\"bar\" data={{ labels, datasets }} options={options} />\r\n </Box>\r\n );\r\n}\r\n","import { Pie } from \"react-chartjs-2\";\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend, Chart } from \"chart.js\";\nimport { useMemo } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Image from \"next/image\";\nChartJS.register(ArcElement, Tooltip, Legend);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string | string[];\n borderWidth?: number;\n }[];\n height?: number;\n disableLogo?: boolean;\n logoSRC?: string;\n}\n/**\n * 📊 PieChart — کامپوننت نمودار دایره‌ای (Pie)\n *\n * @component PieChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای هر بخش نمودار.\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string[],\n * borderWidth?: number\n * }>} datasets - آرایه‌ای شامل یک آبجکت داده برای مقداردهی بخش‌های نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر بخش\n * - backgroundColor: آرایه‌ای از رنگ‌ها برای هر بخش\n * - borderWidth: (اختیاری) ضخامت خط دور هر بخش\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار دایره‌ای با قابلیت شخصی‌سازی رنگ، داده و فونت (هماهنگ با وزیر) است.\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش لوگو یا کامپوننت دلخواه در مرکز نمودار\n *\n * @returns {JSX.Element} یک نمودار دایره‌ای با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <PieChart\n * labels={[\"بخش اول\", \"بخش دوم\", \"بخش سوم\"]}\n * datasets={[\n * {\n * label: \"مقدار\",\n * data: [10, 20, 30],\n * backgroundColor: [\n * \"rgba(75,192,192,1)\",\n * \"rgba(255,99,132,1)\",\n * \"rgba(153,102,255,1)\",\n * ],\n * borderWidth: 2,\n * },\n * ]}\n * />\n * ```\n */\nexport default function PieChart({ labels, datasets, height , disableLogo,logoSRC }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n cutout: !disableLogo ? \"59%\" : \"0%\",\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n // کامپوننتی که می‌خواهید در مرکز نمودار نمایش داده شود\n const CenterComponent = () => {\n return (\n <div\n style={{\n padding: \"10px\",\n borderRadius: \"8px\",\n textAlign: \"center\",\n width: 220,\n }}\n >\n <Image alt=\"\" width={220} height={220} src={logoSRC ?? \"/assets/images/pilogo.png\"} unoptimized/>\n </div>\n );\n };\n\n return (\n <Box height={height ?? 600} sx={{ position: \"relative\" }}>\n <Pie\n data={{\n labels: labels,\n datasets: datasets,\n }}\n options={options}\n />\n {!disableLogo && <div\n style={{\n position: \"absolute\",\n top: \"53%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n pointerEvents: \"none\", // جلوگیری از دریافت event روی این لایه\n }}\n >\n <CenterComponent />\n </div>}\n </Box>\n );\n}\n"],"mappings":"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","names":["ChartJS","labels","import_react_chartjs_2","import_chart","import_material","ChartJS","Image"]}
1
+ {"version":3,"sources":["../../src/charts/index.ts","../../react-shim.js","../../src/charts/bar/index.tsx","../../src/charts/pie/index.tsx"],"sourcesContent":["export { default as BarChart } from \"./bar\";\nexport { default as PieChart } from \"./pie\";\n","import * as React from \"react\";\nexport { React };\n","import { Chart } from \"react-chartjs-2\";\nimport {\n Chart as ChartJS,\n BarElement,\n LineElement,\n PointElement,\n CategoryScale,\n LinearScale,\n Tooltip,\n Legend,\n Chart as ChartType,\n} from \"chart.js\";\nimport { Box } from \"@mui/material\";\n\nChartJS.register(\n BarElement,\n LineElement,\n PointElement,\n CategoryScale,\n LinearScale,\n Tooltip,\n Legend\n);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string;\n borderColor?: string;\n borderWidth?: number;\n type?: \"line\";\n order?: number;\n tension?: number;\n pointRadius?: number;\n fill?: boolean;\n }[];\n height?: number;\n}\n/**\n * 📊 BarChart — کامپوننت نمودار میله‌ای (Bar/Combo)\n *\n * @component BarChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای محور افقی (X).\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string,\n * borderColor?: string,\n * borderWidth?: number,\n * type?: \"line\",\n * order?: number,\n * tension?: number,\n * pointRadius?: number,\n * fill?: boolean\n * }>} datasets - آرایه‌ای از آبجکت‌های داده برای هر سری نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر سری\n * - backgroundColor: رنگ میله یا خط\n * - borderColor: (اختیاری) رنگ خط دور میله یا خط\n * - borderWidth: (اختیاری) ضخامت خط دور میله یا خط\n * - type: (اختیاری) اگر \"line\" باشد، سری به صورت خطی نمایش داده می‌شود (نمودار ترکیبی)\n * - order: (اختیاری) ترتیب رسم سری (سری با order بالاتر روی بقیه قرار می‌گیرد)\n * - tension: (اختیاری) میزان خمیدگی خط (برای سری‌های خطی)\n * - pointRadius: (اختیاری) شعاع نقاط روی خط (برای سری‌های خطی)\n * - fill: (اختیاری) پر شدن زیر خط (برای سری‌های خطی)\n *\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار میله‌ای (Bar) یا ترکیبی Bar/Line با قابلیت شخصی‌سازی کامل است.\n * - پشتیبانی از فونت وزیر و راست‌چین\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش چند سری داده به صورت میله‌ای و خطی همزمان (Combo)\n * - شخصی‌سازی رنگ، ضخامت، ترتیب و استایل هر سری\n *\n * @returns {JSX.Element} یک نمودار میله‌ای یا ترکیبی با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <BarChart\n * labels={[\"شنبه\", \"یکشنبه\", \"دوشنبه\"]}\n * datasets={[\n * {\n * label: \"فروش\",\n * data: [10, 20, 15],\n * backgroundColor: \"rgba(75,192,192,0.7)\",\n * },\n * {\n * label: \"میانگین\",\n * data: [12, 18, 14],\n * borderColor: \"red\",\n * backgroundColor: \"transparent\",\n * type: \"line\",\n * order: 0,\n * borderWidth: 3,\n * tension: 0.4,\n * pointRadius: 4,\n * fill: false,\n * },\n * ]}\n * height={400}\n * />\n * ```\n */\nexport default function BarChart({ labels, datasets, height }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n ticks: {\n font: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n },\n },\n x: {\n ticks: {\n autoSkip: false,\n font: {\n family: \"'Vazir', sans-serif\",\n size: 13,\n },\n },\n },\n },\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n generateLabels: function (chart: ChartType) {\n const labels =\n ChartJS.defaults.plugins.legend.labels.generateLabels(chart);\n return labels.map((label) => ({\n ...label,\n text: \" \" + label.text + \" \",\n boxWidth: 40,\n boxHeight: 20,\n }));\n },\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n return (\n <Box height={height ?? 600}>\n <Chart type=\"bar\" data={{ labels, datasets }} options={options} />\n </Box>\n );\n}\n","import { Pie } from \"react-chartjs-2\";\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend, Chart } from \"chart.js\";\nimport { useMemo } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Image from \"next/image\";\nChartJS.register(ArcElement, Tooltip, Legend);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string | string[];\n borderWidth?: number;\n }[];\n height?: number;\n disableLogo?: boolean;\n logoSRC?: string;\n}\n/**\n * 📊 PieChart — کامپوننت نمودار دایره‌ای (Pie)\n *\n * @component PieChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای هر بخش نمودار.\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string[],\n * borderWidth?: number\n * }>} datasets - آرایه‌ای شامل یک آبجکت داده برای مقداردهی بخش‌های نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر بخش\n * - backgroundColor: آرایه‌ای از رنگ‌ها برای هر بخش\n * - borderWidth: (اختیاری) ضخامت خط دور هر بخش\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار دایره‌ای با قابلیت شخصی‌سازی رنگ، داده و فونت (هماهنگ با وزیر) است.\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش لوگو یا کامپوننت دلخواه در مرکز نمودار\n *\n * @returns {JSX.Element} یک نمودار دایره‌ای با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <PieChart\n * labels={[\"بخش اول\", \"بخش دوم\", \"بخش سوم\"]}\n * datasets={[\n * {\n * label: \"مقدار\",\n * data: [10, 20, 30],\n * backgroundColor: [\n * \"rgba(75,192,192,1)\",\n * \"rgba(255,99,132,1)\",\n * \"rgba(153,102,255,1)\",\n * ],\n * borderWidth: 2,\n * },\n * ]}\n * />\n * ```\n */\nexport default function PieChart({ labels, datasets, height , disableLogo,logoSRC }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n cutout: !disableLogo ? \"59%\" : \"0%\",\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n // کامپوننتی که می‌خواهید در مرکز نمودار نمایش داده شود\n const CenterComponent = () => {\n return (\n <div\n style={{\n padding: \"10px\",\n borderRadius: \"8px\",\n textAlign: \"center\",\n width: 220,\n }}\n >\n <Image alt=\"\" width={220} height={220} src={logoSRC ?? \"/assets/images/pilogo.png\"} unoptimized/>\n </div>\n );\n };\n\n return (\n <Box height={height ?? 600} sx={{ position: \"relative\" }}>\n <Pie\n data={{\n labels: labels,\n datasets: datasets,\n }}\n options={options}\n />\n {!disableLogo && <div\n style={{\n position: \"absolute\",\n top: \"53%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n pointerEvents: \"none\", // جلوگیری از دریافت event روی این لایه\n }}\n >\n <CenterComponent />\n </div>}\n </Box>\n );\n}\n"],"mappings":"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","names":["ChartJS","labels","import_react_chartjs_2","import_chart","import_material","ChartJS","Image"]}
package/dist/charts/index.mjs CHANGED
File without changes
package/dist/charts/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../react-shim.js","../../src/charts/bar/index.tsx","../../src/charts/pie/index.tsx"],"sourcesContent":["import * as React from \"react\";\nexport { React };\n","import { Chart } from \"react-chartjs-2\";\r\nimport {\r\n Chart as ChartJS,\r\n BarElement,\r\n LineElement,\r\n PointElement,\r\n CategoryScale,\r\n LinearScale,\r\n Tooltip,\r\n Legend,\r\n Chart as ChartType,\r\n} from \"chart.js\";\r\nimport { Box } from \"@mui/material\";\r\n\r\nChartJS.register(\r\n BarElement,\r\n LineElement,\r\n PointElement,\r\n CategoryScale,\r\n LinearScale,\r\n Tooltip,\r\n Legend\r\n);\r\n\r\ninterface Props {\r\n labels: string[];\r\n datasets: {\r\n label: string;\r\n data: number[];\r\n backgroundColor: string;\r\n borderColor?: string;\r\n borderWidth?: number;\r\n type?: \"line\";\r\n order?: number;\r\n tension?: number;\r\n pointRadius?: number;\r\n fill?: boolean;\r\n }[];\r\n height?: number;\r\n}\r\n/**\r\n * 📊 BarChart — کامپوننت نمودار میله‌ای (Bar/Combo)\r\n *\r\n * @component BarChart\r\n *\r\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای محور افقی (X).\r\n * @param {Array<{\r\n * label: string,\r\n * data: number[],\r\n * backgroundColor: string,\r\n * borderColor?: string,\r\n * borderWidth?: number,\r\n * type?: \"line\",\r\n * order?: number,\r\n * tension?: number,\r\n * pointRadius?: number,\r\n * fill?: boolean\r\n * }>} datasets - آرایه‌ای از آبجکت‌های داده برای هر سری نمودار.\r\n * - label: عنوان داده‌ها (نمایش در legend)\r\n * - data: آرایه‌ای از مقادیر هر سری\r\n * - backgroundColor: رنگ میله یا خط\r\n * - borderColor: (اختیاری) رنگ خط دور میله یا خط\r\n * - borderWidth: (اختیاری) ضخامت خط دور میله یا خط\r\n * - type: (اختیاری) اگر \"line\" باشد، سری به صورت خطی نمایش داده می‌شود (نمودار ترکیبی)\r\n * - order: (اختیاری) ترتیب رسم سری (سری با order بالاتر روی بقیه قرار می‌گیرد)\r\n * - tension: (اختیاری) میزان خمیدگی خط (برای سری‌های خطی)\r\n * - pointRadius: (اختیاری) شعاع نقاط روی خط (برای سری‌های خطی)\r\n * - fill: (اختیاری) پر شدن زیر خط (برای سری‌های خطی)\r\n *\r\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\r\n *\r\n * @description\r\n * این کامپوننت یک نمودار میله‌ای (Bar) یا ترکیبی Bar/Line با قابلیت شخصی‌سازی کامل است.\r\n * - پشتیبانی از فونت وزیر و راست‌چین\r\n * - ریسپانسیو و مناسب صفحات فارسی\r\n * - امکان نمایش چند سری داده به صورت میله‌ای و خطی همزمان (Combo)\r\n * - شخصی‌سازی رنگ، ضخامت، ترتیب و استایل هر سری\r\n *\r\n * @returns {JSX.Element} یک نمودار میله‌ای یا ترکیبی با داده‌های ورودی\r\n *\r\n * @example\r\n * ```jsx\r\n * <BarChart\r\n * labels={[\"شنبه\", \"یکشنبه\", \"دوشنبه\"]}\r\n * datasets={[\r\n * {\r\n * label: \"فروش\",\r\n * data: [10, 20, 15],\r\n * backgroundColor: \"rgba(75,192,192,0.7)\",\r\n * },\r\n * {\r\n * label: \"میانگین\",\r\n * data: [12, 18, 14],\r\n * borderColor: \"red\",\r\n * backgroundColor: \"transparent\",\r\n * type: \"line\",\r\n * order: 0,\r\n * borderWidth: 3,\r\n * tension: 0.4,\r\n * pointRadius: 4,\r\n * fill: false,\r\n * },\r\n * ]}\r\n * height={400}\r\n * />\r\n * ```\r\n */\r\nexport default function BarChart({ labels, datasets, height }: Props) {\r\n const options = {\r\n responsive: true,\r\n maintainAspectRatio: false,\r\n scales: {\r\n y: {\r\n ticks: {\r\n font: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 14,\r\n },\r\n },\r\n },\r\n x: {\r\n ticks: {\r\n autoSkip: false,\r\n font: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 13,\r\n },\r\n },\r\n },\r\n },\r\n plugins: {\r\n tooltip: {\r\n bodyFont: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 14,\r\n },\r\n titleFont: {\r\n family: \"'Vazir', sans-serif\",\r\n size: 16,\r\n },\r\n },\r\n legend: {\r\n labels: {\r\n generateLabels: function (chart: ChartType) {\r\n const labels =\r\n ChartJS.defaults.plugins.legend.labels.generateLabels(chart);\r\n return labels.map((label) => ({\r\n ...label,\r\n text: \" \" + label.text + \" \",\r\n boxWidth: 40,\r\n boxHeight: 20,\r\n }));\r\n },\r\n padding: 15,\r\n usePointStyle: true,\r\n font: {\r\n size: 16,\r\n family: \"'Vazir', sans-serif\",\r\n },\r\n boxWidth: 40,\r\n paddingBottom: 10,\r\n },\r\n },\r\n },\r\n };\r\n\r\n return (\r\n <Box height={height ?? 600}>\r\n <Chart type=\"bar\" data={{ labels, datasets }} options={options} />\r\n </Box>\r\n );\r\n}\r\n","import { Pie } from \"react-chartjs-2\";\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend, Chart } from \"chart.js\";\nimport { useMemo } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Image from \"next/image\";\nChartJS.register(ArcElement, Tooltip, Legend);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string | string[];\n borderWidth?: number;\n }[];\n height?: number;\n disableLogo?: boolean;\n logoSRC?: string;\n}\n/**\n * 📊 PieChart — کامپوننت نمودار دایره‌ای (Pie)\n *\n * @component PieChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای هر بخش نمودار.\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string[],\n * borderWidth?: number\n * }>} datasets - آرایه‌ای شامل یک آبجکت داده برای مقداردهی بخش‌های نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر بخش\n * - backgroundColor: آرایه‌ای از رنگ‌ها برای هر بخش\n * - borderWidth: (اختیاری) ضخامت خط دور هر بخش\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار دایره‌ای با قابلیت شخصی‌سازی رنگ، داده و فونت (هماهنگ با وزیر) است.\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش لوگو یا کامپوننت دلخواه در مرکز نمودار\n *\n * @returns {JSX.Element} یک نمودار دایره‌ای با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <PieChart\n * labels={[\"بخش اول\", \"بخش دوم\", \"بخش سوم\"]}\n * datasets={[\n * {\n * label: \"مقدار\",\n * data: [10, 20, 30],\n * backgroundColor: [\n * \"rgba(75,192,192,1)\",\n * \"rgba(255,99,132,1)\",\n * \"rgba(153,102,255,1)\",\n * ],\n * borderWidth: 2,\n * },\n * ]}\n * />\n * ```\n */\nexport default function PieChart({ labels, datasets, height , disableLogo,logoSRC }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n cutout: !disableLogo ? \"59%\" : \"0%\",\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n // کامپوننتی که می‌خواهید در مرکز نمودار نمایش داده شود\n const CenterComponent = () => {\n return (\n <div\n style={{\n padding: \"10px\",\n borderRadius: \"8px\",\n textAlign: \"center\",\n width: 220,\n }}\n >\n <Image alt=\"\" width={220} height={220} src={logoSRC ?? \"/assets/images/pilogo.png\"} unoptimized/>\n </div>\n );\n };\n\n return (\n <Box height={height ?? 600} sx={{ position: \"relative\" }}>\n <Pie\n data={{\n labels: labels,\n datasets: datasets,\n }}\n options={options}\n />\n {!disableLogo && <div\n style={{\n position: \"absolute\",\n top: \"53%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n pointerEvents: \"none\", // جلوگیری از دریافت event روی این لایه\n }}\n >\n <CenterComponent />\n </div>}\n </Box>\n );\n}\n"],"mappings":"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","names":["labels","ChartJS","Tooltip","Legend","Box"]}
1
+ {"version":3,"sources":["../../react-shim.js","../../src/charts/bar/index.tsx","../../src/charts/pie/index.tsx"],"sourcesContent":["import * as React from \"react\";\nexport { React };\n","import { Chart } from \"react-chartjs-2\";\nimport {\n Chart as ChartJS,\n BarElement,\n LineElement,\n PointElement,\n CategoryScale,\n LinearScale,\n Tooltip,\n Legend,\n Chart as ChartType,\n} from \"chart.js\";\nimport { Box } from \"@mui/material\";\n\nChartJS.register(\n BarElement,\n LineElement,\n PointElement,\n CategoryScale,\n LinearScale,\n Tooltip,\n Legend\n);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string;\n borderColor?: string;\n borderWidth?: number;\n type?: \"line\";\n order?: number;\n tension?: number;\n pointRadius?: number;\n fill?: boolean;\n }[];\n height?: number;\n}\n/**\n * 📊 BarChart — کامپوننت نمودار میله‌ای (Bar/Combo)\n *\n * @component BarChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای محور افقی (X).\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string,\n * borderColor?: string,\n * borderWidth?: number,\n * type?: \"line\",\n * order?: number,\n * tension?: number,\n * pointRadius?: number,\n * fill?: boolean\n * }>} datasets - آرایه‌ای از آبجکت‌های داده برای هر سری نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر سری\n * - backgroundColor: رنگ میله یا خط\n * - borderColor: (اختیاری) رنگ خط دور میله یا خط\n * - borderWidth: (اختیاری) ضخامت خط دور میله یا خط\n * - type: (اختیاری) اگر \"line\" باشد، سری به صورت خطی نمایش داده می‌شود (نمودار ترکیبی)\n * - order: (اختیاری) ترتیب رسم سری (سری با order بالاتر روی بقیه قرار می‌گیرد)\n * - tension: (اختیاری) میزان خمیدگی خط (برای سری‌های خطی)\n * - pointRadius: (اختیاری) شعاع نقاط روی خط (برای سری‌های خطی)\n * - fill: (اختیاری) پر شدن زیر خط (برای سری‌های خطی)\n *\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار میله‌ای (Bar) یا ترکیبی Bar/Line با قابلیت شخصی‌سازی کامل است.\n * - پشتیبانی از فونت وزیر و راست‌چین\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش چند سری داده به صورت میله‌ای و خطی همزمان (Combo)\n * - شخصی‌سازی رنگ، ضخامت، ترتیب و استایل هر سری\n *\n * @returns {JSX.Element} یک نمودار میله‌ای یا ترکیبی با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <BarChart\n * labels={[\"شنبه\", \"یکشنبه\", \"دوشنبه\"]}\n * datasets={[\n * {\n * label: \"فروش\",\n * data: [10, 20, 15],\n * backgroundColor: \"rgba(75,192,192,0.7)\",\n * },\n * {\n * label: \"میانگین\",\n * data: [12, 18, 14],\n * borderColor: \"red\",\n * backgroundColor: \"transparent\",\n * type: \"line\",\n * order: 0,\n * borderWidth: 3,\n * tension: 0.4,\n * pointRadius: 4,\n * fill: false,\n * },\n * ]}\n * height={400}\n * />\n * ```\n */\nexport default function BarChart({ labels, datasets, height }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n scales: {\n y: {\n ticks: {\n font: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n },\n },\n x: {\n ticks: {\n autoSkip: false,\n font: {\n family: \"'Vazir', sans-serif\",\n size: 13,\n },\n },\n },\n },\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n generateLabels: function (chart: ChartType) {\n const labels =\n ChartJS.defaults.plugins.legend.labels.generateLabels(chart);\n return labels.map((label) => ({\n ...label,\n text: \" \" + label.text + \" \",\n boxWidth: 40,\n boxHeight: 20,\n }));\n },\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n return (\n <Box height={height ?? 600}>\n <Chart type=\"bar\" data={{ labels, datasets }} options={options} />\n </Box>\n );\n}\n","import { Pie } from \"react-chartjs-2\";\nimport { Chart as ChartJS, ArcElement, Tooltip, Legend, Chart } from \"chart.js\";\nimport { useMemo } from \"react\";\nimport { Box } from \"@mui/material\";\nimport Image from \"next/image\";\nChartJS.register(ArcElement, Tooltip, Legend);\n\ninterface Props {\n labels: string[];\n datasets: {\n label: string;\n data: number[];\n backgroundColor: string | string[];\n borderWidth?: number;\n }[];\n height?: number;\n disableLogo?: boolean;\n logoSRC?: string;\n}\n/**\n * 📊 PieChart — کامپوننت نمودار دایره‌ای (Pie)\n *\n * @component PieChart\n *\n * @param {string[]} labels - آرایه‌ای از برچسب‌ها برای هر بخش نمودار.\n * @param {Array<{\n * label: string,\n * data: number[],\n * backgroundColor: string[],\n * borderWidth?: number\n * }>} datasets - آرایه‌ای شامل یک آبجکت داده برای مقداردهی بخش‌های نمودار.\n * - label: عنوان داده‌ها (نمایش در legend)\n * - data: آرایه‌ای از مقادیر هر بخش\n * - backgroundColor: آرایه‌ای از رنگ‌ها برای هر بخش\n * - borderWidth: (اختیاری) ضخامت خط دور هر بخش\n * @param {number} [height] - ارتفاع نمودار (پیش‌فرض: 600 پیکسل)\n *\n * @description\n * این کامپوننت یک نمودار دایره‌ای با قابلیت شخصی‌سازی رنگ، داده و فونت (هماهنگ با وزیر) است.\n * - ریسپانسیو و مناسب صفحات فارسی\n * - امکان نمایش لوگو یا کامپوننت دلخواه در مرکز نمودار\n *\n * @returns {JSX.Element} یک نمودار دایره‌ای با داده‌های ورودی\n *\n * @example\n * ```jsx\n * <PieChart\n * labels={[\"بخش اول\", \"بخش دوم\", \"بخش سوم\"]}\n * datasets={[\n * {\n * label: \"مقدار\",\n * data: [10, 20, 30],\n * backgroundColor: [\n * \"rgba(75,192,192,1)\",\n * \"rgba(255,99,132,1)\",\n * \"rgba(153,102,255,1)\",\n * ],\n * borderWidth: 2,\n * },\n * ]}\n * />\n * ```\n */\nexport default function PieChart({ labels, datasets, height , disableLogo,logoSRC }: Props) {\n const options = {\n responsive: true,\n maintainAspectRatio: false,\n cutout: !disableLogo ? \"59%\" : \"0%\",\n plugins: {\n tooltip: {\n bodyFont: {\n family: \"'Vazir', sans-serif\",\n size: 14,\n },\n titleFont: {\n family: \"'Vazir', sans-serif\",\n size: 16,\n },\n },\n legend: {\n labels: {\n padding: 15,\n usePointStyle: true,\n font: {\n size: 16,\n family: \"'Vazir', sans-serif\",\n },\n boxWidth: 40,\n paddingBottom: 10,\n },\n },\n },\n };\n\n // کامپوننتی که می‌خواهید در مرکز نمودار نمایش داده شود\n const CenterComponent = () => {\n return (\n <div\n style={{\n padding: \"10px\",\n borderRadius: \"8px\",\n textAlign: \"center\",\n width: 220,\n }}\n >\n <Image alt=\"\" width={220} height={220} src={logoSRC ?? \"/assets/images/pilogo.png\"} unoptimized/>\n </div>\n );\n };\n\n return (\n <Box height={height ?? 600} sx={{ position: \"relative\" }}>\n <Pie\n data={{\n labels: labels,\n datasets: datasets,\n }}\n options={options}\n />\n {!disableLogo && <div\n style={{\n position: \"absolute\",\n top: \"53%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n pointerEvents: \"none\", // جلوگیری از دریافت event روی این لایه\n }}\n >\n <CenterComponent />\n </div>}\n </Box>\n );\n}\n"],"mappings":"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","names":["labels","ChartJS","Tooltip","Legend","Box"]}
package/dist/index.d.mts CHANGED
File without changes
package/dist/index.d.ts CHANGED
File without changes
package/dist/index.js CHANGED
File without changes
package/dist/index.js.map CHANGED
File without changes
package/dist/index.mjs CHANGED
File without changes
package/dist/index.mjs.map CHANGED
File without changes
package/dist/selectors/index.d.mts CHANGED
File without changes
package/dist/selectors/index.d.ts CHANGED
File without changes
package/dist/selectors/index.js CHANGED
File without changes
package/dist/selectors/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/selectors/index.ts","../../react-shim.js","../../src/selectors/multi-check-selector/index.tsx","../../src/selectors/multiple-selector/index.tsx","../../src/selectors/searchable-selector/index.tsx"],"sourcesContent":["export { default as MultiCheckSelector } from \"./multi-check-selector\";\nexport { default as MultipleSelector } from \"./multiple-selector\";\nexport { default as SearchableSelector } from \"./searchable-selector\";\n","import * as React from \"react\";\nexport { React };\n","import Autocomplete from \"@mui/material/Autocomplete\";\r\nimport TextField from \"@mui/material/TextField\";\r\nimport * as React from \"react\";\r\nimport { Control, Controller } from \"react-hook-form\";\r\nimport { Checkbox, CircularProgress, Popper } from \"@mui/material\";\r\nimport { FaCheckSquare } from \"react-icons/fa\";\r\nimport { RiCheckboxBlankLine } from \"react-icons/ri\";\r\nimport { MdSelectAll } from \"react-icons/md\";\r\nimport { RiDeleteBin6Line } from \"react-icons/ri\";\r\ninterface OptionType {\r\n title: string;\r\n key: string | number;\r\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\r\n}\r\nexport interface AutocompleteRenderOptionState {\r\n inputValue: string;\r\n index: number;\r\n selected: boolean;\r\n}\r\ninterface MultipleSelectChipProps<T extends OptionType> {\r\n name: string;\r\n control: Control<any>;\r\n label?: string;\r\n data?: T[];\r\n isLoading?: boolean;\r\n disabled?: boolean;\r\n size?: \"small\" | \"medium\";\r\n clear?: boolean;\r\n\r\n renderOption?: (\r\n props: React.HTMLAttributes<HTMLLIElement>,\r\n option: T,\r\n state:AutocompleteRenderOptionState\r\n ) => React.ReactNode;\r\n}\r\n/**\r\n * 📦 MultipleSelector — کامپوننت انتخاب چندگزینه‌ای پیشرفته\r\n *\r\n * @component MultipleSelector\r\n *\r\n * @template T — نوع داده‌ی گزینه‌ها که باید شامل فیلدهای `title` و `key` باشد.\r\n *\r\n * @param {string} name - نام فیلد در فرم (برای ثبت در react-hook-form).\r\n * @param {Control<any>} control - کنترل فرم از کتابخانه react-hook-form.\r\n * @param {string} [label] - برچسب ورودی.\r\n * @param {T[]} [data] - آرایه‌ای از گزینه‌ها که هر کدام باید شامل `title` (نمایش) و `key` (شناسه یکتا) باشد.\r\n * @param {boolean} [isLoading=false] - حالت لودینگ برای نمایش اسپینر در ورودی.\r\n * @param {boolean} [disabled=false] - غیرفعال‌کردن ورودی.\r\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی MUI Autocomplete.\r\n * @param {boolean} [clear=false] - اگر `false` باشد، قابلیت پاک کردن کامل (Clearable) غیرفعال می‌شود.\r\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T, state: AutocompleteRenderOptionState) => React.ReactNode} [renderOption] - تابع سفارشی برای رندر هر آیتم در لیست انتخاب.\r\n *\r\n * @description\r\n * این کامپوننت یک `Autocomplete` چندگزینه‌ای با قابلیت‌های زیر است:\r\n * - اتصال مستقیم به `react-hook-form` (با استفاده از Controller)\r\n * - انتخاب همه (`انتخاب همه`) یا پاک کردن همه (`پاک کردن همه`)\r\n * - نمایش تعداد آیتم‌های انتخاب شده به جای تگ‌های جداگانه\r\n * - پشتیبانی از حالت لودینگ و غیرفعال بودن\r\n * - امکان سفارشی‌سازی رندر آیتم‌ها (`renderOption`)\r\n * - آیکون‌های سفارشی برای انتخاب‌ها و گزینه‌های ویژه\r\n * - جلوگیری از بستن لیست هنگام انتخاب آیتم‌ها (`disableCloseOnSelect`)\r\n * - مدیریت موقعیت Popper با MUI modifiers\r\n *\r\n * @returns {Array<string | number>} آرایه‌ای از کلیدهای آیتم‌های انتخاب شده.\r\n *\r\n * @example\r\n * ```tsx\r\n * import { useForm, Controller } from \"react-hook-form\";\r\n *\r\n * type MyOption = { title: string; key: number };\r\n *\r\n * const options: MyOption[] = [\r\n * { title: \"محصول ۱\", key: 1 },\r\n * { title: \"محصول ۲\", key: 2 },\r\n * ];\r\n *\r\n * export default function MyForm() {\r\n * const { control, handleSubmit } = useForm({ defaultValues: { productIds: [] } });\r\n *\r\n * const onSubmit = (data: any) => {\r\n * console.log(\"انتخاب شده‌ها:\", data.productIds);\r\n * };\r\n *\r\n * return (\r\n * <form onSubmit={handleSubmit(onSubmit)}>\r\n * <MultipleSelector<MyOption>\r\n * name=\"productIds\"\r\n * label=\"محصولات\"\r\n * control={control}\r\n * data={options}\r\n * isLoading={false}\r\n * size=\"small\"\r\n * renderOption={(props, option, state) => (\r\n * <li {...props} key={option.key}>\r\n * <strong style={{ color: state.selected ? \"green\" : \"black\" }}>\r\n * {option.title}\r\n * </strong>\r\n * </li>\r\n * )}\r\n * />\r\n * <button type=\"submit\">ثبت</button>\r\n * </form>\r\n * );\r\n * }\r\n * ```\r\n */\r\nexport default function MultiCheckSelector<T extends OptionType>({\r\n name,\r\n control,\r\n label,\r\n data,\r\n isLoading,\r\n disabled = false,\r\n size = \"medium\",\r\n clear = false,\r\n renderOption,\r\n}: MultipleSelectChipProps<T>) {\r\n const dataOptions =\r\n data?.map((value) => ({\r\n ...value,\r\n key: value.key || `key_${Math.random()}`,\r\n })) || [];\r\n\r\n const combinedOptions =\r\n dataOptions.length > 0\r\n ? [\r\n { title: \"انتخاب همه\", key: \"All\" } as T,\r\n { title: \"پاک کردن همه\", key: \"ClearAll\" } as T,\r\n ...dataOptions,\r\n ]\r\n : [...dataOptions];\r\n\r\n const handleChange = (\r\n _event: any,\r\n selected: any,\r\n onChange: (value: any) => void\r\n ) => {\r\n if (selected.some((item: any) => item.key === \"All\")) {\r\n const allItems = [...dataOptions];\r\n onChange(allItems.map((item) => item.key));\r\n } else if (selected.some((item: any) => item.key === \"ClearAll\")) {\r\n onChange([]);\r\n } else {\r\n onChange(selected.map((item: any) => item.key));\r\n }\r\n };\r\n const icon = <RiCheckboxBlankLine size={20} />;\r\n const checkedIcon = <FaCheckSquare size={20} />;\r\n\r\n return (\r\n <Controller\r\n name={name}\r\n control={control}\r\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\r\n const computedValue = React.useMemo(() => {\r\n if (Array.isArray(value) && dataOptions.length > 0) {\r\n return dataOptions.filter((option: any) =>\r\n value.includes(option.key)\r\n );\r\n }\r\n return [];\r\n }, [value, dataOptions]);\r\n\r\n // کنترل باز و بسته شدن آتوکامپلیت\r\n const autocompleteRef = React.useRef<any>(null);\r\n const [open, setOpen] = React.useState(false);\r\n const handleOpen = () => setOpen(true);\r\n const handleClose = () => setOpen(false);\r\n return (\r\n <Autocomplete\r\n multiple\r\n disableClearable={clear}\r\n disabled={disabled || isLoading}\r\n size={size}\r\n disableCloseOnSelect\r\n options={combinedOptions}\r\n sx={{ width: \"100%\" }}\r\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\r\n value={computedValue}\r\n onChange={(event, value) =>\r\n handleChange(event, value as T[], onChange)\r\n }\r\n isOptionEqualToValue={(option, value) =>\r\n String(option.key) === String(value?.key)\r\n }\r\n getOptionLabel={(option) => option.title}\r\n loading={isLoading}\r\n loadingText=\"در حال بارگذاری...\"\r\n open={open}\r\n onOpen={handleOpen}\r\n onClose={handleClose}\r\n ref={autocompleteRef}\r\n renderOption={(props, option, state) => { \r\n if (renderOption) {\r\n return renderOption(props, option,state);\r\n }\r\n // آیکون مناسب برای گزینه‌های انتخاب همه و پاک کردن همه\r\n let iconElem = null;\r\n if (option.key === \"All\") {\r\n iconElem = <MdSelectAll size={18} style={{ marginLeft: 6, color: '#2563eb' }} />;\r\n } else if (option.key === \"ClearAll\") {\r\n iconElem = <RiDeleteBin6Line size={18} style={{ marginLeft: 6, color: '#ef4444' }} />;\r\n }\r\n return (\r\n <li\r\n {...props}\r\n key={`${option.key}`}\r\n style={{ margin: 5, borderRadius: 3 }}\r\n >\r\n <div\r\n style={{\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n width: \"100%\",\r\n alignItems: \"center\",\r\n }}\r\n >\r\n {option.key === \"All\" || option.key === \"ClearAll\"\r\n ? iconElem\r\n : <Checkbox\r\n icon={icon}\r\n checkedIcon={checkedIcon}\r\n style={{ marginLeft: 8 }}\r\n checked={state.selected}\r\n sx={{margin:0 , padding:0}}\r\n />}\r\n <div style={{ flexDirection: \"row\", width: \"100%\" }}>\r\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\r\n </div>\r\n </div>\r\n </li>\r\n );\r\n }}\r\n renderTags={(value) => {\r\n if (value.length === 0) return null;\r\n const total = dataOptions.length;\r\n const tagText = value.length === total\r\n ? `${value.length} مورد انتخاب شده`\r\n : `${value.length} مورد از ${total} انتخاب شده`;\r\n return (\r\n <span\r\n style={{\r\n fontWeight: 600,\r\n fontSize: 15,\r\n padding: '2px 8px',\r\n borderRadius: 6,\r\n margin: '2px 0',\r\n letterSpacing: 0.2,\r\n userSelect: 'none',\r\n maxWidth: '100%',\r\n whiteSpace: 'nowrap',\r\n overflow: 'hidden',\r\n textOverflow: 'ellipsis',\r\n display: 'inline-block',\r\n cursor: 'pointer',\r\n }}\r\n onClick={handleOpen}\r\n >\r\n {tagText}\r\n </span>\r\n );\r\n }}\r\n slots={{ popper: Popper }}\r\n slotProps={{\r\n popper: {\r\n modifiers: [\r\n {\r\n name: \"preventOverflow\",\r\n options: {\r\n boundary: \"window\",\r\n rootBoundary: \"viewport\",\r\n altBoundary: true,\r\n padding: 10,\r\n },\r\n },\r\n {\r\n name: \"flip\",\r\n options: {\r\n fallbackPlacements: [\"top\", \"bottom\"],\r\n },\r\n },\r\n ],\r\n },\r\n }}\r\n renderInput={(params) => (\r\n <TextField\r\n {...params}\r\n label={label}\r\n error={!!error}\r\n helperText={error?.message}\r\n inputRef={ref}\r\n InputProps={{\r\n ...params.InputProps,\r\n endAdornment: (\r\n <React.Fragment>\r\n {isLoading ? (\r\n <CircularProgress color=\"primary\" size={20} />\r\n ) : null}\r\n {params.InputProps.endAdornment}\r\n </React.Fragment>\r\n ),\r\n }}\r\n />\r\n )}\r\n />\r\n );\r\n }}\r\n />\r\n );\r\n}\r\n// ...existing code...\r\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { CircularProgress, Popper } from \"@mui/material\";\n\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\n\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 📦 کامپوننت انتخاب چند گزینه‌ای با پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component MultipleSelector\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از react-hook-form.\n * @param {{ title: string; key: string | number }[]} [data] - لیستی از گزینه‌ها شامل `title` (متن) و `key` (مقدار).\n * @param {boolean} [isLoading=false] - آیا داده‌ها در حال بارگذاری هستند.\n * @param {boolean} [disabled=false] - غیرفعال‌سازی ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی.\n * @param {boolean} [clear=false] - آیا امکان پاک کردن وجود دارد یا نه.\n * @param {string} [tooltip] - متن راهنما هنگام هاور.\n * @param {(props, option) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {Array<{ key: string | number }>} لیستی از آیتم‌های انتخاب‌شده ( فقط آیدی‌ها).\n *\n * @example\n * ```tsx\n * <MultipleSelector<{title:string; key:number;}>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={[{ title: \"محصول ۱\", key: 1 }, { title: \"محصول ۲\", key: 2 }]}\n * />\n * ```\n *\n * @description\n * کامپوننتی چندانتخابی با قابلیت انتخاب همه‌ی موارد، سفارشی‌سازی گزینه‌ها،\n * نمایش راهنمای هاور، و بازگرداندن لیست کامل از آبجکت‌های انتخاب‌شده.\n *\n * برای سفارشی‌سازی نحوه نمایش آیتم‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={`${option.key}`}>\n * <span style={{ color: \"green\" }}>{option.title}</span>\n * </li>\n * )}\n * ```\n */\n\nexport default function MultipleSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [{ title: \"انتخاب همه\", key: \"All\" } as T, ...dataOptions]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n","import { CircularProgress, Popper } from \"@mui/material\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\n\ninterface BaseOption {\n key: number | string | \"false\" | true;\n title: string | number;\n [x: string]: any;\n}\n\ninterface SeacrchableSelectChipProps<T extends BaseOption = BaseOption> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n onChangeHandler?: (value: any, onChange: (data: any) => void) => void;\n valueHandler?: (value: any) => any;\n onFilterOptions: (inputValue: string) => void;\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 🔍 کامپوننت انتخاب تکی با قابلیت جست‌وجو، پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component SeacrchableSelector\n *\n * @template T - نوع گزینه‌ها که باید شامل `key` و `title` باشد.\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از `react-hook-form`.\n * @param {T[]} [data] - لیستی از گزینه‌ها شامل `key` و `title` به عنوان مقدار و متن نمایشی.\n * @param {boolean} [isLoading=false] - وضعیت بارگذاری (مثلاً هنگام فراخوانی API).\n * @param {boolean} [disabled=false] - غیرفعال بودن فیلد.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - اندازه ورودی.\n * @param {boolean} [clear=false] - فعال بودن امکان پاک‌کردن مقدار انتخاب‌شده.\n * @param {(value: any, onChange: (data: any) => void) => void} [onChangeHandler] - تابع هندل انتخاب گزینه (در صورت نیاز به کنترل خارجی).\n * @param {(value: any) => string} [valueHandler] - تابع تبدیل مقدار ذخیره‌شده در فرم به مقدار نمایشی در input (مثلاً عنوان).\n * @param {(inputValue: string) => void} [onFilterOptions] - تابعی برای هندل کردن فیلتر شدن داده‌ها هنگام تایپ کاربر (مثلاً برای fetch کردن).\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {string | number | null} مقدار انتخاب‌شده (کلید گزینه یا null)\n *\n * @example\n * ```tsx\n * <SeacrchableSelector<{ title: string; key: number }>\n * name=\"categoryId\"\n * label=\"دسته‌بندی\"\n * control={control}\n * data={[{ title: \"کتاب\", key: 1 }, { title: \"لوازم تحریر\", key: 2 }]}\n * onFilterOptions={(input) => fetchUsers(input)}\n * />\n * ```\n *\n * @description\n * این کامپوننت یک ورودی انتخاب‌گر تکی با قابلیت جست‌وجو و پشتیبانی از مقدار دلخواه کاربر (`freeSolo`) است.\n * قابلیت‌هایی مانند بارگذاری داده، سفارشی‌سازی نمایش گزینه‌ها، هماهنگ‌سازی با فرم، پاک‌سازی انتخاب، و پشتیبانی از جست‌وجوی سمت سرور را نیز داراست.\n *\n * اگر `freeSolo` فعال باشد، می‌توان مقادیر تایپ‌شده را نیز ذخیره کرد. مقدار خروجی معمولاً `key` گزینه انتخاب‌شده است،\n * مگر اینکه کاربر متنی وارد کند که در لیست نباشد (در این صورت می‌توان آن را مستقیم ذخیره کرد).\n *\n * برای سفارشی‌سازی گزینه‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={option.key}>\n * <b>{option.title}</b>\n * </li>\n * )}\n * ```\n */\n\nexport default function SearchableSelector<T extends BaseOption = BaseOption>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n onChangeHandler,\n valueHandler,\n onFilterOptions,\n renderOption,\n}: SeacrchableSelectChipProps<T>) {\n const dataOptions =\n data?.map((value: T) => ({\n ...value,\n })) || [];\n\n const [inputValue, setInputValue] = React.useState(\"\");\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const selectedValues = React.useMemo(\n () => dataOptions.find((v) => v?.key == value) ?? null,\n [value, dataOptions]\n );\n\n return (\n <Autocomplete\n freeSolo={true}\n disableClearable={clear || isLoading}\n disabled={disabled}\n disablePortal\n size={size}\n disableCloseOnSelect={false}\n options={dataOptions}\n inputValue={valueHandler ? valueHandler(value) : inputValue}\n onInputChange={(_, newInput, reason) => {\n reason == \"input\" && onChange(null);\n // وقتی کاربر داره تایپ می‌کنه یا پاک می‌کنه\n setInputValue(newInput);\n onFilterOptions(newInput);\n }}\n sx={{\n width: \"100%\",\n }}\n noOptionsText=\"داده ای برای نمایش وجود ندارد\"\n value={selectedValues}\n onChange={(e, value) => {\n // ۱) اگر کاربر یک رشته تایپ‌شده (freeSolo) انتخاب کرده\n if (typeof value === \"string\") {\n // می‌تونیم key رو هم با خود رشته‌ی ورودی برابر بگیریم،\n // یا اگر نمی‌خواید freeSolo ذخیره کنید، اینجا onChange(null) بزنید\n onChange(value as any); // یا onChange(null) بسته به نیاز\n setInputValue(value);\n }\n // ۲) اگر گزینه‌ی منظم انتخاب شده\n else if (value && typeof value === \"object\") {\n onChangeHandler\n ? onChangeHandler(value, onChange)\n : onChange(value.key);\n setInputValue(String(value.title));\n }\n // ۳) حالت پاک کردن\n else {\n onChange(null);\n setInputValue(\"\");\n }\n }}\n getOptionLabel={(option) => {\n if (typeof option === \"string\") return option;\n if (option?.title) return String(option.title);\n return \"\";\n }}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }} // New API\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"], // Ensures it flips to the top if needed\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n"],"mappings":"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","names":["React","import_ri","Autocomplete","value","TextField","import_Autocomplete","import_TextField","React","import_react_hook_form","import_material","Autocomplete","value","TextField","import_material","import_Autocomplete","import_TextField","React","import_react_hook_form","Autocomplete","value","TextField"]}
1
+ {"version":3,"sources":["../../src/selectors/index.ts","../../react-shim.js","../../src/selectors/multi-check-selector/index.tsx","../../src/selectors/multiple-selector/index.tsx","../../src/selectors/searchable-selector/index.tsx"],"sourcesContent":["export { default as MultiCheckSelector } from \"./multi-check-selector\";\nexport { default as MultipleSelector } from \"./multiple-selector\";\nexport { default as SearchableSelector } from \"./searchable-selector\";\n","import * as React from \"react\";\nexport { React };\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { Checkbox, CircularProgress, Popper } from \"@mui/material\";\nimport { FaCheckSquare } from \"react-icons/fa\";\nimport { RiCheckboxBlankLine } from \"react-icons/ri\";\nimport { MdSelectAll } from \"react-icons/md\";\nimport { RiDeleteBin6Line } from \"react-icons/ri\";\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\nexport interface AutocompleteRenderOptionState {\n inputValue: string;\n index: number;\n selected: boolean;\n}\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T,\n state:AutocompleteRenderOptionState\n ) => React.ReactNode;\n}\n/**\n * 📦 MultipleSelector — کامپوننت انتخاب چندگزینه‌ای پیشرفته\n *\n * @component MultipleSelector\n *\n * @template T — نوع داده‌ی گزینه‌ها که باید شامل فیلدهای `title` و `key` باشد.\n *\n * @param {string} name - نام فیلد در فرم (برای ثبت در react-hook-form).\n * @param {Control<any>} control - کنترل فرم از کتابخانه react-hook-form.\n * @param {string} [label] - برچسب ورودی.\n * @param {T[]} [data] - آرایه‌ای از گزینه‌ها که هر کدام باید شامل `title` (نمایش) و `key` (شناسه یکتا) باشد.\n * @param {boolean} [isLoading=false] - حالت لودینگ برای نمایش اسپینر در ورودی.\n * @param {boolean} [disabled=false] - غیرفعال‌کردن ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی MUI Autocomplete.\n * @param {boolean} [clear=false] - اگر `false` باشد، قابلیت پاک کردن کامل (Clearable) غیرفعال می‌شود.\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T, state: AutocompleteRenderOptionState) => React.ReactNode} [renderOption] - تابع سفارشی برای رندر هر آیتم در لیست انتخاب.\n *\n * @description\n * این کامپوننت یک `Autocomplete` چندگزینه‌ای با قابلیت‌های زیر است:\n * - اتصال مستقیم به `react-hook-form` (با استفاده از Controller)\n * - انتخاب همه (`انتخاب همه`) یا پاک کردن همه (`پاک کردن همه`)\n * - نمایش تعداد آیتم‌های انتخاب شده به جای تگ‌های جداگانه\n * - پشتیبانی از حالت لودینگ و غیرفعال بودن\n * - امکان سفارشی‌سازی رندر آیتم‌ها (`renderOption`)\n * - آیکون‌های سفارشی برای انتخاب‌ها و گزینه‌های ویژه\n * - جلوگیری از بستن لیست هنگام انتخاب آیتم‌ها (`disableCloseOnSelect`)\n * - مدیریت موقعیت Popper با MUI modifiers\n *\n * @returns {Array<string | number>} آرایه‌ای از کلیدهای آیتم‌های انتخاب شده.\n *\n * @example\n * ```tsx\n * import { useForm, Controller } from \"react-hook-form\";\n *\n * type MyOption = { title: string; key: number };\n *\n * const options: MyOption[] = [\n * { title: \"محصول ۱\", key: 1 },\n * { title: \"محصول ۲\", key: 2 },\n * ];\n *\n * export default function MyForm() {\n * const { control, handleSubmit } = useForm({ defaultValues: { productIds: [] } });\n *\n * const onSubmit = (data: any) => {\n * console.log(\"انتخاب شده‌ها:\", data.productIds);\n * };\n *\n * return (\n * <form onSubmit={handleSubmit(onSubmit)}>\n * <MultipleSelector<MyOption>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={options}\n * isLoading={false}\n * size=\"small\"\n * renderOption={(props, option, state) => (\n * <li {...props} key={option.key}>\n * <strong style={{ color: state.selected ? \"green\" : \"black\" }}>\n * {option.title}\n * </strong>\n * </li>\n * )}\n * />\n * <button type=\"submit\">ثبت</button>\n * </form>\n * );\n * }\n * ```\n */\nexport default function MultiCheckSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [\n { title: \"انتخاب همه\", key: \"All\" } as T,\n { title: \"پاک کردن همه\", key: \"ClearAll\" } as T,\n ...dataOptions,\n ]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else if (selected.some((item: any) => item.key === \"ClearAll\")) {\n onChange([]);\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n const icon = <RiCheckboxBlankLine size={20} />;\n const checkedIcon = <FaCheckSquare size={20} />;\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n // کنترل باز و بسته شدن آتوکامپلیت\n const autocompleteRef = React.useRef<any>(null);\n const [open, setOpen] = React.useState(false);\n const handleOpen = () => setOpen(true);\n const handleClose = () => setOpen(false);\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n open={open}\n onOpen={handleOpen}\n onClose={handleClose}\n ref={autocompleteRef}\n renderOption={(props, option, state) => { \n if (renderOption) {\n return renderOption(props, option,state);\n }\n // آیکون مناسب برای گزینه‌های انتخاب همه و پاک کردن همه\n let iconElem = null;\n if (option.key === \"All\") {\n iconElem = <MdSelectAll size={18} style={{ marginLeft: 6, color: '#2563eb' }} />;\n } else if (option.key === \"ClearAll\") {\n iconElem = <RiDeleteBin6Line size={18} style={{ marginLeft: 6, color: '#ef4444' }} />;\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n alignItems: \"center\",\n }}\n >\n {option.key === \"All\" || option.key === \"ClearAll\"\n ? iconElem\n : <Checkbox\n icon={icon}\n checkedIcon={checkedIcon}\n style={{ marginLeft: 8 }}\n checked={state.selected}\n sx={{margin:0 , padding:0}}\n />}\n <div style={{ flexDirection: \"row\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n renderTags={(value) => {\n if (value.length === 0) return null;\n const total = dataOptions.length;\n const tagText = value.length === total\n ? `${value.length} مورد انتخاب شده`\n : `${value.length} مورد از ${total} انتخاب شده`;\n return (\n <span\n style={{\n fontWeight: 600,\n fontSize: 15,\n padding: '2px 8px',\n borderRadius: 6,\n margin: '2px 0',\n letterSpacing: 0.2,\n userSelect: 'none',\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n display: 'inline-block',\n cursor: 'pointer',\n }}\n onClick={handleOpen}\n >\n {tagText}\n </span>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n// ...existing code...\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { CircularProgress, Popper } from \"@mui/material\";\n\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\n\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 📦 کامپوننت انتخاب چند گزینه‌ای با پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component MultipleSelector\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از react-hook-form.\n * @param {{ title: string; key: string | number }[]} [data] - لیستی از گزینه‌ها شامل `title` (متن) و `key` (مقدار).\n * @param {boolean} [isLoading=false] - آیا داده‌ها در حال بارگذاری هستند.\n * @param {boolean} [disabled=false] - غیرفعال‌سازی ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی.\n * @param {boolean} [clear=false] - آیا امکان پاک کردن وجود دارد یا نه.\n * @param {string} [tooltip] - متن راهنما هنگام هاور.\n * @param {(props, option) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {Array<{ key: string | number }>} لیستی از آیتم‌های انتخاب‌شده ( فقط آیدی‌ها).\n *\n * @example\n * ```tsx\n * <MultipleSelector<{title:string; key:number;}>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={[{ title: \"محصول ۱\", key: 1 }, { title: \"محصول ۲\", key: 2 }]}\n * />\n * ```\n *\n * @description\n * کامپوننتی چندانتخابی با قابلیت انتخاب همه‌ی موارد، سفارشی‌سازی گزینه‌ها،\n * نمایش راهنمای هاور، و بازگرداندن لیست کامل از آبجکت‌های انتخاب‌شده.\n *\n * برای سفارشی‌سازی نحوه نمایش آیتم‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={`${option.key}`}>\n * <span style={{ color: \"green\" }}>{option.title}</span>\n * </li>\n * )}\n * ```\n */\n\nexport default function MultipleSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [{ title: \"انتخاب همه\", key: \"All\" } as T, ...dataOptions]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n","import { CircularProgress, Popper } from \"@mui/material\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\n\ninterface BaseOption {\n key: number | string | \"false\" | true;\n title: string | number;\n [x: string]: any;\n}\n\ninterface SeacrchableSelectChipProps<T extends BaseOption = BaseOption> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n onChangeHandler?: (value: any, onChange: (data: any) => void) => void;\n valueHandler?: (value: any) => any;\n onFilterOptions: (inputValue: string) => void;\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 🔍 کامپوننت انتخاب تکی با قابلیت جست‌وجو، پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component SeacrchableSelector\n *\n * @template T - نوع گزینه‌ها که باید شامل `key` و `title` باشد.\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از `react-hook-form`.\n * @param {T[]} [data] - لیستی از گزینه‌ها شامل `key` و `title` به عنوان مقدار و متن نمایشی.\n * @param {boolean} [isLoading=false] - وضعیت بارگذاری (مثلاً هنگام فراخوانی API).\n * @param {boolean} [disabled=false] - غیرفعال بودن فیلد.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - اندازه ورودی.\n * @param {boolean} [clear=false] - فعال بودن امکان پاک‌کردن مقدار انتخاب‌شده.\n * @param {(value: any, onChange: (data: any) => void) => void} [onChangeHandler] - تابع هندل انتخاب گزینه (در صورت نیاز به کنترل خارجی).\n * @param {(value: any) => string} [valueHandler] - تابع تبدیل مقدار ذخیره‌شده در فرم به مقدار نمایشی در input (مثلاً عنوان).\n * @param {(inputValue: string) => void} [onFilterOptions] - تابعی برای هندل کردن فیلتر شدن داده‌ها هنگام تایپ کاربر (مثلاً برای fetch کردن).\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {string | number | null} مقدار انتخاب‌شده (کلید گزینه یا null)\n *\n * @example\n * ```tsx\n * <SeacrchableSelector<{ title: string; key: number }>\n * name=\"categoryId\"\n * label=\"دسته‌بندی\"\n * control={control}\n * data={[{ title: \"کتاب\", key: 1 }, { title: \"لوازم تحریر\", key: 2 }]}\n * onFilterOptions={(input) => fetchUsers(input)}\n * />\n * ```\n *\n * @description\n * این کامپوننت یک ورودی انتخاب‌گر تکی با قابلیت جست‌وجو و پشتیبانی از مقدار دلخواه کاربر (`freeSolo`) است.\n * قابلیت‌هایی مانند بارگذاری داده، سفارشی‌سازی نمایش گزینه‌ها، هماهنگ‌سازی با فرم، پاک‌سازی انتخاب، و پشتیبانی از جست‌وجوی سمت سرور را نیز داراست.\n *\n * اگر `freeSolo` فعال باشد، می‌توان مقادیر تایپ‌شده را نیز ذخیره کرد. مقدار خروجی معمولاً `key` گزینه انتخاب‌شده است،\n * مگر اینکه کاربر متنی وارد کند که در لیست نباشد (در این صورت می‌توان آن را مستقیم ذخیره کرد).\n *\n * برای سفارشی‌سازی گزینه‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={option.key}>\n * <b>{option.title}</b>\n * </li>\n * )}\n * ```\n */\n\nexport default function SearchableSelector<T extends BaseOption = BaseOption>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n onChangeHandler,\n valueHandler,\n onFilterOptions,\n renderOption,\n}: SeacrchableSelectChipProps<T>) {\n const dataOptions =\n data?.map((value: T) => ({\n ...value,\n })) || [];\n\n const [inputValue, setInputValue] = React.useState(\"\");\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const selectedValues = React.useMemo(\n () => dataOptions.find((v) => v?.key == value) ?? null,\n [value, dataOptions]\n );\n\n return (\n <Autocomplete\n freeSolo={true}\n disableClearable={clear || isLoading}\n disabled={disabled}\n disablePortal\n size={size}\n disableCloseOnSelect={false}\n options={dataOptions}\n inputValue={valueHandler ? valueHandler(value) : inputValue}\n onInputChange={(_, newInput, reason) => {\n reason == \"input\" && onChange(null);\n // وقتی کاربر داره تایپ می‌کنه یا پاک می‌کنه\n setInputValue(newInput);\n onFilterOptions(newInput);\n }}\n sx={{\n width: \"100%\",\n }}\n noOptionsText=\"داده ای برای نمایش وجود ندارد\"\n value={selectedValues}\n onChange={(e, value) => {\n // ۱) اگر کاربر یک رشته تایپ‌شده (freeSolo) انتخاب کرده\n if (typeof value === \"string\") {\n // می‌تونیم key رو هم با خود رشته‌ی ورودی برابر بگیریم،\n // یا اگر نمی‌خواید freeSolo ذخیره کنید، اینجا onChange(null) بزنید\n onChange(value as any); // یا onChange(null) بسته به نیاز\n setInputValue(value);\n }\n // ۲) اگر گزینه‌ی منظم انتخاب شده\n else if (value && typeof value === \"object\") {\n onChangeHandler\n ? onChangeHandler(value, onChange)\n : onChange(value.key);\n setInputValue(String(value.title));\n }\n // ۳) حالت پاک کردن\n else {\n onChange(null);\n setInputValue(\"\");\n }\n }}\n getOptionLabel={(option) => {\n if (typeof option === \"string\") return option;\n if (option?.title) return String(option.title);\n return \"\";\n }}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }} // New API\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"], // Ensures it flips to the top if needed\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n"],"mappings":"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","names":["React","import_ri","Autocomplete","value","TextField","import_Autocomplete","import_TextField","React","import_react_hook_form","import_material","Autocomplete","value","TextField","import_material","import_Autocomplete","import_TextField","React","import_react_hook_form","Autocomplete","value","TextField"]}
package/dist/selectors/index.mjs CHANGED
File without changes
package/dist/selectors/index.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../../react-shim.js","../../src/selectors/multi-check-selector/index.tsx","../../src/selectors/multiple-selector/index.tsx","../../src/selectors/searchable-selector/index.tsx"],"sourcesContent":["import * as React from \"react\";\nexport { React };\n","import Autocomplete from \"@mui/material/Autocomplete\";\r\nimport TextField from \"@mui/material/TextField\";\r\nimport * as React from \"react\";\r\nimport { Control, Controller } from \"react-hook-form\";\r\nimport { Checkbox, CircularProgress, Popper } from \"@mui/material\";\r\nimport { FaCheckSquare } from \"react-icons/fa\";\r\nimport { RiCheckboxBlankLine } from \"react-icons/ri\";\r\nimport { MdSelectAll } from \"react-icons/md\";\r\nimport { RiDeleteBin6Line } from \"react-icons/ri\";\r\ninterface OptionType {\r\n title: string;\r\n key: string | number;\r\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\r\n}\r\nexport interface AutocompleteRenderOptionState {\r\n inputValue: string;\r\n index: number;\r\n selected: boolean;\r\n}\r\ninterface MultipleSelectChipProps<T extends OptionType> {\r\n name: string;\r\n control: Control<any>;\r\n label?: string;\r\n data?: T[];\r\n isLoading?: boolean;\r\n disabled?: boolean;\r\n size?: \"small\" | \"medium\";\r\n clear?: boolean;\r\n\r\n renderOption?: (\r\n props: React.HTMLAttributes<HTMLLIElement>,\r\n option: T,\r\n state:AutocompleteRenderOptionState\r\n ) => React.ReactNode;\r\n}\r\n/**\r\n * 📦 MultipleSelector — کامپوننت انتخاب چندگزینه‌ای پیشرفته\r\n *\r\n * @component MultipleSelector\r\n *\r\n * @template T — نوع داده‌ی گزینه‌ها که باید شامل فیلدهای `title` و `key` باشد.\r\n *\r\n * @param {string} name - نام فیلد در فرم (برای ثبت در react-hook-form).\r\n * @param {Control<any>} control - کنترل فرم از کتابخانه react-hook-form.\r\n * @param {string} [label] - برچسب ورودی.\r\n * @param {T[]} [data] - آرایه‌ای از گزینه‌ها که هر کدام باید شامل `title` (نمایش) و `key` (شناسه یکتا) باشد.\r\n * @param {boolean} [isLoading=false] - حالت لودینگ برای نمایش اسپینر در ورودی.\r\n * @param {boolean} [disabled=false] - غیرفعال‌کردن ورودی.\r\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی MUI Autocomplete.\r\n * @param {boolean} [clear=false] - اگر `false` باشد، قابلیت پاک کردن کامل (Clearable) غیرفعال می‌شود.\r\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T, state: AutocompleteRenderOptionState) => React.ReactNode} [renderOption] - تابع سفارشی برای رندر هر آیتم در لیست انتخاب.\r\n *\r\n * @description\r\n * این کامپوننت یک `Autocomplete` چندگزینه‌ای با قابلیت‌های زیر است:\r\n * - اتصال مستقیم به `react-hook-form` (با استفاده از Controller)\r\n * - انتخاب همه (`انتخاب همه`) یا پاک کردن همه (`پاک کردن همه`)\r\n * - نمایش تعداد آیتم‌های انتخاب شده به جای تگ‌های جداگانه\r\n * - پشتیبانی از حالت لودینگ و غیرفعال بودن\r\n * - امکان سفارشی‌سازی رندر آیتم‌ها (`renderOption`)\r\n * - آیکون‌های سفارشی برای انتخاب‌ها و گزینه‌های ویژه\r\n * - جلوگیری از بستن لیست هنگام انتخاب آیتم‌ها (`disableCloseOnSelect`)\r\n * - مدیریت موقعیت Popper با MUI modifiers\r\n *\r\n * @returns {Array<string | number>} آرایه‌ای از کلیدهای آیتم‌های انتخاب شده.\r\n *\r\n * @example\r\n * ```tsx\r\n * import { useForm, Controller } from \"react-hook-form\";\r\n *\r\n * type MyOption = { title: string; key: number };\r\n *\r\n * const options: MyOption[] = [\r\n * { title: \"محصول ۱\", key: 1 },\r\n * { title: \"محصول ۲\", key: 2 },\r\n * ];\r\n *\r\n * export default function MyForm() {\r\n * const { control, handleSubmit } = useForm({ defaultValues: { productIds: [] } });\r\n *\r\n * const onSubmit = (data: any) => {\r\n * console.log(\"انتخاب شده‌ها:\", data.productIds);\r\n * };\r\n *\r\n * return (\r\n * <form onSubmit={handleSubmit(onSubmit)}>\r\n * <MultipleSelector<MyOption>\r\n * name=\"productIds\"\r\n * label=\"محصولات\"\r\n * control={control}\r\n * data={options}\r\n * isLoading={false}\r\n * size=\"small\"\r\n * renderOption={(props, option, state) => (\r\n * <li {...props} key={option.key}>\r\n * <strong style={{ color: state.selected ? \"green\" : \"black\" }}>\r\n * {option.title}\r\n * </strong>\r\n * </li>\r\n * )}\r\n * />\r\n * <button type=\"submit\">ثبت</button>\r\n * </form>\r\n * );\r\n * }\r\n * ```\r\n */\r\nexport default function MultiCheckSelector<T extends OptionType>({\r\n name,\r\n control,\r\n label,\r\n data,\r\n isLoading,\r\n disabled = false,\r\n size = \"medium\",\r\n clear = false,\r\n renderOption,\r\n}: MultipleSelectChipProps<T>) {\r\n const dataOptions =\r\n data?.map((value) => ({\r\n ...value,\r\n key: value.key || `key_${Math.random()}`,\r\n })) || [];\r\n\r\n const combinedOptions =\r\n dataOptions.length > 0\r\n ? [\r\n { title: \"انتخاب همه\", key: \"All\" } as T,\r\n { title: \"پاک کردن همه\", key: \"ClearAll\" } as T,\r\n ...dataOptions,\r\n ]\r\n : [...dataOptions];\r\n\r\n const handleChange = (\r\n _event: any,\r\n selected: any,\r\n onChange: (value: any) => void\r\n ) => {\r\n if (selected.some((item: any) => item.key === \"All\")) {\r\n const allItems = [...dataOptions];\r\n onChange(allItems.map((item) => item.key));\r\n } else if (selected.some((item: any) => item.key === \"ClearAll\")) {\r\n onChange([]);\r\n } else {\r\n onChange(selected.map((item: any) => item.key));\r\n }\r\n };\r\n const icon = <RiCheckboxBlankLine size={20} />;\r\n const checkedIcon = <FaCheckSquare size={20} />;\r\n\r\n return (\r\n <Controller\r\n name={name}\r\n control={control}\r\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\r\n const computedValue = React.useMemo(() => {\r\n if (Array.isArray(value) && dataOptions.length > 0) {\r\n return dataOptions.filter((option: any) =>\r\n value.includes(option.key)\r\n );\r\n }\r\n return [];\r\n }, [value, dataOptions]);\r\n\r\n // کنترل باز و بسته شدن آتوکامپلیت\r\n const autocompleteRef = React.useRef<any>(null);\r\n const [open, setOpen] = React.useState(false);\r\n const handleOpen = () => setOpen(true);\r\n const handleClose = () => setOpen(false);\r\n return (\r\n <Autocomplete\r\n multiple\r\n disableClearable={clear}\r\n disabled={disabled || isLoading}\r\n size={size}\r\n disableCloseOnSelect\r\n options={combinedOptions}\r\n sx={{ width: \"100%\" }}\r\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\r\n value={computedValue}\r\n onChange={(event, value) =>\r\n handleChange(event, value as T[], onChange)\r\n }\r\n isOptionEqualToValue={(option, value) =>\r\n String(option.key) === String(value?.key)\r\n }\r\n getOptionLabel={(option) => option.title}\r\n loading={isLoading}\r\n loadingText=\"در حال بارگذاری...\"\r\n open={open}\r\n onOpen={handleOpen}\r\n onClose={handleClose}\r\n ref={autocompleteRef}\r\n renderOption={(props, option, state) => { \r\n if (renderOption) {\r\n return renderOption(props, option,state);\r\n }\r\n // آیکون مناسب برای گزینه‌های انتخاب همه و پاک کردن همه\r\n let iconElem = null;\r\n if (option.key === \"All\") {\r\n iconElem = <MdSelectAll size={18} style={{ marginLeft: 6, color: '#2563eb' }} />;\r\n } else if (option.key === \"ClearAll\") {\r\n iconElem = <RiDeleteBin6Line size={18} style={{ marginLeft: 6, color: '#ef4444' }} />;\r\n }\r\n return (\r\n <li\r\n {...props}\r\n key={`${option.key}`}\r\n style={{ margin: 5, borderRadius: 3 }}\r\n >\r\n <div\r\n style={{\r\n display: \"flex\",\r\n flexDirection: \"row\",\r\n width: \"100%\",\r\n alignItems: \"center\",\r\n }}\r\n >\r\n {option.key === \"All\" || option.key === \"ClearAll\"\r\n ? iconElem\r\n : <Checkbox\r\n icon={icon}\r\n checkedIcon={checkedIcon}\r\n style={{ marginLeft: 8 }}\r\n checked={state.selected}\r\n sx={{margin:0 , padding:0}}\r\n />}\r\n <div style={{ flexDirection: \"row\", width: \"100%\" }}>\r\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\r\n </div>\r\n </div>\r\n </li>\r\n );\r\n }}\r\n renderTags={(value) => {\r\n if (value.length === 0) return null;\r\n const total = dataOptions.length;\r\n const tagText = value.length === total\r\n ? `${value.length} مورد انتخاب شده`\r\n : `${value.length} مورد از ${total} انتخاب شده`;\r\n return (\r\n <span\r\n style={{\r\n fontWeight: 600,\r\n fontSize: 15,\r\n padding: '2px 8px',\r\n borderRadius: 6,\r\n margin: '2px 0',\r\n letterSpacing: 0.2,\r\n userSelect: 'none',\r\n maxWidth: '100%',\r\n whiteSpace: 'nowrap',\r\n overflow: 'hidden',\r\n textOverflow: 'ellipsis',\r\n display: 'inline-block',\r\n cursor: 'pointer',\r\n }}\r\n onClick={handleOpen}\r\n >\r\n {tagText}\r\n </span>\r\n );\r\n }}\r\n slots={{ popper: Popper }}\r\n slotProps={{\r\n popper: {\r\n modifiers: [\r\n {\r\n name: \"preventOverflow\",\r\n options: {\r\n boundary: \"window\",\r\n rootBoundary: \"viewport\",\r\n altBoundary: true,\r\n padding: 10,\r\n },\r\n },\r\n {\r\n name: \"flip\",\r\n options: {\r\n fallbackPlacements: [\"top\", \"bottom\"],\r\n },\r\n },\r\n ],\r\n },\r\n }}\r\n renderInput={(params) => (\r\n <TextField\r\n {...params}\r\n label={label}\r\n error={!!error}\r\n helperText={error?.message}\r\n inputRef={ref}\r\n InputProps={{\r\n ...params.InputProps,\r\n endAdornment: (\r\n <React.Fragment>\r\n {isLoading ? (\r\n <CircularProgress color=\"primary\" size={20} />\r\n ) : null}\r\n {params.InputProps.endAdornment}\r\n </React.Fragment>\r\n ),\r\n }}\r\n />\r\n )}\r\n />\r\n );\r\n }}\r\n />\r\n );\r\n}\r\n// ...existing code...\r\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { CircularProgress, Popper } from \"@mui/material\";\n\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\n\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 📦 کامپوننت انتخاب چند گزینه‌ای با پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component MultipleSelector\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از react-hook-form.\n * @param {{ title: string; key: string | number }[]} [data] - لیستی از گزینه‌ها شامل `title` (متن) و `key` (مقدار).\n * @param {boolean} [isLoading=false] - آیا داده‌ها در حال بارگذاری هستند.\n * @param {boolean} [disabled=false] - غیرفعال‌سازی ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی.\n * @param {boolean} [clear=false] - آیا امکان پاک کردن وجود دارد یا نه.\n * @param {string} [tooltip] - متن راهنما هنگام هاور.\n * @param {(props, option) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {Array<{ key: string | number }>} لیستی از آیتم‌های انتخاب‌شده ( فقط آیدی‌ها).\n *\n * @example\n * ```tsx\n * <MultipleSelector<{title:string; key:number;}>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={[{ title: \"محصول ۱\", key: 1 }, { title: \"محصول ۲\", key: 2 }]}\n * />\n * ```\n *\n * @description\n * کامپوننتی چندانتخابی با قابلیت انتخاب همه‌ی موارد، سفارشی‌سازی گزینه‌ها،\n * نمایش راهنمای هاور، و بازگرداندن لیست کامل از آبجکت‌های انتخاب‌شده.\n *\n * برای سفارشی‌سازی نحوه نمایش آیتم‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={`${option.key}`}>\n * <span style={{ color: \"green\" }}>{option.title}</span>\n * </li>\n * )}\n * ```\n */\n\nexport default function MultipleSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [{ title: \"انتخاب همه\", key: \"All\" } as T, ...dataOptions]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n","import { CircularProgress, Popper } from \"@mui/material\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\n\ninterface BaseOption {\n key: number | string | \"false\" | true;\n title: string | number;\n [x: string]: any;\n}\n\ninterface SeacrchableSelectChipProps<T extends BaseOption = BaseOption> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n onChangeHandler?: (value: any, onChange: (data: any) => void) => void;\n valueHandler?: (value: any) => any;\n onFilterOptions: (inputValue: string) => void;\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 🔍 کامپوننت انتخاب تکی با قابلیت جست‌وجو، پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component SeacrchableSelector\n *\n * @template T - نوع گزینه‌ها که باید شامل `key` و `title` باشد.\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از `react-hook-form`.\n * @param {T[]} [data] - لیستی از گزینه‌ها شامل `key` و `title` به عنوان مقدار و متن نمایشی.\n * @param {boolean} [isLoading=false] - وضعیت بارگذاری (مثلاً هنگام فراخوانی API).\n * @param {boolean} [disabled=false] - غیرفعال بودن فیلد.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - اندازه ورودی.\n * @param {boolean} [clear=false] - فعال بودن امکان پاک‌کردن مقدار انتخاب‌شده.\n * @param {(value: any, onChange: (data: any) => void) => void} [onChangeHandler] - تابع هندل انتخاب گزینه (در صورت نیاز به کنترل خارجی).\n * @param {(value: any) => string} [valueHandler] - تابع تبدیل مقدار ذخیره‌شده در فرم به مقدار نمایشی در input (مثلاً عنوان).\n * @param {(inputValue: string) => void} [onFilterOptions] - تابعی برای هندل کردن فیلتر شدن داده‌ها هنگام تایپ کاربر (مثلاً برای fetch کردن).\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {string | number | null} مقدار انتخاب‌شده (کلید گزینه یا null)\n *\n * @example\n * ```tsx\n * <SeacrchableSelector<{ title: string; key: number }>\n * name=\"categoryId\"\n * label=\"دسته‌بندی\"\n * control={control}\n * data={[{ title: \"کتاب\", key: 1 }, { title: \"لوازم تحریر\", key: 2 }]}\n * onFilterOptions={(input) => fetchUsers(input)}\n * />\n * ```\n *\n * @description\n * این کامپوننت یک ورودی انتخاب‌گر تکی با قابلیت جست‌وجو و پشتیبانی از مقدار دلخواه کاربر (`freeSolo`) است.\n * قابلیت‌هایی مانند بارگذاری داده، سفارشی‌سازی نمایش گزینه‌ها، هماهنگ‌سازی با فرم، پاک‌سازی انتخاب، و پشتیبانی از جست‌وجوی سمت سرور را نیز داراست.\n *\n * اگر `freeSolo` فعال باشد، می‌توان مقادیر تایپ‌شده را نیز ذخیره کرد. مقدار خروجی معمولاً `key` گزینه انتخاب‌شده است،\n * مگر اینکه کاربر متنی وارد کند که در لیست نباشد (در این صورت می‌توان آن را مستقیم ذخیره کرد).\n *\n * برای سفارشی‌سازی گزینه‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={option.key}>\n * <b>{option.title}</b>\n * </li>\n * )}\n * ```\n */\n\nexport default function SearchableSelector<T extends BaseOption = BaseOption>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n onChangeHandler,\n valueHandler,\n onFilterOptions,\n renderOption,\n}: SeacrchableSelectChipProps<T>) {\n const dataOptions =\n data?.map((value: T) => ({\n ...value,\n })) || [];\n\n const [inputValue, setInputValue] = React.useState(\"\");\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const selectedValues = React.useMemo(\n () => dataOptions.find((v) => v?.key == value) ?? null,\n [value, dataOptions]\n );\n\n return (\n <Autocomplete\n freeSolo={true}\n disableClearable={clear || isLoading}\n disabled={disabled}\n disablePortal\n size={size}\n disableCloseOnSelect={false}\n options={dataOptions}\n inputValue={valueHandler ? valueHandler(value) : inputValue}\n onInputChange={(_, newInput, reason) => {\n reason == \"input\" && onChange(null);\n // وقتی کاربر داره تایپ می‌کنه یا پاک می‌کنه\n setInputValue(newInput);\n onFilterOptions(newInput);\n }}\n sx={{\n width: \"100%\",\n }}\n noOptionsText=\"داده ای برای نمایش وجود ندارد\"\n value={selectedValues}\n onChange={(e, value) => {\n // ۱) اگر کاربر یک رشته تایپ‌شده (freeSolo) انتخاب کرده\n if (typeof value === \"string\") {\n // می‌تونیم key رو هم با خود رشته‌ی ورودی برابر بگیریم،\n // یا اگر نمی‌خواید freeSolo ذخیره کنید، اینجا onChange(null) بزنید\n onChange(value as any); // یا onChange(null) بسته به نیاز\n setInputValue(value);\n }\n // ۲) اگر گزینه‌ی منظم انتخاب شده\n else if (value && typeof value === \"object\") {\n onChangeHandler\n ? onChangeHandler(value, onChange)\n : onChange(value.key);\n setInputValue(String(value.title));\n }\n // ۳) حالت پاک کردن\n else {\n onChange(null);\n setInputValue(\"\");\n }\n }}\n getOptionLabel={(option) => {\n if (typeof option === \"string\") return option;\n if (option?.title) return String(option.title);\n return \"\";\n }}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }} // New API\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"], // Ensures it flips to the top if needed\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n"],"mappings":"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","names":["React","value","Autocomplete","TextField","React","Controller","CircularProgress","Popper","value","CircularProgress","Popper","Autocomplete","TextField","React","Controller","value"]}
1
+ {"version":3,"sources":["../../react-shim.js","../../src/selectors/multi-check-selector/index.tsx","../../src/selectors/multiple-selector/index.tsx","../../src/selectors/searchable-selector/index.tsx"],"sourcesContent":["import * as React from \"react\";\nexport { React };\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { Checkbox, CircularProgress, Popper } from \"@mui/material\";\nimport { FaCheckSquare } from \"react-icons/fa\";\nimport { RiCheckboxBlankLine } from \"react-icons/ri\";\nimport { MdSelectAll } from \"react-icons/md\";\nimport { RiDeleteBin6Line } from \"react-icons/ri\";\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\nexport interface AutocompleteRenderOptionState {\n inputValue: string;\n index: number;\n selected: boolean;\n}\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T,\n state:AutocompleteRenderOptionState\n ) => React.ReactNode;\n}\n/**\n * 📦 MultipleSelector — کامپوننت انتخاب چندگزینه‌ای پیشرفته\n *\n * @component MultipleSelector\n *\n * @template T — نوع داده‌ی گزینه‌ها که باید شامل فیلدهای `title` و `key` باشد.\n *\n * @param {string} name - نام فیلد در فرم (برای ثبت در react-hook-form).\n * @param {Control<any>} control - کنترل فرم از کتابخانه react-hook-form.\n * @param {string} [label] - برچسب ورودی.\n * @param {T[]} [data] - آرایه‌ای از گزینه‌ها که هر کدام باید شامل `title` (نمایش) و `key` (شناسه یکتا) باشد.\n * @param {boolean} [isLoading=false] - حالت لودینگ برای نمایش اسپینر در ورودی.\n * @param {boolean} [disabled=false] - غیرفعال‌کردن ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی MUI Autocomplete.\n * @param {boolean} [clear=false] - اگر `false` باشد، قابلیت پاک کردن کامل (Clearable) غیرفعال می‌شود.\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T, state: AutocompleteRenderOptionState) => React.ReactNode} [renderOption] - تابع سفارشی برای رندر هر آیتم در لیست انتخاب.\n *\n * @description\n * این کامپوننت یک `Autocomplete` چندگزینه‌ای با قابلیت‌های زیر است:\n * - اتصال مستقیم به `react-hook-form` (با استفاده از Controller)\n * - انتخاب همه (`انتخاب همه`) یا پاک کردن همه (`پاک کردن همه`)\n * - نمایش تعداد آیتم‌های انتخاب شده به جای تگ‌های جداگانه\n * - پشتیبانی از حالت لودینگ و غیرفعال بودن\n * - امکان سفارشی‌سازی رندر آیتم‌ها (`renderOption`)\n * - آیکون‌های سفارشی برای انتخاب‌ها و گزینه‌های ویژه\n * - جلوگیری از بستن لیست هنگام انتخاب آیتم‌ها (`disableCloseOnSelect`)\n * - مدیریت موقعیت Popper با MUI modifiers\n *\n * @returns {Array<string | number>} آرایه‌ای از کلیدهای آیتم‌های انتخاب شده.\n *\n * @example\n * ```tsx\n * import { useForm, Controller } from \"react-hook-form\";\n *\n * type MyOption = { title: string; key: number };\n *\n * const options: MyOption[] = [\n * { title: \"محصول ۱\", key: 1 },\n * { title: \"محصول ۲\", key: 2 },\n * ];\n *\n * export default function MyForm() {\n * const { control, handleSubmit } = useForm({ defaultValues: { productIds: [] } });\n *\n * const onSubmit = (data: any) => {\n * console.log(\"انتخاب شده‌ها:\", data.productIds);\n * };\n *\n * return (\n * <form onSubmit={handleSubmit(onSubmit)}>\n * <MultipleSelector<MyOption>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={options}\n * isLoading={false}\n * size=\"small\"\n * renderOption={(props, option, state) => (\n * <li {...props} key={option.key}>\n * <strong style={{ color: state.selected ? \"green\" : \"black\" }}>\n * {option.title}\n * </strong>\n * </li>\n * )}\n * />\n * <button type=\"submit\">ثبت</button>\n * </form>\n * );\n * }\n * ```\n */\nexport default function MultiCheckSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [\n { title: \"انتخاب همه\", key: \"All\" } as T,\n { title: \"پاک کردن همه\", key: \"ClearAll\" } as T,\n ...dataOptions,\n ]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else if (selected.some((item: any) => item.key === \"ClearAll\")) {\n onChange([]);\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n const icon = <RiCheckboxBlankLine size={20} />;\n const checkedIcon = <FaCheckSquare size={20} />;\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n // کنترل باز و بسته شدن آتوکامپلیت\n const autocompleteRef = React.useRef<any>(null);\n const [open, setOpen] = React.useState(false);\n const handleOpen = () => setOpen(true);\n const handleClose = () => setOpen(false);\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n open={open}\n onOpen={handleOpen}\n onClose={handleClose}\n ref={autocompleteRef}\n renderOption={(props, option, state) => { \n if (renderOption) {\n return renderOption(props, option,state);\n }\n // آیکون مناسب برای گزینه‌های انتخاب همه و پاک کردن همه\n let iconElem = null;\n if (option.key === \"All\") {\n iconElem = <MdSelectAll size={18} style={{ marginLeft: 6, color: '#2563eb' }} />;\n } else if (option.key === \"ClearAll\") {\n iconElem = <RiDeleteBin6Line size={18} style={{ marginLeft: 6, color: '#ef4444' }} />;\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n alignItems: \"center\",\n }}\n >\n {option.key === \"All\" || option.key === \"ClearAll\"\n ? iconElem\n : <Checkbox\n icon={icon}\n checkedIcon={checkedIcon}\n style={{ marginLeft: 8 }}\n checked={state.selected}\n sx={{margin:0 , padding:0}}\n />}\n <div style={{ flexDirection: \"row\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n renderTags={(value) => {\n if (value.length === 0) return null;\n const total = dataOptions.length;\n const tagText = value.length === total\n ? `${value.length} مورد انتخاب شده`\n : `${value.length} مورد از ${total} انتخاب شده`;\n return (\n <span\n style={{\n fontWeight: 600,\n fontSize: 15,\n padding: '2px 8px',\n borderRadius: 6,\n margin: '2px 0',\n letterSpacing: 0.2,\n userSelect: 'none',\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n display: 'inline-block',\n cursor: 'pointer',\n }}\n onClick={handleOpen}\n >\n {tagText}\n </span>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n// ...existing code...\n","import Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\nimport { CircularProgress, Popper } from \"@mui/material\";\n\ninterface OptionType {\n title: string;\n key: string | number;\n [x: string]: any; // برای پشتیبانی از فیلدهای اضافی\n}\n\ninterface MultipleSelectChipProps<T extends OptionType> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 📦 کامپوننت انتخاب چند گزینه‌ای با پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component MultipleSelector\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از react-hook-form.\n * @param {{ title: string; key: string | number }[]} [data] - لیستی از گزینه‌ها شامل `title` (متن) و `key` (مقدار).\n * @param {boolean} [isLoading=false] - آیا داده‌ها در حال بارگذاری هستند.\n * @param {boolean} [disabled=false] - غیرفعال‌سازی ورودی.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - سایز ورودی.\n * @param {boolean} [clear=false] - آیا امکان پاک کردن وجود دارد یا نه.\n * @param {string} [tooltip] - متن راهنما هنگام هاور.\n * @param {(props, option) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {Array<{ key: string | number }>} لیستی از آیتم‌های انتخاب‌شده ( فقط آیدی‌ها).\n *\n * @example\n * ```tsx\n * <MultipleSelector<{title:string; key:number;}>\n * name=\"productIds\"\n * label=\"محصولات\"\n * control={control}\n * data={[{ title: \"محصول ۱\", key: 1 }, { title: \"محصول ۲\", key: 2 }]}\n * />\n * ```\n *\n * @description\n * کامپوننتی چندانتخابی با قابلیت انتخاب همه‌ی موارد، سفارشی‌سازی گزینه‌ها،\n * نمایش راهنمای هاور، و بازگرداندن لیست کامل از آبجکت‌های انتخاب‌شده.\n *\n * برای سفارشی‌سازی نحوه نمایش آیتم‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={`${option.key}`}>\n * <span style={{ color: \"green\" }}>{option.title}</span>\n * </li>\n * )}\n * ```\n */\n\nexport default function MultipleSelector<T extends OptionType>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n renderOption,\n}: MultipleSelectChipProps<T>) {\n const dataOptions =\n data?.map((value) => ({\n ...value,\n key: value.key || `key_${Math.random()}`,\n })) || [];\n\n const combinedOptions =\n dataOptions.length > 0\n ? [{ title: \"انتخاب همه\", key: \"All\" } as T, ...dataOptions]\n : [...dataOptions];\n\n const handleChange = (\n _event: any,\n selected: any,\n onChange: (value: any) => void\n ) => {\n if (selected.some((item: any) => item.key === \"All\")) {\n const allItems = [...dataOptions];\n onChange(allItems.map((item) => item.key));\n } else {\n onChange(selected.map((item: any) => item.key));\n }\n };\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const computedValue = React.useMemo(() => {\n if (Array.isArray(value) && dataOptions.length > 0) {\n return dataOptions.filter((option: any) =>\n value.includes(option.key)\n );\n }\n return [];\n }, [value, dataOptions]);\n\n return (\n <Autocomplete\n multiple\n disableClearable={clear}\n disabled={disabled || isLoading}\n size={size}\n disableCloseOnSelect\n options={combinedOptions}\n sx={{ width: \"100%\" }}\n noOptionsText=\"داده‌ای برای نمایش وجود ندارد\"\n value={computedValue}\n onChange={(event, value) =>\n handleChange(event, value as T[], onChange)\n }\n isOptionEqualToValue={(option, value) =>\n String(option.key) === String(value?.key)\n }\n getOptionLabel={(option) => option.title}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }}\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"],\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n","import { CircularProgress, Popper } from \"@mui/material\";\nimport Autocomplete from \"@mui/material/Autocomplete\";\nimport TextField from \"@mui/material/TextField\";\nimport * as React from \"react\";\nimport { Control, Controller } from \"react-hook-form\";\n\ninterface BaseOption {\n key: number | string | \"false\" | true;\n title: string | number;\n [x: string]: any;\n}\n\ninterface SeacrchableSelectChipProps<T extends BaseOption = BaseOption> {\n name: string;\n control: Control<any>;\n label?: string;\n data?: T[];\n isLoading?: boolean;\n disabled?: boolean;\n size?: \"small\" | \"medium\";\n clear?: boolean;\n onChangeHandler?: (value: any, onChange: (data: any) => void) => void;\n valueHandler?: (value: any) => any;\n onFilterOptions: (inputValue: string) => void;\n renderOption?: (\n props: React.HTMLAttributes<HTMLLIElement>,\n option: T\n ) => React.ReactNode;\n}\n/**\n * 🔍 کامپوننت انتخاب تکی با قابلیت جست‌وجو، پشتیبانی از react-hook-form و MUI Autocomplete\n *\n * @component SeacrchableSelector\n *\n * @template T - نوع گزینه‌ها که باید شامل `key` و `title` باشد.\n *\n * @param {string} name - نام فیلدی که در فرم ثبت می‌شود.\n * @param {string} [label] - برچسب نمایشی برای فیلد.\n * @param {Control<any>} control - کنترل فرم از `react-hook-form`.\n * @param {T[]} [data] - لیستی از گزینه‌ها شامل `key` و `title` به عنوان مقدار و متن نمایشی.\n * @param {boolean} [isLoading=false] - وضعیت بارگذاری (مثلاً هنگام فراخوانی API).\n * @param {boolean} [disabled=false] - غیرفعال بودن فیلد.\n * @param {\"small\" | \"medium\"} [size=\"medium\"] - اندازه ورودی.\n * @param {boolean} [clear=false] - فعال بودن امکان پاک‌کردن مقدار انتخاب‌شده.\n * @param {(value: any, onChange: (data: any) => void) => void} [onChangeHandler] - تابع هندل انتخاب گزینه (در صورت نیاز به کنترل خارجی).\n * @param {(value: any) => string} [valueHandler] - تابع تبدیل مقدار ذخیره‌شده در فرم به مقدار نمایشی در input (مثلاً عنوان).\n * @param {(inputValue: string) => void} [onFilterOptions] - تابعی برای هندل کردن فیلتر شدن داده‌ها هنگام تایپ کاربر (مثلاً برای fetch کردن).\n * @param {(props: React.HTMLAttributes<HTMLLIElement>, option: T) => React.ReactNode} [renderOption] - تابعی سفارشی برای رندر آیتم‌ها در لیست.\n *\n * @returns {string | number | null} مقدار انتخاب‌شده (کلید گزینه یا null)\n *\n * @example\n * ```tsx\n * <SeacrchableSelector<{ title: string; key: number }>\n * name=\"categoryId\"\n * label=\"دسته‌بندی\"\n * control={control}\n * data={[{ title: \"کتاب\", key: 1 }, { title: \"لوازم تحریر\", key: 2 }]}\n * onFilterOptions={(input) => fetchUsers(input)}\n * />\n * ```\n *\n * @description\n * این کامپوننت یک ورودی انتخاب‌گر تکی با قابلیت جست‌وجو و پشتیبانی از مقدار دلخواه کاربر (`freeSolo`) است.\n * قابلیت‌هایی مانند بارگذاری داده، سفارشی‌سازی نمایش گزینه‌ها، هماهنگ‌سازی با فرم، پاک‌سازی انتخاب، و پشتیبانی از جست‌وجوی سمت سرور را نیز داراست.\n *\n * اگر `freeSolo` فعال باشد، می‌توان مقادیر تایپ‌شده را نیز ذخیره کرد. مقدار خروجی معمولاً `key` گزینه انتخاب‌شده است،\n * مگر اینکه کاربر متنی وارد کند که در لیست نباشد (در این صورت می‌توان آن را مستقیم ذخیره کرد).\n *\n * برای سفارشی‌سازی گزینه‌ها:\n * ```tsx\n * renderOption={(props, option) => (\n * <li {...props} key={option.key}>\n * <b>{option.title}</b>\n * </li>\n * )}\n * ```\n */\n\nexport default function SearchableSelector<T extends BaseOption = BaseOption>({\n name,\n control,\n label,\n data,\n isLoading,\n disabled = false,\n size = \"medium\",\n clear = false,\n onChangeHandler,\n valueHandler,\n onFilterOptions,\n renderOption,\n}: SeacrchableSelectChipProps<T>) {\n const dataOptions =\n data?.map((value: T) => ({\n ...value,\n })) || [];\n\n const [inputValue, setInputValue] = React.useState(\"\");\n\n return (\n <Controller\n name={name}\n control={control}\n render={({ field: { onChange, value, ref }, fieldState: { error } }) => {\n const selectedValues = React.useMemo(\n () => dataOptions.find((v) => v?.key == value) ?? null,\n [value, dataOptions]\n );\n\n return (\n <Autocomplete\n freeSolo={true}\n disableClearable={clear || isLoading}\n disabled={disabled}\n disablePortal\n size={size}\n disableCloseOnSelect={false}\n options={dataOptions}\n inputValue={valueHandler ? valueHandler(value) : inputValue}\n onInputChange={(_, newInput, reason) => {\n reason == \"input\" && onChange(null);\n // وقتی کاربر داره تایپ می‌کنه یا پاک می‌کنه\n setInputValue(newInput);\n onFilterOptions(newInput);\n }}\n sx={{\n width: \"100%\",\n }}\n noOptionsText=\"داده ای برای نمایش وجود ندارد\"\n value={selectedValues}\n onChange={(e, value) => {\n // ۱) اگر کاربر یک رشته تایپ‌شده (freeSolo) انتخاب کرده\n if (typeof value === \"string\") {\n // می‌تونیم key رو هم با خود رشته‌ی ورودی برابر بگیریم،\n // یا اگر نمی‌خواید freeSolo ذخیره کنید، اینجا onChange(null) بزنید\n onChange(value as any); // یا onChange(null) بسته به نیاز\n setInputValue(value);\n }\n // ۲) اگر گزینه‌ی منظم انتخاب شده\n else if (value && typeof value === \"object\") {\n onChangeHandler\n ? onChangeHandler(value, onChange)\n : onChange(value.key);\n setInputValue(String(value.title));\n }\n // ۳) حالت پاک کردن\n else {\n onChange(null);\n setInputValue(\"\");\n }\n }}\n getOptionLabel={(option) => {\n if (typeof option === \"string\") return option;\n if (option?.title) return String(option.title);\n return \"\";\n }}\n loading={isLoading}\n loadingText=\"در حال بارگذاری...\"\n renderOption={(props, option) => {\n if (renderOption) {\n return renderOption(props, option);\n }\n return (\n <li\n {...props}\n key={`${option.key}`}\n style={{ margin: 5, borderRadius: 3 }}\n >\n <div\n style={{\n display: \"flex\",\n flexDirection: \"row\",\n width: \"100%\",\n }}\n >\n <div style={{ flexDirection: \"column\", width: \"100%\" }}>\n <div style={{ fontWeight: \"normal\" }}>{option.title}</div>\n </div>\n </div>\n </li>\n );\n }}\n slots={{ popper: Popper }} // New API\n slotProps={{\n popper: {\n modifiers: [\n {\n name: \"preventOverflow\",\n options: {\n boundary: \"window\",\n rootBoundary: \"viewport\",\n altBoundary: true,\n padding: 10,\n },\n },\n {\n name: \"flip\",\n options: {\n fallbackPlacements: [\"top\", \"bottom\"], // Ensures it flips to the top if needed\n },\n },\n ],\n },\n }}\n renderInput={(params) => (\n <TextField\n {...params}\n label={label}\n error={!!error}\n helperText={error?.message}\n inputRef={ref}\n InputProps={{\n ...params.InputProps,\n endAdornment: (\n <React.Fragment>\n {isLoading ? (\n <CircularProgress color=\"primary\" size={20} />\n ) : null}\n {params.InputProps.endAdornment}\n </React.Fragment>\n ),\n }}\n />\n )}\n />\n );\n }}\n />\n );\n}\n"],"mappings":"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","names":["React","value","Autocomplete","TextField","React","Controller","CircularProgress","Popper","value","CircularProgress","Popper","Autocomplete","TextField","React","Controller","value"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mamrp/components",
3
- "version": "1.0.35",
3
+ "version": "1.0.36",
4
4
  "description": "A comprehensive suite of reusable React components.",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.esm.js",
@@ -35,8 +35,8 @@
35
35
  "@emotion/styled": "^11.14.0",
36
36
  "@hookform/resolvers": "^4.1.3",
37
37
  "@mamrp/icons": "1.0.17",
38
- "@mamrp/layout": "1.1.0",
39
- "@mamrp/utils": "1.0.10",
38
+ "@mamrp/layout": "1.2.2",
39
+ "@mamrp/utils": "1.0.15",
40
40
  "@mui/lab": "6.0.0-beta.28",
41
41
  "@mui/material": "^6.4.6",
42
42
  "@mui/material-nextjs": "^6.4.3",