@cryptlex/web-components 6.6.6-alpha17 → 6.6.6-alpha20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/badge.js +1 -1
- package/dist/components/badge.js.map +1 -1
- package/dist/components/calendar.js +1 -1
- package/dist/components/calendar.js.map +1 -1
- package/dist/components/card.js +1 -1
- package/dist/components/card.js.map +1 -1
- package/dist/components/checkbox.d.ts +2 -2
- package/dist/components/checkbox.js +1 -1
- package/dist/components/checkbox.js.map +1 -1
- package/dist/components/data-table-filter.d.ts +1 -1
- package/dist/components/data-table-filter.js +1 -1
- package/dist/components/data-table.js +1 -1
- package/dist/components/data-table.js.map +1 -1
- package/dist/components/date-picker.d.ts +2 -2
- package/dist/components/date-picker.js +1 -1
- package/dist/components/date-picker.js.map +1 -1
- package/dist/components/datefield.d.ts +1 -1
- package/dist/components/datefield.js +1 -1
- package/dist/components/datefield.js.map +1 -1
- package/dist/components/dialog.js +1 -1
- package/dist/components/dialog.js.map +1 -1
- package/dist/components/disclosure.js +1 -1
- package/dist/components/disclosure.js.map +1 -1
- package/dist/components/form.d.ts +91 -0
- package/dist/components/form.js +2 -0
- package/dist/components/form.js.map +1 -0
- package/dist/components/id-search.d.ts +4 -2
- package/dist/components/id-search.js +1 -1
- package/dist/components/id-search.js.map +1 -1
- package/dist/components/list-box.js +1 -1
- package/dist/components/list-box.js.map +1 -1
- package/dist/components/menu.js +1 -1
- package/dist/components/menu.js.map +1 -1
- package/dist/components/multi-select.d.ts +3 -2
- package/dist/components/multi-select.js +1 -1
- package/dist/components/multi-select.js.map +1 -1
- package/dist/components/numberfield.d.ts +2 -2
- package/dist/components/numberfield.js +1 -1
- package/dist/components/numberfield.js.map +1 -1
- package/dist/components/otpfield.js +1 -1
- package/dist/components/otpfield.js.map +1 -1
- package/dist/components/popover.js +1 -1
- package/dist/components/popover.js.map +1 -1
- package/dist/components/searchfield.d.ts +2 -2
- package/dist/components/searchfield.js +1 -1
- package/dist/components/searchfield.js.map +1 -1
- package/dist/components/select-options.js +1 -1
- package/dist/components/select-options.js.map +1 -1
- package/dist/components/select.d.ts +4 -2
- package/dist/components/select.js +1 -1
- package/dist/components/select.js.map +1 -1
- package/dist/components/sidebar.d.ts +10 -0
- package/dist/components/sidebar.js +1 -1
- package/dist/components/sidebar.js.map +1 -1
- package/dist/components/textfield.d.ts +2 -2
- package/dist/components/textfield.js +1 -1
- package/dist/components/textfield.js.map +1 -1
- package/dist/components/toast.js +1 -1
- package/dist/components/toast.js.map +1 -1
- package/dist/utilities/form-hook.js +1 -1
- package/dist/utilities/form-hook.js.map +1 -1
- package/dist/utilities/resources.d.ts +2 -4
- package/dist/utilities/resources.js +1 -1
- package/dist/utilities/resources.js.map +1 -1
- package/lib/index.css +18 -26
- package/package.json +2 -1
- package/dist/components/field.d.ts +0 -22
- package/dist/components/field.js +0 -2
- package/dist/components/field.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select-options.js","sources":["../../lib/components/select-options.tsx"],"sourcesContent":["export type SelectOption = {\n id: string;\n label: React.ReactNode;\n disabled?: boolean;\n};\n\n// TODO, use icons\nexport const LICENSE_TYPE_OPTIONS: SelectOption[] = [\n {\n label: <>Node-locked</>,\n id: 'node-locked',\n },\n {\n label: <>Hosted floating</>,\n id: 'hosted-floating',\n },\n {\n label: <>LexFloatServer</>,\n id: 'on-premise-floating',\n },\n];\n\n/**\n * Creates Unicode flag from a two-letter ISO country code.\n * https://stackoverflow.com/questions/24050671/how-to-put-japan-flag-character-in-a-string\n * @param {string} country — A two-letter ISO country code (case-insensitive).\n * @return {string}\n */\nfunction getCountryFlag(country: string) {\n function getRegionalIndicatorSymbol(letter: string) {\n return String.fromCodePoint(0x1f1e6 - 65 + letter.toUpperCase().charCodeAt(0));\n }\n\n return getRegionalIndicatorSymbol(country[0]) + getRegionalIndicatorSymbol(country[1]);\n}\n\nconst ALL_COUNTRIES: { [key: string]: string } = {\n AF: 'Afghanistan',\n AX: 'Åland Islands',\n AL: 'Albania',\n DZ: 'Algeria',\n AS: 'American Samoa',\n AD: 'Andorra',\n AO: 'Angola',\n AI: 'Anguilla',\n AQ: 'Antarctica',\n AG: 'Antigua and Barbuda',\n AR: 'Argentina',\n AM: 'Armenia',\n AW: 'Aruba',\n AU: 'Australia',\n AT: 'Austria',\n AZ: 'Azerbaijan',\n BS: 'Bahamas',\n BH: 'Bahrain',\n BD: 'Bangladesh',\n BB: 'Barbados',\n BY: 'Belarus',\n BE: 'Belgium',\n BZ: 'Belize',\n BJ: 'Benin',\n BM: 'Bermuda',\n BT: 'Bhutan',\n BO: 'Bolivia (Plurinational State of)',\n BQ: 'Bonaire, Sint Eustatius and Saba',\n BA: 'Bosnia and Herzegovina',\n BW: 'Botswana',\n BV: 'Bouvet Island',\n BR: 'Brazil',\n IO: 'British Indian Ocean Territory',\n BN: 'Brunei Darussalam',\n BG: 'Bulgaria',\n BF: 'Burkina Faso',\n BI: 'Burundi',\n CV: 'Caboe Verde',\n KH: 'Cambodia',\n CM: 'Cameroon',\n CA: 'Canada',\n KY: 'Cayman Islands',\n CF: 'Central African Republic',\n TD: 'Chad',\n CL: 'Chile',\n CN: 'China',\n CX: 'Christmas Island',\n CC: 'Cocos (Keeling) Islands',\n CO: 'Colombia',\n KM: 'Comoros',\n CG: 'Congo',\n CD: 'Congo, Democratic Republic of the',\n CK: 'Cook Islands',\n CR: 'Costa Rica',\n CI: \"Côte d'voire\",\n HR: 'Croatia',\n CU: 'Cuba',\n CW: 'Curaçao',\n CY: 'Cyprus',\n CZ: 'Czechia',\n DK: 'Denmark',\n DJ: 'Djibouti',\n DM: 'Dominica',\n DO: 'Dominican Republic',\n EC: 'Ecuador',\n EG: 'Egypt',\n SV: 'El Salvador',\n GQ: 'Equatorial Guinea',\n ER: 'Eritrea',\n EE: 'Estonia',\n SZ: 'Eswatini',\n ET: 'Ethiopia',\n FK: 'Falkland Islands (Malvinas)',\n FO: 'Faroe Islands',\n FJ: 'Fiji',\n FI: 'Finland',\n FR: 'France',\n GF: 'French Guiana',\n PF: 'French Polynesia',\n TF: 'French Southern Territories',\n GA: 'Gabon',\n GM: 'Gambia',\n GE: 'Georgia',\n DE: 'Germany',\n GH: 'Ghana',\n GI: 'Gibraltar',\n GR: 'Greece',\n GL: 'Greenland',\n GD: 'Grenada',\n GP: 'Guadeloupe',\n GU: 'Guam',\n GT: 'Guatemala',\n GG: 'Guernsey',\n GN: 'Guinea',\n GW: 'Guinea-Bissau',\n GY: 'Guyana',\n HT: 'Haiti',\n HM: 'Heard Island and Mcdonald Islands',\n VA: 'Holy See',\n HN: 'Honduras',\n HK: 'Hong Kong',\n HU: 'Hungary',\n IS: 'Iceland',\n IN: 'India',\n ID: 'Indonesia',\n IR: 'Iran (Islamic Republic of)',\n IQ: 'Iraq',\n IE: 'Ireland',\n IM: 'Isle of Man',\n IL: 'Israel',\n IT: 'Italy',\n JM: 'Jamaica',\n JP: 'Japan',\n JE: 'Jersey',\n JO: 'Jordan',\n KZ: 'Kazakhstan',\n KE: 'Kenya',\n KI: 'Kiribati',\n KP: \"Korea (Democratic People's Republic of)\",\n KR: 'Korea (Republic of)',\n KW: 'Kuwait',\n KG: 'Kyrgyzstan',\n LA: \"Lao People's Democratic Republic\",\n LV: 'Latvia',\n LB: 'Lebanon',\n LS: 'Lesotho',\n LR: 'Liberia',\n LY: 'Libya',\n LI: 'Liechtenstein',\n LT: 'Lithuania',\n LU: 'Luxembourg',\n MO: 'Macao',\n MG: 'Madagascar',\n MW: 'Malawi',\n MY: 'Malaysia',\n MV: 'Maldives',\n ML: 'Mali',\n MT: 'Malta',\n MH: 'Marshall Islands',\n MQ: 'Martinique',\n MR: 'Mauritania',\n MU: 'Mauritius',\n YT: 'Mayotte',\n MX: 'Mexico',\n FM: 'Micronesia (Federated States of)',\n MD: 'Moldova, Republic of',\n MC: 'Monaco',\n MN: 'Mongolia',\n ME: 'Montenegro',\n MS: 'Montserrat',\n MA: 'Morocco',\n MZ: 'Mozambique',\n MM: 'Myanmar',\n NA: 'Namibia',\n NR: 'Nauru',\n NP: 'Nepal',\n NL: 'Netherlands, Kingdom of the',\n NC: 'New Caledonia',\n NZ: 'New Zealand',\n NI: 'Nicaragua',\n NE: 'Niger',\n NG: 'Nigeria',\n NU: 'Niue',\n NF: 'Norfolk Island',\n MK: 'North Macedonia',\n MP: 'Northern Mariana Islands',\n NO: 'Norway',\n OM: 'Oman',\n PK: 'Pakistan',\n PW: 'Palau',\n PS: 'Palestine, State of',\n PA: 'Panama',\n PG: 'Papua New Guinea',\n PY: 'Paraguay',\n PE: 'Peru',\n PH: 'Philippines',\n PN: 'Pitcairn',\n PL: 'Poland',\n PT: 'Portugal',\n PR: 'Puerto Rico',\n QA: 'Qatar',\n RE: 'Réunion',\n RO: 'Romania',\n RU: 'Russian Federation',\n RW: 'Rwanda',\n BL: 'Saint Barthélemy',\n SH: 'Saint Helena, Ascension Island, Tristan da Cunha',\n KN: 'Saint Kitts and Nevis',\n LC: 'Saint Lucia',\n MF: 'Saint Martin (French part)',\n PM: 'Saint Pierre and Miquelon',\n VC: 'Saint Vincent and the Grenadines',\n WS: 'Samoa',\n SM: 'San Marino',\n ST: 'Sao Tome and Principe',\n SA: 'Saudi Arabia',\n SN: 'Senegal',\n RS: 'Serbia',\n SC: 'Seychelles',\n SL: 'Sierra Leone',\n SG: 'Singapore',\n SX: 'Sint Maarten (Dutch part)',\n SK: 'Slovakia',\n SI: 'Slovenia',\n SB: 'Solomon Islands',\n SO: 'Somalia',\n ZA: 'South Africa',\n GS: 'South Georgia and the South Sandwich Islands',\n SS: 'South Sudan',\n ES: 'Spain',\n LK: 'Sri Lanka',\n SD: 'Sudan',\n SR: 'Suriname',\n SJ: 'Svalbard and Jan Mayen',\n SE: 'Sweden',\n CH: 'Switzerland',\n SY: 'Syrian Arab Republic',\n TW: 'Taiwan, Province of China',\n TJ: 'Tajikistan',\n TZ: 'Tanzania, United Republic of',\n TH: 'Thailand',\n TL: 'Timor-Leste',\n TG: 'Togo',\n TK: 'Tokelau',\n TO: 'Tonga',\n TT: 'Trinidad and Tobago',\n TN: 'Tunisia',\n TR: 'Türkiye',\n TM: 'Turkmenistan',\n TC: 'Turks and Caicos Islands',\n TV: 'Tuvalu',\n UG: 'Uganda',\n UA: 'Ukraine',\n AE: 'United Arab Emirates',\n GB: 'United Kingdom of Great Britain and Northern Ireland',\n UM: 'United States Minor Outlying Islands',\n US: 'United States of America',\n UY: 'Uruguay',\n UZ: 'Uzbekistan',\n VU: 'Vanuatu',\n VE: 'Venezuela (Bolivarian Republic of)',\n VN: 'Viet Nam',\n VG: 'Virgin Islands (British)',\n VI: 'Virgin Islands (U.S)',\n WF: 'Wallis and Futuna',\n EH: 'Western Sahara',\n YE: 'Yemen',\n ZM: 'Zambia',\n ZW: 'Zimbabwe',\n};\n\n/** Options for MultiSelect component */\nexport const COUNTRY_OPTIONS: SelectOption[] = Object.entries(ALL_COUNTRIES).map(v => {\n return {\n label: (\n <>\n {getCountryFlag(v[0])} {v[1]}\n </>\n ),\n id: v[0],\n };\n});\n"],"names":["LICENSE_TYPE_OPTIONS","getCountryFlag","country","getRegionalIndicatorSymbol","letter","ALL_COUNTRIES","COUNTRY_OPTIONS","v","jsxs","Fragment"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"select-options.js","sources":["../../lib/components/select-options.tsx"],"sourcesContent":["import { IcHostedFloating, IcLexFloatServer, IcNodeLocked } from './icons';\n\nexport type SelectOption = {\n id: string;\n label: React.ReactNode;\n disabled?: boolean;\n};\n\n// TODO, use icons\nexport const LICENSE_TYPE_OPTIONS: SelectOption[] = [\n {\n label: (\n <>\n Node-locked\n <IcNodeLocked />\n </>\n ),\n id: 'node-locked',\n },\n {\n label: (\n <>\n Hosted floating\n <IcHostedFloating />\n </>\n ),\n id: 'hosted-floating',\n },\n {\n label: (\n <>\n LexFloatServer\n <IcLexFloatServer />\n </>\n ),\n id: 'on-premise-floating',\n },\n];\n\n/**\n * Creates Unicode flag from a two-letter ISO country code.\n * https://stackoverflow.com/questions/24050671/how-to-put-japan-flag-character-in-a-string\n * @param {string} country — A two-letter ISO country code (case-insensitive).\n * @return {string}\n */\nfunction getCountryFlag(country: string) {\n function getRegionalIndicatorSymbol(letter: string) {\n return String.fromCodePoint(0x1f1e6 - 65 + letter.toUpperCase().charCodeAt(0));\n }\n\n return getRegionalIndicatorSymbol(country[0]) + getRegionalIndicatorSymbol(country[1]);\n}\n\nconst ALL_COUNTRIES: { [key: string]: string } = {\n AF: 'Afghanistan',\n AX: 'Åland Islands',\n AL: 'Albania',\n DZ: 'Algeria',\n AS: 'American Samoa',\n AD: 'Andorra',\n AO: 'Angola',\n AI: 'Anguilla',\n AQ: 'Antarctica',\n AG: 'Antigua and Barbuda',\n AR: 'Argentina',\n AM: 'Armenia',\n AW: 'Aruba',\n AU: 'Australia',\n AT: 'Austria',\n AZ: 'Azerbaijan',\n BS: 'Bahamas',\n BH: 'Bahrain',\n BD: 'Bangladesh',\n BB: 'Barbados',\n BY: 'Belarus',\n BE: 'Belgium',\n BZ: 'Belize',\n BJ: 'Benin',\n BM: 'Bermuda',\n BT: 'Bhutan',\n BO: 'Bolivia (Plurinational State of)',\n BQ: 'Bonaire, Sint Eustatius and Saba',\n BA: 'Bosnia and Herzegovina',\n BW: 'Botswana',\n BV: 'Bouvet Island',\n BR: 'Brazil',\n IO: 'British Indian Ocean Territory',\n BN: 'Brunei Darussalam',\n BG: 'Bulgaria',\n BF: 'Burkina Faso',\n BI: 'Burundi',\n CV: 'Caboe Verde',\n KH: 'Cambodia',\n CM: 'Cameroon',\n CA: 'Canada',\n KY: 'Cayman Islands',\n CF: 'Central African Republic',\n TD: 'Chad',\n CL: 'Chile',\n CN: 'China',\n CX: 'Christmas Island',\n CC: 'Cocos (Keeling) Islands',\n CO: 'Colombia',\n KM: 'Comoros',\n CG: 'Congo',\n CD: 'Congo, Democratic Republic of the',\n CK: 'Cook Islands',\n CR: 'Costa Rica',\n CI: \"Côte d'voire\",\n HR: 'Croatia',\n CU: 'Cuba',\n CW: 'Curaçao',\n CY: 'Cyprus',\n CZ: 'Czechia',\n DK: 'Denmark',\n DJ: 'Djibouti',\n DM: 'Dominica',\n DO: 'Dominican Republic',\n EC: 'Ecuador',\n EG: 'Egypt',\n SV: 'El Salvador',\n GQ: 'Equatorial Guinea',\n ER: 'Eritrea',\n EE: 'Estonia',\n SZ: 'Eswatini',\n ET: 'Ethiopia',\n FK: 'Falkland Islands (Malvinas)',\n FO: 'Faroe Islands',\n FJ: 'Fiji',\n FI: 'Finland',\n FR: 'France',\n GF: 'French Guiana',\n PF: 'French Polynesia',\n TF: 'French Southern Territories',\n GA: 'Gabon',\n GM: 'Gambia',\n GE: 'Georgia',\n DE: 'Germany',\n GH: 'Ghana',\n GI: 'Gibraltar',\n GR: 'Greece',\n GL: 'Greenland',\n GD: 'Grenada',\n GP: 'Guadeloupe',\n GU: 'Guam',\n GT: 'Guatemala',\n GG: 'Guernsey',\n GN: 'Guinea',\n GW: 'Guinea-Bissau',\n GY: 'Guyana',\n HT: 'Haiti',\n HM: 'Heard Island and Mcdonald Islands',\n VA: 'Holy See',\n HN: 'Honduras',\n HK: 'Hong Kong',\n HU: 'Hungary',\n IS: 'Iceland',\n IN: 'India',\n ID: 'Indonesia',\n IR: 'Iran (Islamic Republic of)',\n IQ: 'Iraq',\n IE: 'Ireland',\n IM: 'Isle of Man',\n IL: 'Israel',\n IT: 'Italy',\n JM: 'Jamaica',\n JP: 'Japan',\n JE: 'Jersey',\n JO: 'Jordan',\n KZ: 'Kazakhstan',\n KE: 'Kenya',\n KI: 'Kiribati',\n KP: \"Korea (Democratic People's Republic of)\",\n KR: 'Korea (Republic of)',\n KW: 'Kuwait',\n KG: 'Kyrgyzstan',\n LA: \"Lao People's Democratic Republic\",\n LV: 'Latvia',\n LB: 'Lebanon',\n LS: 'Lesotho',\n LR: 'Liberia',\n LY: 'Libya',\n LI: 'Liechtenstein',\n LT: 'Lithuania',\n LU: 'Luxembourg',\n MO: 'Macao',\n MG: 'Madagascar',\n MW: 'Malawi',\n MY: 'Malaysia',\n MV: 'Maldives',\n ML: 'Mali',\n MT: 'Malta',\n MH: 'Marshall Islands',\n MQ: 'Martinique',\n MR: 'Mauritania',\n MU: 'Mauritius',\n YT: 'Mayotte',\n MX: 'Mexico',\n FM: 'Micronesia (Federated States of)',\n MD: 'Moldova, Republic of',\n MC: 'Monaco',\n MN: 'Mongolia',\n ME: 'Montenegro',\n MS: 'Montserrat',\n MA: 'Morocco',\n MZ: 'Mozambique',\n MM: 'Myanmar',\n NA: 'Namibia',\n NR: 'Nauru',\n NP: 'Nepal',\n NL: 'Netherlands, Kingdom of the',\n NC: 'New Caledonia',\n NZ: 'New Zealand',\n NI: 'Nicaragua',\n NE: 'Niger',\n NG: 'Nigeria',\n NU: 'Niue',\n NF: 'Norfolk Island',\n MK: 'North Macedonia',\n MP: 'Northern Mariana Islands',\n NO: 'Norway',\n OM: 'Oman',\n PK: 'Pakistan',\n PW: 'Palau',\n PS: 'Palestine, State of',\n PA: 'Panama',\n PG: 'Papua New Guinea',\n PY: 'Paraguay',\n PE: 'Peru',\n PH: 'Philippines',\n PN: 'Pitcairn',\n PL: 'Poland',\n PT: 'Portugal',\n PR: 'Puerto Rico',\n QA: 'Qatar',\n RE: 'Réunion',\n RO: 'Romania',\n RU: 'Russian Federation',\n RW: 'Rwanda',\n BL: 'Saint Barthélemy',\n SH: 'Saint Helena, Ascension Island, Tristan da Cunha',\n KN: 'Saint Kitts and Nevis',\n LC: 'Saint Lucia',\n MF: 'Saint Martin (French part)',\n PM: 'Saint Pierre and Miquelon',\n VC: 'Saint Vincent and the Grenadines',\n WS: 'Samoa',\n SM: 'San Marino',\n ST: 'Sao Tome and Principe',\n SA: 'Saudi Arabia',\n SN: 'Senegal',\n RS: 'Serbia',\n SC: 'Seychelles',\n SL: 'Sierra Leone',\n SG: 'Singapore',\n SX: 'Sint Maarten (Dutch part)',\n SK: 'Slovakia',\n SI: 'Slovenia',\n SB: 'Solomon Islands',\n SO: 'Somalia',\n ZA: 'South Africa',\n GS: 'South Georgia and the South Sandwich Islands',\n SS: 'South Sudan',\n ES: 'Spain',\n LK: 'Sri Lanka',\n SD: 'Sudan',\n SR: 'Suriname',\n SJ: 'Svalbard and Jan Mayen',\n SE: 'Sweden',\n CH: 'Switzerland',\n SY: 'Syrian Arab Republic',\n TW: 'Taiwan, Province of China',\n TJ: 'Tajikistan',\n TZ: 'Tanzania, United Republic of',\n TH: 'Thailand',\n TL: 'Timor-Leste',\n TG: 'Togo',\n TK: 'Tokelau',\n TO: 'Tonga',\n TT: 'Trinidad and Tobago',\n TN: 'Tunisia',\n TR: 'Türkiye',\n TM: 'Turkmenistan',\n TC: 'Turks and Caicos Islands',\n TV: 'Tuvalu',\n UG: 'Uganda',\n UA: 'Ukraine',\n AE: 'United Arab Emirates',\n GB: 'United Kingdom of Great Britain and Northern Ireland',\n UM: 'United States Minor Outlying Islands',\n US: 'United States of America',\n UY: 'Uruguay',\n UZ: 'Uzbekistan',\n VU: 'Vanuatu',\n VE: 'Venezuela (Bolivarian Republic of)',\n VN: 'Viet Nam',\n VG: 'Virgin Islands (British)',\n VI: 'Virgin Islands (U.S)',\n WF: 'Wallis and Futuna',\n EH: 'Western Sahara',\n YE: 'Yemen',\n ZM: 'Zambia',\n ZW: 'Zimbabwe',\n};\n\n/** Options for MultiSelect component */\nexport const COUNTRY_OPTIONS: SelectOption[] = Object.entries(ALL_COUNTRIES).map(v => {\n return {\n label: (\n <>\n {getCountryFlag(v[0])} {v[1]}\n </>\n ),\n id: v[0],\n };\n});\n"],"names":["LICENSE_TYPE_OPTIONS","jsxs","Fragment","IcNodeLocked","IcHostedFloating","IcLexFloatServer","getCountryFlag","country","getRegionalIndicatorSymbol","letter","ALL_COUNTRIES","COUNTRY_OPTIONS","v"],"mappings":"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"}
|
|
@@ -1,17 +1,19 @@
|
|
|
1
1
|
import { PopoverProps as AriaPopoverProps, SelectProps as AriaSelectProps, SelectValueProps as AriaSelectValueProps } from 'react-aria-components';
|
|
2
|
-
import {
|
|
2
|
+
import { Button } from '../components/button';
|
|
3
3
|
import { SelectOption } from '../components/select-options';
|
|
4
|
+
import { FormFieldProps } from './form';
|
|
4
5
|
import { ListBoxHeader, ListBoxItem } from './list-box';
|
|
5
6
|
export declare const SelectItem: typeof ListBoxItem;
|
|
6
7
|
export declare const SelectHeader: typeof ListBoxHeader;
|
|
7
8
|
export declare const SelectCollection: typeof import('react-aria-components').Collection;
|
|
8
9
|
export declare const SelectValue: <T extends object>({ className, ...props }: AriaSelectValueProps<T>) => import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
export declare function SelectTrigger({ className, children, ...props }: React.ComponentProps<typeof Button>): import("react/jsx-runtime").JSX.Element;
|
|
9
11
|
export declare function SelectPopover({ className, ...props }: AriaPopoverProps): import("react/jsx-runtime").JSX.Element;
|
|
10
12
|
export interface SingleSelectProps<T extends SelectOption> extends Omit<AriaSelectProps<T>, 'children'>, FormFieldProps {
|
|
11
13
|
items: Iterable<T>;
|
|
12
14
|
children: React.ReactNode | ((item: T) => React.ReactNode);
|
|
13
15
|
}
|
|
14
|
-
export declare function SingleSelect<T extends SelectOption>({ label, description, errorMessage, children, className, items, ...props }: SingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
export declare function SingleSelect<T extends SelectOption>({ label, description, errorMessage, children, className, requiredIndicator, items, ...props }: SingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
15
17
|
type TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, 'value' | 'setValue' | 'children'>;
|
|
16
18
|
export declare function TfSingleSelect<T extends SelectOption>({ ...props }: TfSingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;
|
|
17
19
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as o,jsxs as c,Fragment as u}from"react/jsx-runtime";import{Select as
|
|
1
|
+
"use client";import{jsx as o,jsxs as c,Fragment as u}from"react/jsx-runtime";import{Select as f,composeRenderProps as l,SelectValue as g,ListBox as h}from"react-aria-components";import{Button as S}from"./button.js";import{getFieldErrorMessage as x}from"../utilities/form.js";import{useFieldContext as N}from"../utilities/form-context.js";import{classNames as i}from"../utilities/theme.js";import{FormField as B}from"./form.js";import{IcDown as w}from"./icons.js";import{ListBoxItem as b,ListBoxHeader as C,ListBoxCollection as F}from"./list-box.js";import{Popover as L}from"./popover.js";import"class-variance-authority";import"./loader.js";import"clsx";import"react";import"@tanstack/react-form";const v=f,j=b,U=C,W=F,y=({className:r,...t})=>o(g,{className:l(r,e=>i("line-clamp-1 data-[placeholder]:text-muted-foreground","[&>[slot=description]]:hidden",e)),...t});function I({className:r,children:t,...e}){return o(S,{type:"button",...e,className:"justify-between px-2",children:l(t,n=>c(u,{children:[o("span",{className:"inline-flex gap-1",children:n}),o(w,{"aria-hidden":"true"})]}))})}function P({className:r,...t}){return o(L,{className:l(r,e=>i("w-auto min-w-[--trigger-width]",e)),...t})}function V({className:r,...t}){return o(h,{className:l(r,e=>i("overflow-auto p-1 outline-none",e)),...t})}function D({label:r,description:t,errorMessage:e,children:n,className:s,requiredIndicator:a,items:m,...d}){return o(v,{className:l(s,p=>i("group form-field",p)),...d,children:c(B,{label:r,description:t,errorMessage:e,requiredIndicator:a,children:[o(I,{children:o(y,{className:"inline-flex gap-1 items-center"})}),o(P,{children:o(V,{items:m,children:n})})]})})}function X({...r}){const t=N({disabled:r.isDisabled});return o(D,{selectedKey:t.state.value,onSelectionChange:e=>t.handleChange(e.toString()),onBlur:t.handleBlur,errorMessage:x(t),...r,children:e=>o(j,{id:e.id,children:e.label},e.id)})}export{W as SelectCollection,U as SelectHeader,j as SelectItem,P as SelectPopover,I as SelectTrigger,y as SelectValue,D as SingleSelect,X as TfSingleSelect};
|
|
2
2
|
//# sourceMappingURL=select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","sources":["../../lib/components/select.tsx"],"sourcesContent":["'use client';\nimport {\n ListBox as AriaListBox,\n ListBoxProps as AriaListBoxProps,\n PopoverProps as AriaPopoverProps,\n Select as AriaSelect,\n SelectProps as AriaSelectProps,\n SelectValue as AriaSelectValue,\n SelectValueProps as AriaSelectValueProps,\n composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport
|
|
1
|
+
{"version":3,"file":"select.js","sources":["../../lib/components/select.tsx"],"sourcesContent":["'use client';\nimport {\n ListBox as AriaListBox,\n ListBoxProps as AriaListBoxProps,\n PopoverProps as AriaPopoverProps,\n Select as AriaSelect,\n SelectProps as AriaSelectProps,\n SelectValue as AriaSelectValue,\n SelectValueProps as AriaSelectValueProps,\n composeRenderProps,\n} from 'react-aria-components';\n\nimport { Button } from '../components/button';\nimport type { SelectOption } from '../components/select-options';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, type FormFieldProps } from './form';\nimport { IcDown } from './icons';\nimport { ListBoxCollection, ListBoxHeader, ListBoxItem } from './list-box';\nimport { Popover } from './popover';\n\nconst ASelect = AriaSelect;\nexport const SelectItem = ListBoxItem;\nexport const SelectHeader = ListBoxHeader;\nexport const SelectCollection = ListBoxCollection;\n\nexport const SelectValue = <T extends object>({ className, ...props }: AriaSelectValueProps<T>) => (\n <AriaSelectValue\n className={composeRenderProps(className, className =>\n classNames(\n 'line-clamp-1 data-[placeholder]:text-muted-foreground',\n /* Description */\n '[&>[slot=description]]:hidden',\n className\n )\n )}\n {...props}\n />\n);\nexport function SelectTrigger({ className, children, ...props }: React.ComponentProps<typeof Button>) {\n return (\n <Button type=\"button\" {...props} className=\"justify-between px-2\">\n {composeRenderProps(children, children => (\n <>\n <span className=\"inline-flex gap-1\">{children}</span>\n <IcDown aria-hidden=\"true\" />\n </>\n ))}\n </Button>\n );\n}\n\nexport function SelectPopover({ className, ...props }: AriaPopoverProps) {\n return (\n <Popover\n className={composeRenderProps(className, className =>\n classNames('w-auto min-w-[--trigger-width]', className)\n )}\n {...props}\n />\n );\n}\n\nfunction SelectListBox<T extends object>({ className, ...props }: AriaListBoxProps<T>) {\n return (\n <AriaListBox\n className={composeRenderProps(className, className =>\n classNames('overflow-auto p-1 outline-none', className)\n )}\n {...props}\n />\n );\n}\n\nexport interface SingleSelectProps<T extends SelectOption>\n extends Omit<AriaSelectProps<T>, 'children'>,\n FormFieldProps {\n items: Iterable<T>;\n children: React.ReactNode | ((item: T) => React.ReactNode);\n}\n\nexport function SingleSelect<T extends SelectOption>({\n label,\n description,\n errorMessage,\n children,\n className,\n requiredIndicator,\n items,\n ...props\n}: SingleSelectProps<T>) {\n return (\n <ASelect\n className={composeRenderProps(className, className => classNames('group form-field', className))}\n {...props}\n >\n <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n <SelectTrigger>\n <SelectValue className={'inline-flex gap-1 items-center'} />\n </SelectTrigger>\n <SelectPopover>\n <SelectListBox items={items}>{children}</SelectListBox>\n </SelectPopover>\n </FormField>\n </ASelect>\n );\n}\n\ntype TfSingleSelectProps<T extends SelectOption> = Omit<SingleSelectProps<T>, 'value' | 'setValue' | 'children'>;\n\nexport function TfSingleSelect<T extends SelectOption>({ ...props }: TfSingleSelectProps<T>) {\n const field = useFieldContext<string>({ disabled: props.isDisabled });\n\n return (\n <SingleSelect\n selectedKey={field.state.value}\n onSelectionChange={e => field.handleChange(e!.toString())}\n onBlur={field.handleBlur}\n errorMessage={getFieldErrorMessage(field)}\n {...props}\n >\n {item => (\n <SelectItem id={item.id} key={item.id}>\n {item.label}\n </SelectItem>\n )}\n </SingleSelect>\n );\n}\n"],"names":["ASelect","AriaSelect","SelectItem","ListBoxItem","SelectHeader","ListBoxHeader","SelectCollection","ListBoxCollection","SelectValue","className","props","jsx","AriaSelectValue","composeRenderProps","classNames","SelectTrigger","children","Button","jsxs","Fragment","IcDown","SelectPopover","Popover","SelectListBox","AriaListBox","SingleSelect","label","description","errorMessage","requiredIndicator","items","FormField","TfSingleSelect","field","useFieldContext","getFieldErrorMessage","item"],"mappings":"yrBAsBA,MAAMA,EAAUC,EACHC,EAAaC,EACbC,EAAeC,EACfC,EAAmBC,EAEnBC,EAAc,CAAmB,CAAE,UAAAC,EAAW,GAAGC,KAC1DC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACI,wDAEA,gCACAL,CAAA,CACJ,EAEH,GAAGC,CAAA,CACR,EAEG,SAASK,EAAc,CAAE,UAAAN,EAAW,SAAAO,EAAU,GAAGN,GAA8C,CAClG,OACIC,EAACM,EAAA,CAAO,KAAK,SAAU,GAAGP,EAAO,UAAU,uBACtC,SAAAG,EAAmBG,EAAUA,GAC1BE,EAAAC,EAAA,CACI,SAAA,CAAAR,EAAC,OAAA,CAAK,UAAU,oBAAqB,SAAAK,EAAS,EAC9CL,EAACS,EAAA,CAAO,cAAY,MAAA,CAAO,CAAA,CAAA,CAC/B,CACH,CAAA,CACL,CAER,CAEO,SAASC,EAAc,CAAE,UAAAZ,EAAW,GAAGC,GAA2B,CACrE,OACIC,EAACW,EAAA,CACG,UAAWT,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASa,EAAgC,CAAE,UAAAd,EAAW,GAAGC,GAA8B,CACnF,OACIC,EAACa,EAAA,CACG,UAAWX,EAAmBJ,EAAWA,GACrCK,EAAW,iCAAkCL,CAAS,CAAA,EAEzD,GAAGC,CAAA,CAAA,CAGhB,CASO,SAASe,EAAqC,CACjD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAZ,EACA,UAAAP,EACA,kBAAAoB,EACA,MAAAC,EACA,GAAGpB,CACP,EAAyB,CACrB,OACIC,EAACX,EAAA,CACG,UAAWa,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,SAAAQ,EAACa,GAAgB,MAAAL,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAA,CAAAlB,EAACI,EAAA,CACG,SAAAJ,EAACH,EAAA,CAAY,UAAW,iCAAkC,EAC9D,IACCa,EAAA,CACG,SAAAV,EAACY,EAAA,CAAc,MAAAO,EAAe,SAAAd,EAAS,CAAA,CAC3C,CAAA,CAAA,CACJ,CAAA,CAAA,CAGZ,CAIO,SAASgB,EAAuC,CAAE,GAAGtB,GAAiC,CACzF,MAAMuB,EAAQC,EAAwB,CAAE,SAAUxB,EAAM,WAAY,EAEpE,OACIC,EAACc,EAAA,CACG,YAAaQ,EAAM,MAAM,MACzB,kBAAmB,GAAKA,EAAM,aAAa,EAAG,UAAU,EACxD,OAAQA,EAAM,WACd,aAAcE,EAAqBF,CAAK,EACvC,GAAGvB,EAEH,SAAA0B,KACIlC,EAAA,CAAW,GAAIkC,EAAK,GAChB,SAAAA,EAAK,KAAA,EADoBA,EAAK,EAEnC,CAAA,CAAA,CAIhB"}
|
|
@@ -115,4 +115,14 @@ export declare function SidebarMenuSubButton({ isActive, className, ...props }:
|
|
|
115
115
|
* The main content area next to the sidebar
|
|
116
116
|
*/
|
|
117
117
|
export declare function SidebarOutlet({ className, ...props }: React.ComponentProps<'div'>): import("react/jsx-runtime").JSX.Element;
|
|
118
|
+
/**
|
|
119
|
+
*
|
|
120
|
+
* @example Basic usage
|
|
121
|
+
* ```tsx
|
|
122
|
+
* <SidebarOutlet>
|
|
123
|
+
* <SidebarOutletHeader><SidebarTrigger/></SidebarOutletHeader>
|
|
124
|
+
* </SidebarOutlet>
|
|
125
|
+
* ```
|
|
126
|
+
*/
|
|
127
|
+
export declare function SidebarOutletHeader({ className, ...props }: React.ComponentProps<'nav'>): import("react/jsx-runtime").JSX.Element;
|
|
118
128
|
export {};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as
|
|
1
|
+
"use client";import{jsx as a,Fragment as O,jsxs as S}from"react/jsx-runtime";import{createContext as k,use as _,useState as v,useCallback as x,useEffect as I,useMemo as D}from"react";import{Button as T}from"./button.js";import{DialogTrigger as z,DialogOverlay as B,DialogContent as E}from"./dialog.js";import{TooltipTrigger as G,Tooltip as K}from"./tooltip.js";import{classNames as i}from"../utilities/theme.js";import{useIsMobile as L}from"../utilities/use-mobile.js";import{IcMoreHorizontal as R,IcLeft as j,IcRight as A}from"./icons.js";import"class-variance-authority";import"react-aria-components";import"./loader.js";import"clsx";import"./popover.js";const H="/",N=k(null);function h(){const e=_(N);if(!e)throw new Error("useSidebar must be used within a SidebarProvider.");return e}function te({defaultOpen:e=!0,open:t,onOpenChange:n,className:l,style:s,children:r,...d}){const u=L(),[p,b]=v(!1),[M,y]=v(e),f=t??M,m=x(o=>{const c=typeof o=="function"?o(f):o;n?n(c):y(c)},[n,f]),g=x(()=>u?b(o=>!o):m(o=>!o),[u,m,b]);I(()=>{const o=c=>{c.key===H&&(c.metaKey||c.ctrlKey)&&(c.preventDefault(),g())};return window.addEventListener("keydown",o),()=>window.removeEventListener("keydown",o)},[g]);const w=f?"expanded":"collapsed",C=D(()=>({state:w,open:f,setOpen:m,isMobile:u,openMobile:p,setOpenMobile:b,toggleSidebar:g}),[w,f,m,u,p,b,g]);return a(N.Provider,{value:C,children:a("div",{className:i("group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-elevation-1",l),...d,children:r})})}function ae({side:e="left",variant:t="sidebar",collapsible:n="offcanvas",className:l,children:s,...r}){const{isMobile:d,state:u,openMobile:p,setOpenMobile:b}=h();return n==="none"?a("div",{className:i("flex h-full w-[--sidebar-width] flex-col bg-elevation-1 text-foreground",l),...r,children:s}):d?a(z,{isOpen:p,onOpenChange:b,...r,children:a(B,{children:a(E,{"data-sidebar":"sidebar","data-mobile":"true",className:"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden",side:"left",children:()=>a(O,{children:s})})})}):S("div",{className:"group peer hidden text-foreground md:block","data-state":u,"data-collapsible":u==="collapsed"?n:"","data-variant":t,"data-side":e,children:[a("div",{className:i("relative w-(--sidebar-width) bg-elevation-1 transition-[width] duration-200 ease-linear","group-data-[collapsible=offcanvas]:w-0","group-data-[side=right]:rotate-180",t==="floating"?"group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon]")}),a("div",{className:i("absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex",e==="left"?"left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]":"right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",t==="floating"?"group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]":"group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",l),...r,children:a("div",{"data-sidebar":"sidebar",className:"flex h-full w-full flex-col bg-elevation-1 group-data-[variant=floating]:border group-data-[variant=floating]:border-border",children:s})})]})}function ie({className:e,onClick:t,...n}){const{toggleSidebar:l,open:s,isMobile:r}=h();return a(T,{"data-sidebar":"trigger",variant:"neutral",size:"icon",className:"rounded-full",onClick:d=>{t?.(d),l()},...n,children:r?a(R,{}):s?a(j,{}):a(A,{})})}function ne({className:e,...t}){return a("div",{"data-sidebar":"content",className:i("flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",e),...t})}function oe({className:e,...t}){return a("div",{"data-sidebar":"group",className:i("relative flex w-full min-w-0 flex-col",e),...t})}function re({className:e,...t}){return a("div",{"data-sidebar":"group-label",className:i("flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0","group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0",e),...t})}function le({className:e,...t}){return a("div",{"data-sidebar":"group-content",className:i("w-full body-sm",e),...t})}function se({className:e,...t}){return a("ul",{"data-sidebar":"menu",className:i("flex w-full min-w-0 flex-col",e),...t})}function de({className:e,...t}){return a("li",{"data-sidebar":"menu-item",className:i("group/menu-item relative list-none",e),...t})}function ue({className:e,...t}){return a("button",{"data-sidebar":"menu-action",className:i("absolute top-0 right-0 btn btn-ghost h-input","group-data-[collapsible=icon]:hidden",e),...t})}function ce({className:e,number:t,...n}){return a("div",{"data-sidebar":"menu-badge",className:i("absolute pointer-events-none top-0 right-0 font-300 h-input select-none flex items-center justify-center body-sm tabular-nums","group-data-[collapsible=icon]:hidden",e),...n,children:new Intl.NumberFormat(navigator.language,{useGrouping:!0}).format(t)})}function be({className:e,...t}){return a("ul",{"data-sidebar":"menu-sub",className:i("ms-2 flex min-w-0 flex-col border-l border-border","group-data-[collapsible=icon]:hidden",e),...t})}function fe({className:e,...t}){return a("li",{className:i("list-none ms-0",e),...t})}function pe({isActive:e=!1,tooltip:t,className:n,...l}){const{isMobile:s,state:r}=h(),d=a("button",{"data-sidebar":"menu-button",...e&&{"data-selected":!0},className:i("peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ","btn-tab w-full",n),...l});return t?S(G,{children:[d,a(K,{hidden:r!=="collapsed"||s,...t})]}):d}function me({isActive:e,className:t,...n}){return a("button",{"data-sidebar":"menu-sub-button","data-active":e,className:i("group-data-[collapsible=icon]:hidden","btn-tab w-full",t),...n})}function ge({className:e,...t}){return a("div",{className:i(e,"w-full overflow-auto"),...t})}function he({className:e,...t}){return a("nav",{className:i("flex items-center h-header bg-glass-1 sticky top-0 z-50 p-2 border-b",e),...t})}export{ae as Sidebar,ne as SidebarContent,N as SidebarContext,oe as SidebarGroup,le as SidebarGroupContent,re as SidebarGroupLabel,se as SidebarMenu,ue as SidebarMenuAction,ce as SidebarMenuBadge,pe as SidebarMenuButton,de as SidebarMenuItem,be as SidebarMenuSub,me as SidebarMenuSubButton,fe as SidebarMenuSubItem,ge as SidebarOutlet,he as SidebarOutletHeader,te as SidebarProvider,ie as SidebarTrigger,h as useSidebar};
|
|
2
2
|
//# sourceMappingURL=sidebar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"sidebar.js","sources":["../../lib/components/sidebar.tsx"],"sourcesContent":["'use client';\nimport { createContext, use, useCallback, useEffect, useMemo, useState } from 'react';\nimport { Button } from '../components/button';\nimport { DialogContent, DialogOverlay, DialogTrigger } from '../components/dialog';\nimport { Tooltip, TooltipTrigger } from '../components/tooltip';\nimport { classNames } from '../utilities/theme';\nimport { useIsMobile } from '../utilities/use-mobile';\nimport { IcLeft, IcRight } from './icons';\n\nconst SIDEBAR_KEYBOARD_SHORTCUT = '/';\n\ntype SidebarContextProps = {\n state: 'expanded' | 'collapsed';\n open: boolean;\n setOpen: (open: boolean) => void;\n openMobile: boolean;\n setOpenMobile: (open: boolean) => void;\n isMobile: boolean;\n toggleSidebar: () => void;\n};\n\nexport const SidebarContext = createContext<SidebarContextProps | null>(null);\n\n/**\n * Get the current sidebar state and controls. Must be inside SidebarProvider.\n * @throws When used outside of SidebarProvider\n */\nexport function useSidebar() {\n const context = use(SidebarContext);\n if (!context) {\n throw new Error('useSidebar must be used within a SidebarProvider.');\n }\n\n return context;\n}\n\n/**\n * Wraps your app layout and manages sidebar state. Handles keyboard shortcuts (Cmd/Ctrl + /)\n * and mobile vs desktop behavior.\n *\n * @example\n * <SidebarProvider>\n * <Sidebar>...</Sidebar>\n * <SidebarOutlet>\n * <main>Your app content</main>\n * </SidebarOutlet>\n * </SidebarProvider>\n */\nexport function SidebarProvider({\n defaultOpen = true,\n open: openProp,\n onOpenChange: setOpenProp,\n className,\n style,\n children,\n ...props\n}: React.ComponentProps<'div'> & {\n /** Initial open state. Defaults to true */\n defaultOpen?: boolean;\n /** Control the open state yourself */\n open?: boolean;\n /** Callback when sidebar opens/closes */\n onOpenChange?: (open: boolean) => void;\n}) {\n const isMobile = useIsMobile();\n const [openMobile, setOpenMobile] = useState(false);\n\n // This is the internal state of the sidebar.\n // We use openProp and setOpenProp for control from outside the component.\n const [_open, _setOpen] = useState(defaultOpen);\n const open = openProp ?? _open;\n const setOpen = useCallback(\n (value: boolean | ((value: boolean) => boolean)) => {\n const openState = typeof value === 'function' ? value(open) : value;\n if (setOpenProp) {\n setOpenProp(openState);\n } else {\n _setOpen(openState);\n }\n },\n [setOpenProp, open]\n );\n\n // Helper to toggle the sidebar.\n const toggleSidebar = useCallback(() => {\n return isMobile ? setOpenMobile(open => !open) : setOpen(open => !open);\n }, [isMobile, setOpen, setOpenMobile]);\n\n // Adds a keyboard shortcut to toggle the sidebar.\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {\n event.preventDefault();\n toggleSidebar();\n }\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [toggleSidebar]);\n\n // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n // This makes it easier to style the sidebar with Tailwind classes.\n const state = open ? 'expanded' : 'collapsed';\n\n const contextValue = useMemo<SidebarContextProps>(\n () => ({\n state,\n open,\n setOpen,\n isMobile,\n openMobile,\n setOpenMobile,\n toggleSidebar,\n }),\n [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]\n );\n\n return (\n <SidebarContext.Provider value={contextValue}>\n <div\n className={classNames(\n 'group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-sidebar-background',\n className\n )}\n {...props}\n >\n {children}\n </div>\n </SidebarContext.Provider>\n );\n}\n\n/**\n * The actual sidebar panel. On mobile it becomes a modal dialog.\n */\nexport function Sidebar({\n side = 'left',\n variant = 'sidebar',\n collapsible = 'offcanvas',\n className,\n children,\n ...props\n}: React.ComponentProps<'div'> & {\n /** Where to dock the sidebar. Default: left */\n side?: 'left' | 'right';\n /** Style variant. Default: sidebar */\n variant?: 'sidebar' | 'floating';\n /** How it collapses. Default: offcanvas */\n collapsible?: 'offcanvas' | 'icon' | 'none';\n}) {\n const { isMobile, state, openMobile, setOpenMobile } = useSidebar();\n\n if (collapsible === 'none') {\n return (\n <div\n className={classNames(\n 'flex h-full w-[--sidebar-width] flex-col bg-sidebar-background text-sidebar-foreground',\n className\n )}\n {...props}\n >\n {children}\n </div>\n );\n }\n\n if (isMobile) {\n return (\n <DialogTrigger isOpen={openMobile} onOpenChange={setOpenMobile} {...props}>\n <DialogOverlay>\n <DialogContent\n data-sidebar=\"sidebar\"\n data-mobile=\"true\"\n className=\"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden\"\n side=\"left\"\n >\n {() => <>{children}</>}\n </DialogContent>\n </DialogOverlay>\n </DialogTrigger>\n );\n }\n\n return (\n <div\n className=\"group peer hidden text-sidebar-foreground md:block\"\n data-state={state}\n data-collapsible={state === 'collapsed' ? collapsible : ''}\n data-variant={variant}\n data-side={side}\n >\n {/* This is what handles the sidebar gap on desktop */}\n <div\n className={classNames(\n 'relative w-(--sidebar-width) bg-sidebar-background transition-[width] duration-200 ease-linear',\n 'group-data-[collapsible=offcanvas]:w-0',\n 'group-data-[side=right]:rotate-180',\n variant === 'floating'\n ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]'\n : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon]'\n )}\n />\n <div\n className={classNames(\n 'absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n side === 'left'\n ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n // Adjust the padding for floating variant.\n variant === 'floating'\n ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]'\n : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l',\n className\n )}\n {...props}\n >\n <div\n data-sidebar=\"sidebar\"\n className=\"flex h-full w-full flex-col bg-sidebar-background group-data-[variant=floating]:border group-data-[variant=floating]:border-border\"\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n\n/**\n * Button that toggles the sidebar. Shows arrow icons.\n */\nexport function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {\n const { toggleSidebar, open } = useSidebar();\n\n return (\n <Button\n data-sidebar=\"trigger\"\n variant=\"neutral\"\n size=\"icon\"\n className={'rounded-full'}\n onClick={event => {\n onClick?.(event);\n toggleSidebar();\n }}\n {...props}\n >\n {/* Use transition to rotate a single icon */}\n {open ? <IcLeft /> : <IcRight />}\n </Button>\n );\n}\n\n/**\n * Scrollable container for sidebar content\n */\nexport function SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"content\"\n className={classNames(\n 'flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Groups related menu items together\n */\nexport function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"group\"\n className={classNames('relative flex w-full min-w-0 flex-col p-2', className)}\n {...props}\n />\n );\n}\n\n/**\n * Label for a group.\n */\nexport function SidebarGroupLabel({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"group-label\"\n className={classNames(\n 'flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n 'group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Content wrapper for a group\n */\nexport function SidebarGroupContent({ className, ...props }: React.ComponentProps<'div'>) {\n return <div data-sidebar=\"group-content\" className={classNames('w-full body-sm', className)} {...props} />;\n}\n\n/**\n * Container for menu items\n */\nexport function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n return <ul data-sidebar=\"menu\" className={classNames('flex w-full min-w-0 flex-col', className)} {...props} />;\n}\n\n/**\n * Single menu item wrapper\n */\nexport function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n return (\n <li\n data-sidebar=\"menu-item\"\n className={classNames('group/menu-item relative list-none', className)}\n {...props}\n />\n );\n}\n\n/**\n * Extra action button that appears on the right side of menu items\n */\nexport function SidebarMenuAction({\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n /** Only show on hover */\n showOnHover?: boolean;\n}) {\n return (\n <button\n data-sidebar=\"menu-action\"\n className={classNames(\n 'absolute top-0 right-0 btn btn-ghost h-input px-1',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Shows a number badge on menu items. Auto-formats large numbers.\n */\nexport function SidebarMenuBadge({\n className,\n number,\n ...props\n}: Omit<React.ComponentProps<'div'>, 'children'> & {\n /** The count to display */\n number: number | bigint;\n}) {\n return (\n <div\n data-sidebar=\"menu-badge\"\n className={classNames(\n 'absolute pointer-events-none top-0 right-0 font-300 h-input select-none px-2 flex items-center justify-center body-sm tabular-nums',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n >\n {/* Format the number */}\n {new Intl.NumberFormat(navigator.language, { useGrouping: true }).format(number)}\n </div>\n );\n}\n\n/**\n * Nested submenu container\n */\nexport function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n return (\n <ul\n data-sidebar=\"menu-sub\"\n className={classNames(\n 'mx-2 flex min-w-0 flex-col border-l border-border',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Submenu item wrapper\n */\nexport function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<'li'>) {\n return <li className={classNames('list-none ms-0', className)} {...props} />;\n}\n\n// Common interaction logic for SidebarMenuButton and SidebarMenuSubButton\n/**\n * Main menu button. Pass isActive for current page.\n */\nexport function SidebarMenuButton({\n isActive = false,\n tooltip,\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n /** Mark as currently active page */\n isActive?: boolean;\n /** Tooltip when sidebar is collapsed */\n tooltip?: React.ComponentProps<typeof Tooltip>;\n}) {\n const { isMobile, state } = useSidebar();\n\n const button = (\n <button\n data-sidebar=\"menu-button\"\n data-selected={isActive}\n className={classNames(\n 'peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ',\n 'btn-tab w-full',\n className\n )}\n {...props}\n />\n );\n\n if (!tooltip) {\n return button;\n }\n\n return (\n <TooltipTrigger>\n {button}\n <Tooltip hidden={state !== 'collapsed' || isMobile} {...tooltip} />\n </TooltipTrigger>\n );\n}\n\n/**\n * Button for submenu items\n */\nexport function SidebarMenuSubButton({\n isActive,\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n isActive?: boolean;\n}) {\n return (\n <button\n data-sidebar=\"menu-sub-button\"\n data-active={isActive}\n className={classNames(\n '-translate-x-px [&>svg]:text-accent-foreground',\n 'group-data-[collapsible=icon]:hidden',\n 'btn-tab w-full',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * The main content area next to the sidebar\n */\nexport function SidebarOutlet({ className, ...props }: React.ComponentProps<'div'>) {\n return <div className={classNames(className, 'w-full overflow-auto')} {...props} />;\n}\n"],"names":["SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","createContext","useSidebar","context","use","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","useState","_open","_setOpen","open","setOpen","useCallback","value","openState","toggleSidebar","useEffect","handleKeyDown","event","state","contextValue","useMemo","jsx","classNames","Sidebar","side","variant","collapsible","DialogTrigger","DialogOverlay","DialogContent","jsxs","SidebarTrigger","onClick","Button","IcLeft","IcRight","SidebarContent","SidebarGroup","SidebarGroupLabel","SidebarGroupContent","SidebarMenu","SidebarMenuItem","SidebarMenuAction","SidebarMenuBadge","number","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuButton","isActive","tooltip","button","TooltipTrigger","Tooltip","SidebarMenuSubButton","SidebarOutlet"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"sidebar.js","sources":["../../lib/components/sidebar.tsx"],"sourcesContent":["'use client';\nimport { createContext, use, useCallback, useEffect, useMemo, useState } from 'react';\nimport { Button } from '../components/button';\nimport { DialogContent, DialogOverlay, DialogTrigger } from '../components/dialog';\nimport { Tooltip, TooltipTrigger } from '../components/tooltip';\nimport { classNames } from '../utilities/theme';\nimport { useIsMobile } from '../utilities/use-mobile';\nimport { IcLeft, IcMoreHorizontal, IcRight } from './icons';\n\nconst SIDEBAR_KEYBOARD_SHORTCUT = '/';\n\ntype SidebarContextProps = {\n state: 'expanded' | 'collapsed';\n open: boolean;\n setOpen: (open: boolean) => void;\n openMobile: boolean;\n setOpenMobile: (open: boolean) => void;\n isMobile: boolean;\n toggleSidebar: () => void;\n};\n\nexport const SidebarContext = createContext<SidebarContextProps | null>(null);\n\n/**\n * Get the current sidebar state and controls. Must be inside SidebarProvider.\n * @throws When used outside of SidebarProvider\n */\nexport function useSidebar() {\n const context = use(SidebarContext);\n if (!context) {\n throw new Error('useSidebar must be used within a SidebarProvider.');\n }\n\n return context;\n}\n\n/**\n * Wraps your app layout and manages sidebar state. Handles keyboard shortcuts (Cmd/Ctrl + /)\n * and mobile vs desktop behavior.\n *\n * @example\n * <SidebarProvider>\n * <Sidebar>...</Sidebar>\n * <SidebarOutlet>\n * <main>Your app content</main>\n * </SidebarOutlet>\n * </SidebarProvider>\n */\nexport function SidebarProvider({\n defaultOpen = true,\n open: openProp,\n onOpenChange: setOpenProp,\n className,\n style,\n children,\n ...props\n}: React.ComponentProps<'div'> & {\n /** Initial open state. Defaults to true */\n defaultOpen?: boolean;\n /** Control the open state yourself */\n open?: boolean;\n /** Callback when sidebar opens/closes */\n onOpenChange?: (open: boolean) => void;\n}) {\n const isMobile = useIsMobile();\n const [openMobile, setOpenMobile] = useState(false);\n\n // This is the internal state of the sidebar.\n // We use openProp and setOpenProp for control from outside the component.\n const [_open, _setOpen] = useState(defaultOpen);\n const open = openProp ?? _open;\n const setOpen = useCallback(\n (value: boolean | ((value: boolean) => boolean)) => {\n const openState = typeof value === 'function' ? value(open) : value;\n if (setOpenProp) {\n setOpenProp(openState);\n } else {\n _setOpen(openState);\n }\n },\n [setOpenProp, open]\n );\n\n // Helper to toggle the sidebar.\n const toggleSidebar = useCallback(() => {\n return isMobile ? setOpenMobile(open => !open) : setOpen(open => !open);\n }, [isMobile, setOpen, setOpenMobile]);\n\n // Adds a keyboard shortcut to toggle the sidebar.\n useEffect(() => {\n const handleKeyDown = (event: KeyboardEvent) => {\n if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {\n event.preventDefault();\n toggleSidebar();\n }\n };\n\n window.addEventListener('keydown', handleKeyDown);\n return () => window.removeEventListener('keydown', handleKeyDown);\n }, [toggleSidebar]);\n\n // We add a state so that we can do data-state=\"expanded\" or \"collapsed\".\n // This makes it easier to style the sidebar with Tailwind classes.\n const state = open ? 'expanded' : 'collapsed';\n\n const contextValue = useMemo<SidebarContextProps>(\n () => ({\n state,\n open,\n setOpen,\n isMobile,\n openMobile,\n setOpenMobile,\n toggleSidebar,\n }),\n [state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]\n );\n\n return (\n <SidebarContext.Provider value={contextValue}>\n <div\n className={classNames(\n 'group/sidebar-wrapper flex w-full has-[[data-variant=inset]]:bg-elevation-1',\n className\n )}\n {...props}\n >\n {children}\n </div>\n </SidebarContext.Provider>\n );\n}\n\n/**\n * The actual sidebar panel. On mobile it becomes a modal dialog.\n */\nexport function Sidebar({\n side = 'left',\n variant = 'sidebar',\n collapsible = 'offcanvas',\n className,\n children,\n ...props\n}: React.ComponentProps<'div'> & {\n /** Where to dock the sidebar. Default: left */\n side?: 'left' | 'right';\n /** Style variant. Default: sidebar */\n variant?: 'sidebar' | 'floating';\n /** How it collapses. Default: offcanvas */\n collapsible?: 'offcanvas' | 'icon' | 'none';\n}) {\n const { isMobile, state, openMobile, setOpenMobile } = useSidebar();\n\n if (collapsible === 'none') {\n return (\n <div\n className={classNames(\n 'flex h-full w-[--sidebar-width] flex-col bg-elevation-1 text-foreground',\n className\n )}\n {...props}\n >\n {children}\n </div>\n );\n }\n\n if (isMobile) {\n return (\n <DialogTrigger isOpen={openMobile} onOpenChange={setOpenMobile} {...props}>\n <DialogOverlay>\n <DialogContent\n data-sidebar=\"sidebar\"\n data-mobile=\"true\"\n className=\"w-[--sidebar-width] max-h-svh overflow-auto p-0 [&>button]:hidden\"\n side=\"left\"\n >\n {() => <>{children}</>}\n </DialogContent>\n </DialogOverlay>\n </DialogTrigger>\n );\n }\n\n return (\n <div\n className=\"group peer hidden text-foreground md:block\"\n data-state={state}\n data-collapsible={state === 'collapsed' ? collapsible : ''}\n data-variant={variant}\n data-side={side}\n >\n {/* This is what handles the sidebar gap on desktop */}\n <div\n className={classNames(\n 'relative w-(--sidebar-width) bg-elevation-1 transition-[width] duration-200 ease-linear',\n 'group-data-[collapsible=offcanvas]:w-0',\n 'group-data-[side=right]:rotate-180',\n variant === 'floating'\n ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]'\n : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon]'\n )}\n />\n <div\n className={classNames(\n 'absolute z-10 hidden w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',\n side === 'left'\n ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'\n : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',\n // Adjust the padding for floating variant.\n variant === 'floating'\n ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]'\n : 'group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l',\n className\n )}\n {...props}\n >\n <div\n data-sidebar=\"sidebar\"\n className=\"flex h-full w-full flex-col bg-elevation-1 group-data-[variant=floating]:border group-data-[variant=floating]:border-border\"\n >\n {children}\n </div>\n </div>\n </div>\n );\n}\n\n/**\n * Button that toggles the sidebar. Shows arrow icons.\n */\nexport function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>) {\n const { toggleSidebar, open, isMobile } = useSidebar();\n\n return (\n <Button\n data-sidebar=\"trigger\"\n variant=\"neutral\"\n size=\"icon\"\n className={'rounded-full'}\n onClick={event => {\n onClick?.(event);\n toggleSidebar();\n }}\n {...props}\n >\n {/* Use transition to rotate a single icon */}\n {isMobile ? <IcMoreHorizontal /> : open ? <IcLeft /> : <IcRight />}\n </Button>\n );\n}\n\n/**\n * Scrollable container for sidebar content\n */\nexport function SidebarContent({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"content\"\n className={classNames(\n 'flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Groups related menu items together\n */\nexport function SidebarGroup({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"group\"\n className={classNames('relative flex w-full min-w-0 flex-col', className)}\n {...props}\n />\n );\n}\n\n/**\n * Label for a group.\n */\nexport function SidebarGroupLabel({ className, ...props }: React.ComponentProps<'div'>) {\n return (\n <div\n data-sidebar=\"group-label\"\n className={classNames(\n 'flex h-input shrink-0 items-center px-2 body-sm font-medium text-sidebar-foreground/70 outline-none ring-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-icon [&>svg]:shrink-0',\n 'group-data-[collapsible=icon]:-mt-input group-data-[collapsible=icon]:opacity-0',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Content wrapper for a group\n */\nexport function SidebarGroupContent({ className, ...props }: React.ComponentProps<'div'>) {\n return <div data-sidebar=\"group-content\" className={classNames('w-full body-sm', className)} {...props} />;\n}\n\n/**\n * Container for menu items\n */\nexport function SidebarMenu({ className, ...props }: React.ComponentProps<'ul'>) {\n return <ul data-sidebar=\"menu\" className={classNames('flex w-full min-w-0 flex-col', className)} {...props} />;\n}\n\n/**\n * Single menu item wrapper\n */\nexport function SidebarMenuItem({ className, ...props }: React.ComponentProps<'li'>) {\n return (\n <li\n data-sidebar=\"menu-item\"\n className={classNames('group/menu-item relative list-none', className)}\n {...props}\n />\n );\n}\n\n/**\n * Extra action button that appears on the right side of menu items\n */\nexport function SidebarMenuAction({\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n /** Only show on hover */\n showOnHover?: boolean;\n}) {\n return (\n <button\n data-sidebar=\"menu-action\"\n className={classNames(\n 'absolute top-0 right-0 btn btn-ghost h-input',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Shows a number badge on menu items. Auto-formats large numbers.\n */\nexport function SidebarMenuBadge({\n className,\n number,\n ...props\n}: Omit<React.ComponentProps<'div'>, 'children'> & {\n /** The count to display */\n number: number | bigint;\n}) {\n return (\n <div\n data-sidebar=\"menu-badge\"\n className={classNames(\n 'absolute pointer-events-none top-0 right-0 font-300 h-input select-none flex items-center justify-center body-sm tabular-nums',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n >\n {/* Format the number */}\n {new Intl.NumberFormat(navigator.language, { useGrouping: true }).format(number)}\n </div>\n );\n}\n\n/**\n * Nested submenu container\n */\nexport function SidebarMenuSub({ className, ...props }: React.ComponentProps<'ul'>) {\n return (\n <ul\n data-sidebar=\"menu-sub\"\n className={classNames(\n 'ms-2 flex min-w-0 flex-col border-l border-border',\n 'group-data-[collapsible=icon]:hidden',\n className\n )}\n {...props}\n />\n );\n}\n\n/**\n * Submenu item wrapper\n */\nexport function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<'li'>) {\n return <li className={classNames('list-none ms-0', className)} {...props} />;\n}\n\n// Common interaction logic for SidebarMenuButton and SidebarMenuSubButton\n/**\n * Main menu button. Pass isActive for current page.\n */\nexport function SidebarMenuButton({\n isActive = false,\n tooltip,\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n /** Mark as currently active page */\n isActive?: boolean;\n /** Tooltip when sidebar is collapsed */\n tooltip?: React.ComponentProps<typeof Tooltip>;\n}) {\n const { isMobile, state } = useSidebar();\n\n const button = (\n <button\n data-sidebar=\"menu-button\"\n {...(isActive && { 'data-selected': true })}\n className={classNames(\n 'peer/menu-button group-has-[[data-sidebar=menu-action]]/menu-item:pr-input group-data-[collapsible=icon]:!size-icon group-data-[collapsible=icon]:!p-2 ',\n 'btn-tab w-full',\n className\n )}\n {...props}\n />\n );\n\n if (!tooltip) {\n return button;\n }\n\n return (\n <TooltipTrigger>\n {button}\n <Tooltip hidden={state !== 'collapsed' || isMobile} {...tooltip} />\n </TooltipTrigger>\n );\n}\n\n/**\n * Button for submenu items\n */\nexport function SidebarMenuSubButton({\n isActive,\n className,\n ...props\n}: React.ComponentProps<'button'> & {\n isActive?: boolean;\n}) {\n return (\n <button\n data-sidebar=\"menu-sub-button\"\n data-active={isActive}\n className={classNames('group-data-[collapsible=icon]:hidden', 'btn-tab w-full', className)}\n {...props}\n />\n );\n}\n\n/**\n * The main content area next to the sidebar\n */\nexport function SidebarOutlet({ className, ...props }: React.ComponentProps<'div'>) {\n return <div className={classNames(className, 'w-full overflow-auto')} {...props} />;\n}\n\n/**\n *\n * @example Basic usage\n * ```tsx\n * <SidebarOutlet>\n * <SidebarOutletHeader><SidebarTrigger/></SidebarOutletHeader>\n * </SidebarOutlet>\n * ```\n */\nexport function SidebarOutletHeader({ className, ...props }: React.ComponentProps<'nav'>) {\n return (\n <nav\n className={classNames('flex items-center h-header bg-glass-1 sticky top-0 z-50 p-2 border-b', className)}\n {...props}\n />\n );\n}\n"],"names":["SIDEBAR_KEYBOARD_SHORTCUT","SidebarContext","createContext","useSidebar","context","use","SidebarProvider","defaultOpen","openProp","setOpenProp","className","style","children","props","isMobile","useIsMobile","openMobile","setOpenMobile","useState","_open","_setOpen","open","setOpen","useCallback","value","openState","toggleSidebar","useEffect","handleKeyDown","event","state","contextValue","useMemo","jsx","classNames","Sidebar","side","variant","collapsible","DialogTrigger","DialogOverlay","DialogContent","jsxs","SidebarTrigger","onClick","Button","IcMoreHorizontal","IcLeft","IcRight","SidebarContent","SidebarGroup","SidebarGroupLabel","SidebarGroupContent","SidebarMenu","SidebarMenuItem","SidebarMenuAction","SidebarMenuBadge","number","SidebarMenuSub","SidebarMenuSubItem","SidebarMenuButton","isActive","tooltip","button","TooltipTrigger","Tooltip","SidebarMenuSubButton","SidebarOutlet","SidebarOutletHeader"],"mappings":"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"}
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { TextFieldProps as AriaTextFieldProps } from 'react-aria-components';
|
|
2
|
-
import { FormFieldProps } from './
|
|
2
|
+
import { FormFieldProps } from './form';
|
|
3
3
|
export interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {
|
|
4
4
|
textArea?: boolean;
|
|
5
5
|
inputClassName?: string;
|
|
6
6
|
}
|
|
7
|
-
export declare function TextField({ label, description, errorMessage, textArea, className, inputClassName, ...props }: TextFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export declare function TextField({ label, description, errorMessage, textArea, className, inputClassName, requiredIndicator, ...props }: TextFieldProps): import("react/jsx-runtime").JSX.Element;
|
|
8
8
|
export declare function TfTextField({ isDisabled, ...props }: React.ComponentProps<typeof TextField>): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as
|
|
1
|
+
import{jsx as i}from"react/jsx-runtime";import{TextField as c,composeRenderProps as o,TextArea as x,Input as g}from"react-aria-components";import{getFieldErrorMessage as m}from"../utilities/form.js";import{useFieldContext as F}from"../utilities/form-context.js";import{classNames as n}from"../utilities/theme.js";import{FormField as T,fieldGroupVariants as s}from"./form.js";import"@tanstack/react-form";import"react";import"clsx";import"class-variance-authority";import"./icons.js";const h=c;function b({className:r,...t}){return i(g,{className:o(r,e=>n(s(),"file:border-0 file:bg-transparent file:body-sm file:font-medium","disabled-muted","focus-ring",e)),...t})}function N({className:r,...t}){return i(x,{className:o(r,e=>n(s(),"h-full min-h-32",e)),...t})}function A({label:r,description:t,errorMessage:e,textArea:l,className:d,inputClassName:a,requiredIndicator:f,...u}){return i(h,{className:o(d,p=>n("group form-field",p)),...u,children:i(T,{label:r,description:t,errorMessage:e,requiredIndicator:f,children:l?i(N,{className:a}):i(b,{className:a})})})}function R({isDisabled:r,...t}){const e=F({disabled:r});return i(A,{isDisabled:r||e.form.state.isSubmitting,value:e.state.value,id:e.name,name:e.name,onBlur:e.handleBlur,onChange:e.handleChange,isInvalid:!!m(e),errorMessage:m(e),...t})}export{A as TextField,R as TfTextField};
|
|
2
2
|
//# sourceMappingURL=textfield.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n Input as AriaInput,\n InputProps as AriaInputProps,\n TextArea as AriaTextArea,\n TextAreaProps as AriaTextAreaProps,\n TextField as AriaTextField,\n TextFieldProps as AriaTextFieldProps,\n composeRenderProps,\n} from 'react-aria-components';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FormField, type FormFieldProps } from './
|
|
1
|
+
{"version":3,"file":"textfield.js","sources":["../../lib/components/textfield.tsx"],"sourcesContent":["import {\n Input as AriaInput,\n InputProps as AriaInputProps,\n TextArea as AriaTextArea,\n TextAreaProps as AriaTextAreaProps,\n TextField as AriaTextField,\n TextFieldProps as AriaTextFieldProps,\n composeRenderProps,\n} from 'react-aria-components';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { fieldGroupVariants, FormField, type FormFieldProps } from './form';\n\nconst ATextField = AriaTextField;\n\nfunction Input({ className, ...props }: AriaInputProps) {\n return (\n <AriaInput\n className={composeRenderProps(className, className =>\n classNames(\n fieldGroupVariants(),\n 'file:border-0 file:bg-transparent file:body-sm file:font-medium',\n /* Disabled */\n 'disabled-muted',\n /* Focused */\n 'focus-ring',\n className\n )\n )}\n {...props}\n />\n );\n}\n\nfunction TextArea({ className, ...props }: AriaTextAreaProps) {\n return (\n <AriaTextArea\n className={composeRenderProps(className, className =>\n classNames(fieldGroupVariants(), 'h-full min-h-32', className)\n )}\n {...props}\n />\n );\n}\n\nexport interface TextFieldProps extends AriaTextFieldProps, FormFieldProps {\n textArea?: boolean;\n inputClassName?: string;\n}\n\nexport function TextField({\n label,\n description,\n errorMessage,\n textArea,\n className,\n inputClassName,\n requiredIndicator,\n ...props\n}: TextFieldProps) {\n return (\n <ATextField\n className={composeRenderProps(className, className => classNames('group form-field', className))}\n {...props}\n >\n <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n {textArea ? <TextArea className={inputClassName} /> : <Input className={inputClassName} />}\n </FormField>\n </ATextField>\n );\n}\n\nexport function TfTextField({ isDisabled, ...props }: React.ComponentProps<typeof TextField>) {\n const field = useFieldContext<string>({ disabled: isDisabled });\n\n return (\n <TextField\n isDisabled={isDisabled || field.form.state.isSubmitting}\n value={field.state.value}\n id={field.name}\n name={field.name}\n onBlur={field.handleBlur}\n onChange={field.handleChange}\n isInvalid={!!getFieldErrorMessage(field)}\n errorMessage={getFieldErrorMessage(field)}\n {...props}\n />\n );\n}\n"],"names":["ATextField","AriaTextField","Input","className","props","jsx","AriaInput","composeRenderProps","classNames","fieldGroupVariants","TextArea","AriaTextArea","TextField","label","description","errorMessage","textArea","inputClassName","requiredIndicator","FormField","TfTextField","isDisabled","field","useFieldContext","getFieldErrorMessage"],"mappings":"meAcA,MAAMA,EAAaC,EAEnB,SAASC,EAAM,CAAE,UAAAC,EAAW,GAAGC,GAAyB,CACpD,OACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAWA,GACrCK,EACIC,EAAA,EACA,kEAEA,iBAEA,aACAN,CAAA,CACJ,EAEH,GAAGC,CAAA,CAAA,CAGhB,CAEA,SAASM,EAAS,CAAE,UAAAP,EAAW,GAAGC,GAA4B,CAC1D,OACIC,EAACM,EAAA,CACG,UAAWJ,EAAmBJ,EAAWA,GACrCK,EAAWC,EAAA,EAAsB,kBAAmBN,CAAS,CAAA,EAEhE,GAAGC,CAAA,CAAA,CAGhB,CAOO,SAASQ,EAAU,CACtB,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,UAAAb,EACA,eAAAc,EACA,kBAAAC,EACA,GAAGd,CACP,EAAmB,CACf,OACIC,EAACL,EAAA,CACG,UAAWO,EAAmBJ,EAAWA,GAAaK,EAAW,mBAAoBL,CAAS,CAAC,EAC9F,GAAGC,EAEJ,WAACe,EAAA,CAAgB,MAAAN,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAG,EAC9C,WAAWb,EAACK,EAAA,CAAS,UAAWO,EAAgB,IAAMf,EAAA,CAAM,UAAWe,EAAgB,CAAA,CAC5F,CAAA,CAAA,CAGZ,CAEO,SAASG,EAAY,CAAE,WAAAC,EAAY,GAAGjB,GAAiD,CAC1F,MAAMkB,EAAQC,EAAwB,CAAE,SAAUF,EAAY,EAE9D,OACIhB,EAACO,EAAA,CACG,WAAYS,GAAcC,EAAM,KAAK,MAAM,aAC3C,MAAOA,EAAM,MAAM,MACnB,GAAIA,EAAM,KACV,KAAMA,EAAM,KACZ,OAAQA,EAAM,WACd,SAAUA,EAAM,aAChB,UAAW,CAAC,CAACE,EAAqBF,CAAK,EACvC,aAAcE,EAAqBF,CAAK,EACvC,GAAGlB,CAAA,CAAA,CAGhB"}
|
package/dist/components/toast.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as t,jsxs as r}from"react/jsx-runtime";import{UNSTABLE_ToastQueue as a,UNSTABLE_ToastRegion as l,UNSTABLE_Toast as m,UNSTABLE_ToastContent as d}from"react-aria-components";import{flushSync as u}from"react-dom";import{classNames as p}from"../utilities/theme.js";import{alertVariants as f}from"./alert.js";import{Button as h}from"./button.js";import{IcInfo as i,IcCheck as T,IcError as v}from"./icons.js";import"clsx";import"class-variance-authority";import"./loader.js";import"react";const n=new a({wrapUpdate(e){"startViewTransition"in document?document.startViewTransition(()=>{u(e)}):e()}});function _(){return t(l,{queue:n,className:"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2",children:({toast:e})=>t(m,{style:{viewTransitionName:e.key},toast:e,children:r(d,{className:p(f({variant:e.content.variant}),"flex flex-row items-center gap-
|
|
1
|
+
import{jsx as t,jsxs as r}from"react/jsx-runtime";import{UNSTABLE_ToastQueue as a,UNSTABLE_ToastRegion as l,UNSTABLE_Toast as m,UNSTABLE_ToastContent as d}from"react-aria-components";import{flushSync as u}from"react-dom";import{classNames as p}from"../utilities/theme.js";import{alertVariants as f}from"./alert.js";import{Button as h}from"./button.js";import{IcInfo as i,IcCheck as T,IcError as v}from"./icons.js";import"clsx";import"class-variance-authority";import"./loader.js";import"react";const n=new a({wrapUpdate(e){"startViewTransition"in document?document.startViewTransition(()=>{u(e)}):e()}});function _(){return t(l,{queue:n,className:"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2",children:({toast:e})=>t(m,{style:{viewTransitionName:e.key},toast:e,children:r(d,{className:p(f({variant:e.content.variant}),"flex flex-row items-center gap-2 w-full"),children:[t("div",{className:"shrink-0",children:N(e.content.variant)}),r("div",{className:"flex-1 min-w-0",children:[t("p",{slot:"title",children:e.content.title}),e.content.description&&t("p",{slot:"description",children:e.content.description})]}),t(h,{slot:"close",variant:"neutral",children:"Close"})]})})})}function N(e){switch(e){case"destructive":return t(v,{});case"success":return t(T,{});case"muted":return t(i,{});default:return t(i,{})}}function j({title:e,description:o,variant:s,timeout:c}){n.add({title:e,description:o,variant:s},{timeout:c??2e3})}export{_ as ToastProvider,j as toast};
|
|
2
2
|
//# sourceMappingURL=toast.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"toast.js","sources":["../../lib/components/toast.tsx"],"sourcesContent":["import type { VariantProps } from 'class-variance-authority';\nimport {\n UNSTABLE_Toast as AriaToast,\n UNSTABLE_ToastContent as AriaToastContent,\n UNSTABLE_ToastQueue as AriaToastQueue,\n UNSTABLE_ToastRegion as AriaToastRegion,\n} from 'react-aria-components';\nimport { flushSync } from 'react-dom';\nimport { classNames } from '../utilities/theme';\nimport { alertVariants } from './alert';\nimport { Button } from './button';\nimport { IcCheck, IcError, IcInfo } from './icons';\n\nexport interface ToastProps {\n title: string;\n description?: string;\n variant: VariantProps<typeof alertVariants>['variant'];\n action?: () => void;\n timeout?: number;\n}\n\n/**\n * Toast queue.\n * @returns The toast queue.\n */\nconst queue = new AriaToastQueue<ToastProps>({\n wrapUpdate(fn) {\n if ('startViewTransition' in document) {\n document.startViewTransition(() => {\n flushSync(fn);\n });\n } else {\n fn();\n }\n },\n});\n\n/**\n * Toast provider.\n * @returns The toast provider.\n */\nexport function ToastProvider() {\n return (\n <AriaToastRegion queue={queue} className=\"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2\">\n {({ toast }) => (\n <AriaToast style={{ viewTransitionName: toast.key }} toast={toast}>\n <AriaToastContent\n className={classNames(\n alertVariants({ variant: toast.content.variant }),\n 'flex flex-row items-center gap-
|
|
1
|
+
{"version":3,"file":"toast.js","sources":["../../lib/components/toast.tsx"],"sourcesContent":["import type { VariantProps } from 'class-variance-authority';\nimport {\n UNSTABLE_Toast as AriaToast,\n UNSTABLE_ToastContent as AriaToastContent,\n UNSTABLE_ToastQueue as AriaToastQueue,\n UNSTABLE_ToastRegion as AriaToastRegion,\n} from 'react-aria-components';\nimport { flushSync } from 'react-dom';\nimport { classNames } from '../utilities/theme';\nimport { alertVariants } from './alert';\nimport { Button } from './button';\nimport { IcCheck, IcError, IcInfo } from './icons';\n\nexport interface ToastProps {\n title: string;\n description?: string;\n variant: VariantProps<typeof alertVariants>['variant'];\n action?: () => void;\n timeout?: number;\n}\n\n/**\n * Toast queue.\n * @returns The toast queue.\n */\nconst queue = new AriaToastQueue<ToastProps>({\n wrapUpdate(fn) {\n if ('startViewTransition' in document) {\n document.startViewTransition(() => {\n flushSync(fn);\n });\n } else {\n fn();\n }\n },\n});\n\n/**\n * Toast provider.\n * @returns The toast provider.\n */\nexport function ToastProvider() {\n return (\n <AriaToastRegion queue={queue} className=\"fixed z-50 top-4 right-4 flex flex-col-reverse justify-end gap-2\">\n {({ toast }) => (\n <AriaToast style={{ viewTransitionName: toast.key }} toast={toast}>\n <AriaToastContent\n className={classNames(\n alertVariants({ variant: toast.content.variant }),\n 'flex flex-row items-center gap-2 w-full'\n )}\n >\n <div className=\"shrink-0\">{getToastIcon(toast.content.variant)}</div>\n <div className=\"flex-1 min-w-0\">\n <p slot=\"title\">{toast.content.title}</p>\n {toast.content.description && <p slot=\"description\">{toast.content.description}</p>}\n </div>\n <Button slot=\"close\" variant=\"neutral\">\n Close\n </Button>\n </AriaToastContent>\n </AriaToast>\n )}\n </AriaToastRegion>\n );\n}\n\n/**\n * Get the icon for a toast notification.\n * @param variant - The variant of the toast.\n * @returns The icon for the toast.\n */\nfunction getToastIcon(variant: ToastProps['variant']) {\n switch (variant) {\n case 'destructive':\n return <IcError />;\n case 'success':\n return <IcCheck />;\n case 'muted':\n return <IcInfo />;\n default:\n return <IcInfo />;\n }\n}\n\n/**\n * Show a toast notification.\n * @param title - The title of the toast.\n * @param description - The description of the toast.\n * @param variant - The variant of the toast.\n * @param timeout - The timeout of the toast.\n */\nexport function toast({\n title,\n description,\n variant,\n timeout,\n}: {\n title: string;\n description?: string;\n variant: ToastProps['variant'];\n timeout?: number;\n}) {\n queue.add({ title, description, variant }, { timeout: timeout ?? 2000 });\n}\n"],"names":["queue","AriaToastQueue","fn","flushSync","ToastProvider","AriaToastRegion","toast","jsx","AriaToast","jsxs","AriaToastContent","classNames","alertVariants","Button","getToastIcon","variant","IcError","IcCheck","IcInfo","title","description","timeout"],"mappings":"8eAyBA,MAAMA,EAAQ,IAAIC,EAA2B,CACzC,WAAWC,EAAI,CACP,wBAAyB,SACzB,SAAS,oBAAoB,IAAM,CAC/BC,EAAUD,CAAE,CAChB,CAAC,EAEDA,EAAA,CAER,CACJ,CAAC,EAMM,SAASE,GAAgB,CAC5B,SACKC,EAAA,CAAgB,MAAAL,EAAc,UAAU,mEACpC,SAAA,CAAC,CAAE,MAAAM,CAAAA,IACAC,EAACC,EAAA,CAAU,MAAO,CAAE,mBAAoBF,EAAM,GAAA,EAAO,MAAOA,EACxD,SAAAG,EAACC,EAAA,CACG,UAAWC,EACPC,EAAc,CAAE,QAASN,EAAM,QAAQ,QAAS,EAChD,yCAAA,EAGJ,SAAA,CAAAC,EAAC,OAAI,UAAU,WAAY,WAAaD,EAAM,QAAQ,OAAO,EAAE,EAC/DG,EAAC,MAAA,CAAI,UAAU,iBACX,SAAA,CAAAF,EAAC,KAAE,KAAK,QAAS,SAAAD,EAAM,QAAQ,MAAM,EACpCA,EAAM,QAAQ,aAAeC,EAAC,IAAA,CAAE,KAAK,cAAe,SAAAD,EAAM,QAAQ,WAAA,CAAY,CAAA,EACnF,IACCO,EAAA,CAAO,KAAK,QAAQ,QAAQ,UAAU,SAAA,OAAA,CAEvC,CAAA,CAAA,CAAA,EAER,CAAA,CAER,CAER,CAOA,SAASC,EAAaC,EAAgC,CAClD,OAAQA,EAAA,CACJ,IAAK,cACD,SAAQC,EAAA,EAAQ,EACpB,IAAK,UACD,SAAQC,EAAA,EAAQ,EACpB,IAAK,QACD,SAAQC,EAAA,EAAO,EACnB,QACI,SAAQA,EAAA,EAAO,CAAA,CAE3B,CASO,SAASZ,EAAM,CAClB,MAAAa,EACA,YAAAC,EACA,QAAAL,EACA,QAAAM,CACJ,EAKG,CACCrB,EAAM,IAAI,CAAE,MAAAmB,EAAO,YAAAC,EAAa,QAAAL,CAAA,EAAW,CAAE,QAASM,GAAW,IAAM,CAC3E"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"react-aria-components";import"./theme.js";import"clsx";import"../components/loader.js";import"../components/icons.js";import"react";import"../components/
|
|
1
|
+
import{createFormHook as o}from"@tanstack/react-form";import{Button as m}from"../components/button.js";import{TfCheckbox as r}from"../components/checkbox.js";import{TfMultiSelect as t}from"../components/multi-select.js";import{TfNumberField as i}from"../components/numberfield.js";import{TfSingleSelect as p}from"../components/select.js";import{TfTextField as e}from"../components/textfield.js";import{formContext as f,fieldContext as n}from"./form-context.js";import"react/jsx-runtime";import"class-variance-authority";import"react-aria-components";import"./theme.js";import"clsx";import"../components/loader.js";import"../components/icons.js";import"react";import"../components/form.js";import"../components/menu.js";import"../components/list-box.js";import"./form.js";import"../components/popover.js";const{useAppForm:q}=o({fieldComponents:{TfTextField:e,TfNumberField:i,TfMultiSelect:t,TfSingleSelect:p,TfCheckbox:r},formComponents:{Button:m},fieldContext:n,formContext:f});export{q as useAppForm};
|
|
2
2
|
//# sourceMappingURL=form-hook.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"form-hook.js","sources":["../../lib/utilities/form-hook.tsx"],"sourcesContent":["import { createFormHook } from '@tanstack/react-form';\nimport { Button } from '../components/button';\nimport { TfCheckbox } from '../components/checkbox';\nimport { TfMultiSelect } from '../components/multi-select';\nimport { TfNumberField } from '../components/numberfield';\nimport { TfSingleSelect } from '../components/select';\nimport { TfTextField } from '../components/textfield';\nimport { fieldContext, formContext } from '../utilities/form-context';\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\n/**\n * A small builder that wires the form library to the concrete UI components used across the app.\n * `createFormHook` returns a `useAppForm` hook which contains standard wiring and default components for\n * fields and form-level controls.\n *\n * It exports only the `useAppForm` hook. Consumers (forms in codebase) call `useAppForm` to access the form API and default components.\n */\nexport const { useAppForm } = createFormHook({\n fieldComponents: {\n TfTextField,\n TfNumberField,\n TfMultiSelect,\n TfSingleSelect,\n TfCheckbox,\n },\n formComponents: {\n Button,\n },\n fieldContext,\n formContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"
|
|
1
|
+
{"version":3,"file":"form-hook.js","sources":["../../lib/utilities/form-hook.tsx"],"sourcesContent":["import { createFormHook } from '@tanstack/react-form';\nimport { Button } from '../components/button';\nimport { TfCheckbox } from '../components/checkbox';\nimport { TfMultiSelect } from '../components/multi-select';\nimport { TfNumberField } from '../components/numberfield';\nimport { TfSingleSelect } from '../components/select';\nimport { TfTextField } from '../components/textfield';\nimport { fieldContext, formContext } from '../utilities/form-context';\n\n/** Don't put this in the same file as form-context.tsx, this causes circular dependencies. */\n/** TODO, lazy loading when fieldComponents are large */\n/**\n * Builder for form logic and user interfaces\n */\n/**\n * A small builder that wires the form library to the concrete UI components used across the app.\n * `createFormHook` returns a `useAppForm` hook which contains standard wiring and default components for\n * fields and form-level controls.\n *\n * It exports only the `useAppForm` hook. Consumers (forms in codebase) call `useAppForm` to access the form API and default components.\n */\nexport const { useAppForm } = createFormHook({\n fieldComponents: {\n TfTextField,\n TfNumberField,\n TfMultiSelect,\n TfSingleSelect,\n TfCheckbox,\n },\n formComponents: {\n Button,\n },\n fieldContext,\n formContext,\n});\n"],"names":["useAppForm","createFormHook","TfTextField","TfNumberField","TfMultiSelect","TfSingleSelect","TfCheckbox","Button","fieldContext","formContext"],"mappings":"oyBAqBO,KAAM,CAAE,WAAAA,CAAA,EAAeC,EAAe,CACzC,gBAAiB,CACb,YAAAC,EACA,cAAAC,EACA,cAAAC,EACA,eAAAC,EACA,WAAAC,CAAA,EAEJ,eAAgB,CACZ,OAAAC,CAAA,EAEJ,aAAAC,EACA,YAAAC,CACJ,CAAC"}
|
|
@@ -6,16 +6,14 @@ export type ApiFilters<T extends keyof operations> = NonNullable<ApiFilter<T>>;
|
|
|
6
6
|
export type CtxPortals = 'customer-portal' | 'system-portal' | 'reseller-portal' | 'admin-portal';
|
|
7
7
|
/** Resource Name should ALWAYS be in singular form */
|
|
8
8
|
export declare const RESOURCE_NAMES: readonly ["access-token", "account", "activation", "activation-log", "admin-role", "audit-log", "automated-email", "automated-email-event-log", "card", "feature-flag", "invoice", "license", "license-template", "maintenance-policy", "organization", "plan", "product", "product-version", "profile", "release", "release-channel", "release-file", "release-platform", "report", "role", "role-claim", "saml-configuration", "segment", "sending-domain", "setting", "tag", "team-member", "trial", "trial-policy", "user", "user-group", "webhook", "webhook-event-log", "webhook-trigger", "reseller", "oidc-configuration", "organization-claim", "reseller-claim", "tenant-database-cluster", "customer"];
|
|
9
|
-
export type
|
|
10
|
-
export declare const RESOURCE_DEFINITIONS: Record<
|
|
9
|
+
export type CtxResourceName = (typeof RESOURCE_NAMES)[number];
|
|
10
|
+
export declare const RESOURCE_DEFINITIONS: Record<CtxResourceName, string>;
|
|
11
11
|
export declare function ProjectProvider({ projectName, children }: {
|
|
12
12
|
projectName: CtxPortals;
|
|
13
13
|
children: React.ReactNode;
|
|
14
14
|
}): import("react/jsx-runtime").JSX.Element;
|
|
15
15
|
export declare function useProjectName(): CtxPortals;
|
|
16
16
|
export declare function useResourceFormatter(): (resourceName: string) => string;
|
|
17
|
-
export declare const CTX_RESOURCES: readonly ["account", "activation", "automatedEmail", "billingAddress", "entitlementSet", "feature", "featureEntitlement", "featureFlag", "license", "licenseTemplate", "maintenancePolicy", "oidcConfiguration", "oidcRoleMapping", "organization", "paymentMethod", "personalAccessToken", "plan", "product", "productVersion", "release", "releaseChannel", "releaseFile", "releasePlatform", "reseller", "role", "samlConfiguration", "segment", "sendingDomain", "tag", "trialActivation", "trialPolicy", "user", "userGroup", "webhook", "tenantDatabaseCluster", "customer"];
|
|
18
|
-
export type CtxResourceName = (typeof CTX_RESOURCES)[number];
|
|
19
17
|
/**
|
|
20
18
|
* Format multiple license parameters (expired, suspended, revoked) into a single status
|
|
21
19
|
*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsx as s}from"react/jsx-runtime";import{createContext as n,use as i}from"react";import{toTitleCase as l}from"./string.js";import"lodash-es";const
|
|
1
|
+
import{jsx as s}from"react/jsx-runtime";import{createContext as n,use as i}from"react";import{toTitleCase as l}from"./string.js";import"lodash-es";const t={"product.displayName":"Product",product_displayName:"Product"},f=["access-token","account","activation","activation-log","admin-role","audit-log","automated-email","automated-email-event-log","card","feature-flag","invoice","license","license-template","maintenance-policy","organization","plan","product","product-version","profile","release","release-channel","release-file","release-platform","report","role","role-claim","saml-configuration","segment","sending-domain","setting","tag","team-member","trial","trial-policy","user","user-group","webhook","webhook-event-log","webhook-trigger","reseller","oidc-configuration","organization-claim","reseller-claim","tenant-database-cluster","customer"],y={account:"Your organization account.",product:"Products are the software products you want to license",license:"Licenses represent a purchase of your software. These can be linked to customers, and the license key is required to use the product.","access-token":"Access Tokens are used to authenticate your API requests.",activation:"Activations, also known as devices/machines/seats are the devices consuming licenses.","activation-log":"Activation Log is a log entry of activation/deactivation of a particular license.",trial:"Trial/Trial Activation is a device that has activated a trial of your product.","audit-log":"Audit logs contain all the changes made to your account.","automated-email":"Automated Email allow you to send marketing emails based on events on the linked product.","automated-email-event-log":"Automated email event log is the log of all the automated email events for your product.",card:"The payment card for your account.","feature-flag":"Feature flags define features that make up tiers for your products.",invoice:"","license-template":"License templates are a blueprint for the licenses you create for your customers and prevent repetition when creating licenses.","maintenance-policy":"Maintenance policies represent support contracts and can be linked to licenses.",plan:"","product-version":"Product Versions are sets of Feature Flags that define the tiers of your products.","release-channel":"Release channel is the release channel for your product.","release-file":"Release files are files within your created releases.","release-platform":'Release Platforms differentiate the target platform for your release. Common platforms include "Windows", "macOS", and "Linux".',release:"Releases help you to manage different versions of your app, and secure distribute it to licensed users.",report:"Analytics data for your account","role-claim":"",role:"Roles define permissions for your team.","saml-configuration":"",segment:"Sets of filters that can be saved to filter resources.","trial-policy":"Trial policies are templates for creating trials for your products.","webhook-event-log":"Webhook Event Logs are logs of events that have occured on webhooks.","webhook-trigger":"",webhook:"Webhooks are HTTP callbacks which are triggered by specific events.",organization:"",profile:"",setting:"",tag:"Tags allow you to manage your licenses and customers on the dashboard.","team-member":"Team members can access the account based on their roles.",user:"A user refers to your customer whom you want to license your product.","sending-domain":"Allows Cryptlex to send emails on your behalf using your From Email address","admin-role":"Roles that have type admin","user-group":"Groups of users that you can assign licenses to.",reseller:"Resellers allow you to delegate user management to third parties or partners","oidc-configuration":"","organization-claim":"","reseller-claim":"","tenant-database-cluster":"",customer:""},a={id:"ID",createdAt:"Creation Date",scopes:"Permissions",updatedAt:"Last Updated",expiresAt:"Expiration Date",lastSeenAt:"Last Seen",os:"OS",osVersion:"OS Version",key:"License Key",vmName:"VM Name",container:"Container",allowedIpRange:"Allowed IP Range",allowedIpRanges:"Allowed IP Ranges",allowedIpAddresses:"Allowed IP Addresses",disallowedIpAddresses:"Disallowed IP Addresses",allowVmActivation:"Allow VM Activation",disableGeoLocation:"Disable Geolocation","user.id":"User ID",userId:"User",productId:"Product",downloads:"Total Downloads",claims:"Permissions",googleSsoEnabled:"Google Login Enabled",lastAttemptedAt:"Last Attempt Date",url:"URL","trialPolicy.name":"Trial Policy Name","licensePolicy.name":"License Template Name",licensePolicy:"License Template",eventLog:"Audit Log",cc:"CC Recepients",bcc:"BCC Recepients",ipAddress:"IP Address",resellerId:"Reseller",productVersionId:"Product Version",releaseId:"Release",maintenancePolicyId:"Maintenance Policy",webhookId:"Webhook",automatedEmailId:"Automated Email","location.countryName":"Country","location.ipAddress":"IP Address","location.countryCode":"Country",organizationId:"Organization","address.country":"Country","address.addressLine1":"Address Line 1","address.addressLine2":"Address Line 2",responseStatusCode:"HTTP Status Code",resourceId:"Resource ID",Sso:"SAML SSO 2.0","reseller.name":"Reseller",sendingDomain:"Email Sending Domain"};function d(e,o){return o!=="admin-portal"&&e in t?t[e]:e in a?a[e]:l(e)}const r=n("admin-portal");function h({projectName:e,children:o}){return s(r.Provider,{value:e,children:o})}function c(){return i(r)}function v(){const e=c();return o=>d(o,e)}function A(e){const o=e.expiresAt&&new Date(e.expiresAt)<new Date;switch(!0){case(e.revoked&&e.suspended&&o):return"Revoked, Suspended, Expired";case(e.revoked&&e.suspended):return"Revoked, Suspended";case(e.revoked&&o):return"Revoked, Expired";case(e.suspended&&o):return"Suspended, Expired";case e.suspended:return"Suspended";case e.revoked:return"Revoked";case o:return"Expired";default:return"Active"}}const w={windows:"Windows",macos:"macOS",linux:"Linux",ios:"iOS",android:"Android"};export{w as ALL_OS,h as ProjectProvider,y as RESOURCE_DEFINITIONS,f as RESOURCE_NAMES,A as getLicenseStatus,c as useProjectName,v as useResourceFormatter};
|
|
2
2
|
//# sourceMappingURL=resources.js.map
|