@b3-crow/ui-kit 0.0.30 → 0.0.31
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/backgrounds/AnimatedBackground.d.ts.map +1 -0
- package/dist/components/backgrounds/AnimatedBackground.js.map +1 -0
- package/dist/components/backgrounds/Globe.d.ts.map +1 -0
- package/dist/components/backgrounds/Globe.js.map +1 -0
- package/dist/components/backgrounds/GradientBackground.d.ts.map +1 -0
- package/dist/components/backgrounds/GradientBackground.js.map +1 -0
- package/dist/components/{Button.d.ts → buttons/Button.d.ts} +5 -2
- package/dist/components/buttons/Button.d.ts.map +1 -0
- package/dist/components/buttons/Button.js +41 -0
- package/dist/components/buttons/Button.js.map +1 -0
- package/dist/components/buttons/CompanyPageButton.d.ts +10 -0
- package/dist/components/buttons/CompanyPageButton.d.ts.map +1 -0
- package/dist/components/buttons/CompanyPageButton.js +8 -0
- package/dist/components/buttons/CompanyPageButton.js.map +1 -0
- package/dist/components/cards/Card.d.ts.map +1 -0
- package/dist/components/{Card.js → cards/Card.js} +1 -1
- package/dist/components/cards/Card.js.map +1 -0
- package/dist/components/cards/CheckoutSummary.d.ts +38 -0
- package/dist/components/cards/CheckoutSummary.d.ts.map +1 -0
- package/dist/components/cards/CheckoutSummary.js +54 -0
- package/dist/components/cards/CheckoutSummary.js.map +1 -0
- package/dist/components/cards/ConnectionOption.d.ts +13 -0
- package/dist/components/cards/ConnectionOption.d.ts.map +1 -0
- package/dist/components/cards/ConnectionOption.js +22 -0
- package/dist/components/cards/ConnectionOption.js.map +1 -0
- package/dist/components/cards/InvitationDetailsCard.d.ts +8 -0
- package/dist/components/cards/InvitationDetailsCard.d.ts.map +1 -0
- package/dist/components/cards/InvitationDetailsCard.js +5 -0
- package/dist/components/cards/InvitationDetailsCard.js.map +1 -0
- package/dist/components/cards/OrderSummaryCard.d.ts +29 -0
- package/dist/components/cards/OrderSummaryCard.d.ts.map +1 -0
- package/dist/components/cards/OrderSummaryCard.js +8 -0
- package/dist/components/cards/OrderSummaryCard.js.map +1 -0
- package/dist/components/cards/PendingInviteCard.d.ts +26 -0
- package/dist/components/cards/PendingInviteCard.d.ts.map +1 -0
- package/dist/components/cards/PendingInviteCard.js +63 -0
- package/dist/components/cards/PendingInviteCard.js.map +1 -0
- package/dist/components/cards/PlanCard.d.ts +50 -0
- package/dist/components/cards/PlanCard.d.ts.map +1 -0
- package/dist/components/cards/PlanCard.js +40 -0
- package/dist/components/cards/PlanCard.js.map +1 -0
- package/dist/components/cards/RunAgentCard.d.ts +9 -0
- package/dist/components/cards/RunAgentCard.d.ts.map +1 -0
- package/dist/components/cards/RunAgentCard.js +15 -0
- package/dist/components/cards/RunAgentCard.js.map +1 -0
- package/dist/components/cards/SyncStatusCard.d.ts +8 -0
- package/dist/components/cards/SyncStatusCard.d.ts.map +1 -0
- package/dist/components/cards/SyncStatusCard.js +29 -0
- package/dist/components/cards/SyncStatusCard.js.map +1 -0
- package/dist/components/display/CodeBlock.d.ts +10 -0
- package/dist/components/display/CodeBlock.d.ts.map +1 -0
- package/dist/components/display/CodeBlock.js +20 -0
- package/dist/components/display/CodeBlock.js.map +1 -0
- package/dist/components/display/ConnectionStatus.d.ts +8 -0
- package/dist/components/display/ConnectionStatus.d.ts.map +1 -0
- package/dist/components/display/ConnectionStatus.js +5 -0
- package/dist/components/display/ConnectionStatus.js.map +1 -0
- package/dist/components/display/Logo.d.ts +16 -0
- package/dist/components/display/Logo.d.ts.map +1 -0
- package/dist/components/display/Logo.js +43 -0
- package/dist/components/display/Logo.js.map +1 -0
- package/dist/components/display/PackageManagerSelector.d.ts +8 -0
- package/dist/components/display/PackageManagerSelector.d.ts.map +1 -0
- package/dist/components/display/PackageManagerSelector.js +20 -0
- package/dist/components/display/PackageManagerSelector.js.map +1 -0
- package/dist/components/index.d.ts +39 -11
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components/index.js +39 -11
- package/dist/components/index.js.map +1 -1
- package/dist/components/inputs/ApiKeyInput.d.ts +8 -0
- package/dist/components/inputs/ApiKeyInput.d.ts.map +1 -0
- package/dist/components/inputs/ApiKeyInput.js +22 -0
- package/dist/components/inputs/ApiKeyInput.js.map +1 -0
- package/dist/components/inputs/Checkbox.d.ts +11 -0
- package/dist/components/inputs/Checkbox.d.ts.map +1 -0
- package/dist/components/inputs/Checkbox.js +19 -0
- package/dist/components/inputs/Checkbox.js.map +1 -0
- package/dist/components/inputs/EmailTagInput.d.ts +9 -0
- package/dist/components/inputs/EmailTagInput.d.ts.map +1 -0
- package/dist/components/inputs/EmailTagInput.js +61 -0
- package/dist/components/inputs/EmailTagInput.js.map +1 -0
- package/dist/components/inputs/Input.d.ts +16 -0
- package/dist/components/inputs/Input.d.ts.map +1 -0
- package/dist/components/inputs/Input.js +42 -0
- package/dist/components/inputs/Input.js.map +1 -0
- package/dist/components/inputs/InputField.d.ts.map +1 -0
- package/dist/components/{InputField.js → inputs/InputField.js} +1 -1
- package/dist/components/inputs/InputField.js.map +1 -0
- package/dist/components/inputs/NumberStepper.d.ts +15 -0
- package/dist/components/inputs/NumberStepper.d.ts.map +1 -0
- package/dist/components/inputs/NumberStepper.js +49 -0
- package/dist/components/inputs/NumberStepper.js.map +1 -0
- package/dist/components/inputs/PermissionToggle.d.ts +15 -0
- package/dist/components/inputs/PermissionToggle.d.ts.map +1 -0
- package/dist/components/inputs/PermissionToggle.js +18 -0
- package/dist/components/inputs/PermissionToggle.js.map +1 -0
- package/dist/components/inputs/Select.d.ts +24 -0
- package/dist/components/inputs/Select.d.ts.map +1 -0
- package/dist/components/inputs/Select.js +156 -0
- package/dist/components/inputs/Select.js.map +1 -0
- package/dist/components/inputs/TagInput.d.ts +10 -0
- package/dist/components/inputs/TagInput.d.ts.map +1 -0
- package/dist/components/inputs/TagInput.js +20 -0
- package/dist/components/inputs/TagInput.js.map +1 -0
- package/dist/components/inputs/ToggleOption.d.ts +20 -0
- package/dist/components/inputs/ToggleOption.d.ts.map +1 -0
- package/dist/components/inputs/ToggleOption.js +70 -0
- package/dist/components/inputs/ToggleOption.js.map +1 -0
- package/dist/components/layout/Divider.d.ts +11 -0
- package/dist/components/layout/Divider.d.ts.map +1 -0
- package/dist/components/layout/Divider.js +15 -0
- package/dist/components/layout/Divider.js.map +1 -0
- package/dist/components/layout/Footer.d.ts +37 -0
- package/dist/components/layout/Footer.d.ts.map +1 -0
- package/dist/components/layout/Footer.js +49 -0
- package/dist/components/layout/Footer.js.map +1 -0
- package/dist/components/layout/FormSection.d.ts +9 -0
- package/dist/components/layout/FormSection.d.ts.map +1 -0
- package/dist/components/layout/FormSection.js +7 -0
- package/dist/components/layout/FormSection.js.map +1 -0
- package/dist/components/layout/LinkGroup.d.ts +15 -0
- package/dist/components/layout/LinkGroup.d.ts.map +1 -0
- package/dist/components/layout/LinkGroup.js +28 -0
- package/dist/components/layout/LinkGroup.js.map +1 -0
- package/dist/components/layout/Navbar.d.ts +32 -0
- package/dist/components/layout/Navbar.d.ts.map +1 -0
- package/dist/components/layout/Navbar.js +35 -0
- package/dist/components/layout/Navbar.js.map +1 -0
- package/dist/components/layout/PageHeader.d.ts +17 -0
- package/dist/components/layout/PageHeader.d.ts.map +1 -0
- package/dist/components/layout/PageHeader.js +86 -0
- package/dist/components/layout/PageHeader.js.map +1 -0
- package/dist/components/layout/SegmentedControl.d.ts +16 -0
- package/dist/components/layout/SegmentedControl.d.ts.map +1 -0
- package/dist/components/layout/SegmentedControl.js +24 -0
- package/dist/components/layout/SegmentedControl.js.map +1 -0
- package/dist/components/typography/HeroText.d.ts.map +1 -0
- package/dist/components/typography/HeroText.js.map +1 -0
- package/dist/components/typography/SectionLabel.d.ts.map +1 -0
- package/dist/components/typography/SectionLabel.js.map +1 -0
- package/dist/components/typography/Subtitle.d.ts.map +1 -0
- package/dist/components/typography/Subtitle.js.map +1 -0
- package/dist/components/typography/TypewriterText.d.ts.map +1 -0
- package/dist/components/typography/TypewriterText.js.map +1 -0
- package/dist/styles.css +1 -1
- package/package.json +2 -1
- package/dist/components/AnimatedBackground.d.ts.map +0 -1
- package/dist/components/AnimatedBackground.js.map +0 -1
- package/dist/components/Button.d.ts.map +0 -1
- package/dist/components/Button.js +0 -26
- package/dist/components/Button.js.map +0 -1
- package/dist/components/Card.d.ts.map +0 -1
- package/dist/components/Card.js.map +0 -1
- package/dist/components/Globe.d.ts.map +0 -1
- package/dist/components/Globe.js.map +0 -1
- package/dist/components/GradientBackground.d.ts.map +0 -1
- package/dist/components/GradientBackground.js.map +0 -1
- package/dist/components/HeroText.d.ts.map +0 -1
- package/dist/components/HeroText.js.map +0 -1
- package/dist/components/InputField.d.ts.map +0 -1
- package/dist/components/InputField.js.map +0 -1
- package/dist/components/Logo.d.ts +0 -6
- package/dist/components/Logo.d.ts.map +0 -1
- package/dist/components/Logo.js +0 -7
- package/dist/components/Logo.js.map +0 -1
- package/dist/components/SectionLabel.d.ts.map +0 -1
- package/dist/components/SectionLabel.js.map +0 -1
- package/dist/components/Subtitle.d.ts.map +0 -1
- package/dist/components/Subtitle.js.map +0 -1
- package/dist/components/TypewriterText.d.ts.map +0 -1
- package/dist/components/TypewriterText.js.map +0 -1
- /package/dist/components/{AnimatedBackground.d.ts → backgrounds/AnimatedBackground.d.ts} +0 -0
- /package/dist/components/{AnimatedBackground.js → backgrounds/AnimatedBackground.js} +0 -0
- /package/dist/components/{Globe.d.ts → backgrounds/Globe.d.ts} +0 -0
- /package/dist/components/{Globe.js → backgrounds/Globe.js} +0 -0
- /package/dist/components/{GradientBackground.d.ts → backgrounds/GradientBackground.d.ts} +0 -0
- /package/dist/components/{GradientBackground.js → backgrounds/GradientBackground.js} +0 -0
- /package/dist/components/{Card.d.ts → cards/Card.d.ts} +0 -0
- /package/dist/components/{InputField.d.ts → inputs/InputField.d.ts} +0 -0
- /package/dist/components/{HeroText.d.ts → typography/HeroText.d.ts} +0 -0
- /package/dist/components/{HeroText.js → typography/HeroText.js} +0 -0
- /package/dist/components/{SectionLabel.d.ts → typography/SectionLabel.d.ts} +0 -0
- /package/dist/components/{SectionLabel.js → typography/SectionLabel.js} +0 -0
- /package/dist/components/{Subtitle.d.ts → typography/Subtitle.d.ts} +0 -0
- /package/dist/components/{Subtitle.js → typography/Subtitle.js} +0 -0
- /package/dist/components/{TypewriterText.d.ts → typography/TypewriterText.d.ts} +0 -0
- /package/dist/components/{TypewriterText.js → typography/TypewriterText.js} +0 -0
|
@@ -0,0 +1,61 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import { LuX } from 'react-icons/lu';
|
|
5
|
+
const isValidEmail = (email) => {
|
|
6
|
+
return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);
|
|
7
|
+
};
|
|
8
|
+
export function EmailTagInput({ emails, onEmailsChange, error, onInvalidEmail, }) {
|
|
9
|
+
const [inputValue, setInputValue] = useState('');
|
|
10
|
+
const handleKeyDown = (e) => {
|
|
11
|
+
if (e.key === 'Enter') {
|
|
12
|
+
e.preventDefault();
|
|
13
|
+
addEmail();
|
|
14
|
+
}
|
|
15
|
+
else if (e.key === 'Backspace' &&
|
|
16
|
+
inputValue === '' &&
|
|
17
|
+
emails.length > 0) {
|
|
18
|
+
removeEmail(emails.length - 1);
|
|
19
|
+
}
|
|
20
|
+
};
|
|
21
|
+
const handleChange = (e) => {
|
|
22
|
+
const value = e.target.value;
|
|
23
|
+
if (value.includes(',') || value.includes(' ')) {
|
|
24
|
+
const emailToAdd = value.replace(/[,\s]/g, '').trim();
|
|
25
|
+
if (emailToAdd && !emails.includes(emailToAdd)) {
|
|
26
|
+
if (isValidEmail(emailToAdd)) {
|
|
27
|
+
onEmailsChange([...emails, emailToAdd]);
|
|
28
|
+
setInputValue('');
|
|
29
|
+
}
|
|
30
|
+
else {
|
|
31
|
+
onInvalidEmail?.(emailToAdd);
|
|
32
|
+
setInputValue('');
|
|
33
|
+
}
|
|
34
|
+
}
|
|
35
|
+
else {
|
|
36
|
+
setInputValue('');
|
|
37
|
+
}
|
|
38
|
+
}
|
|
39
|
+
else {
|
|
40
|
+
setInputValue(value);
|
|
41
|
+
}
|
|
42
|
+
};
|
|
43
|
+
const addEmail = () => {
|
|
44
|
+
const trimmedEmail = inputValue.trim();
|
|
45
|
+
if (trimmedEmail && !emails.includes(trimmedEmail)) {
|
|
46
|
+
if (isValidEmail(trimmedEmail)) {
|
|
47
|
+
onEmailsChange([...emails, trimmedEmail]);
|
|
48
|
+
setInputValue('');
|
|
49
|
+
}
|
|
50
|
+
else {
|
|
51
|
+
onInvalidEmail?.(trimmedEmail);
|
|
52
|
+
setInputValue('');
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
};
|
|
56
|
+
const removeEmail = (index) => {
|
|
57
|
+
onEmailsChange(emails.filter((_, i) => i !== index));
|
|
58
|
+
};
|
|
59
|
+
return (_jsxs("div", { className: "space-y-2", children: [_jsx("label", { className: "text-xs font-medium text-gray-300 ml-1 block", children: "Email addresses" }), _jsxs("div", { className: `w-full bg-white/5 border ${error ? 'border-red-500/50' : 'border-white/10'} rounded-2xl px-3 py-2 flex flex-wrap gap-2 focus-within:border-violet-500/50 transition-colors shadow-inner min-h-[52px] items-center`, children: [emails.map((email, index) => (_jsxs("span", { className: "bg-violet-500/20 border border-violet-500/20 text-violet-100 text-[11px] font-medium px-2 py-0.5 rounded-md flex items-center gap-1", children: [email, _jsx("button", { type: "button", onClick: () => removeEmail(index), className: "hover:text-white text-violet-300 focus:outline-none flex items-center", children: _jsx(LuX, { className: "w-3 h-3" }) })] }, index))), _jsx("input", { type: "text", value: inputValue, onChange: handleChange, onKeyDown: handleKeyDown, className: "bg-transparent border-none focus:ring-0 text-sm p-0 text-gray-300 placeholder:text-gray-600 flex-grow min-w-[120px] h-6", placeholder: emails.length === 0 ? 'name@company.com' : '' })] }), _jsx("p", { className: "text-[10px] text-gray-500 ml-1", children: "Press Enter, Space, or Comma to add multiple emails." }), error && _jsx("p", { className: "text-[10px] text-red-400 ml-1", children: error })] }));
|
|
60
|
+
}
|
|
61
|
+
//# sourceMappingURL=EmailTagInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"EmailTagInput.js","sourceRoot":"","sources":["../../../src/components/inputs/EmailTagInput.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAiB,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AASrC,MAAM,YAAY,GAAG,CAAC,KAAa,EAAW,EAAE;IAC9C,OAAO,4BAA4B,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;AAClD,CAAC,CAAC;AAEF,MAAM,UAAU,aAAa,CAAC,EAC5B,MAAM,EACN,cAAc,EACd,KAAK,EACL,cAAc,GACK;IACnB,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEjD,MAAM,aAAa,GAAG,CAAC,CAAkC,EAAE,EAAE;QAC3D,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YACtB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,QAAQ,EAAE,CAAC;QACb,CAAC;aAAM,IACL,CAAC,CAAC,GAAG,KAAK,WAAW;YACrB,UAAU,KAAK,EAAE;YACjB,MAAM,CAAC,MAAM,GAAG,CAAC,EACjB,CAAC;YACD,WAAW,CAAC,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACjC,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,YAAY,GAAG,CAAC,CAAsC,EAAE,EAAE;QAC9D,MAAM,KAAK,GAAG,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC;QAE7B,IAAI,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/C,MAAM,UAAU,GAAG,KAAK,CAAC,OAAO,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAC,IAAI,EAAE,CAAC;YACtD,IAAI,UAAU,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,UAAU,CAAC,EAAE,CAAC;gBAC/C,IAAI,YAAY,CAAC,UAAU,CAAC,EAAE,CAAC;oBAC7B,cAAc,CAAC,CAAC,GAAG,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;oBACxC,aAAa,CAAC,EAAE,CAAC,CAAC;gBACpB,CAAC;qBAAM,CAAC;oBACN,cAAc,EAAE,CAAC,UAAU,CAAC,CAAC;oBAC7B,aAAa,CAAC,EAAE,CAAC,CAAC;gBACpB,CAAC;YACH,CAAC;iBAAM,CAAC;gBACN,aAAa,CAAC,EAAE,CAAC,CAAC;YACpB,CAAC;QACH,CAAC;aAAM,CAAC;YACN,aAAa,CAAC,KAAK,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,QAAQ,GAAG,GAAG,EAAE;QACpB,MAAM,YAAY,GAAG,UAAU,CAAC,IAAI,EAAE,CAAC;QACvC,IAAI,YAAY,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,EAAE,CAAC;YACnD,IAAI,YAAY,CAAC,YAAY,CAAC,EAAE,CAAC;gBAC/B,cAAc,CAAC,CAAC,GAAG,MAAM,EAAE,YAAY,CAAC,CAAC,CAAC;gBAC1C,aAAa,CAAC,EAAE,CAAC,CAAC;YACpB,CAAC;iBAAM,CAAC;gBACN,cAAc,EAAE,CAAC,YAAY,CAAC,CAAC;gBAC/B,aAAa,CAAC,EAAE,CAAC,CAAC;YACpB,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,KAAa,EAAE,EAAE;QACpC,cAAc,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC;IACvD,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,WAAW,aACxB,gBAAO,SAAS,EAAC,8CAA8C,gCAEvD,EACR,eACE,SAAS,EAAE,4BACT,KAAK,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAAC,iBAChC,wIAAwI,aAEvI,MAAM,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,KAAK,EAAE,EAAE,CAAC,CAC5B,gBAEE,SAAS,EAAC,qIAAqI,aAE9I,KAAK,EACN,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,WAAW,CAAC,KAAK,CAAC,EACjC,SAAS,EAAC,uEAAuE,YAEjF,KAAC,GAAG,IAAC,SAAS,EAAC,SAAS,GAAG,GACpB,KAVJ,KAAK,CAWL,CACR,CAAC,EACF,gBACE,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,UAAU,EACjB,QAAQ,EAAE,YAAY,EACtB,SAAS,EAAE,aAAa,EACxB,SAAS,EAAC,yHAAyH,EACnI,WAAW,EAAE,MAAM,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,EAAE,GAC1D,IACE,EACN,YAAG,SAAS,EAAC,gCAAgC,qEAEzC,EACH,KAAK,IAAI,YAAG,SAAS,EAAC,+BAA+B,YAAE,KAAK,GAAK,IAC9D,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> {
|
|
3
|
+
label?: string;
|
|
4
|
+
error?: string;
|
|
5
|
+
labelClassName?: string;
|
|
6
|
+
errorClassName?: string;
|
|
7
|
+
containerClassName?: string;
|
|
8
|
+
inputClassName?: string;
|
|
9
|
+
variant?: 'primary' | 'secondary' | 'outline';
|
|
10
|
+
inputSize?: 'sm' | 'md' | 'lg';
|
|
11
|
+
icon?: React.ReactNode;
|
|
12
|
+
iconPosition?: 'left' | 'right';
|
|
13
|
+
ref?: React.Ref<HTMLInputElement>;
|
|
14
|
+
}
|
|
15
|
+
export declare function Input({ label, error, className, labelClassName, errorClassName, containerClassName, inputClassName, variant, inputSize, icon, iconPosition, ref, ...props }: InputProps): import("react/jsx-runtime").JSX.Element;
|
|
16
|
+
//# sourceMappingURL=Input.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/Input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,UACf,SAAQ,KAAK,CAAC,mBAAmB,CAAC,gBAAgB,CAAC;IACnD,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAC9C,SAAS,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC/B,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,YAAY,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAChC,GAAG,CAAC,EAAE,KAAK,CAAC,GAAG,CAAC,gBAAgB,CAAC,CAAC;CACnC;AAED,wBAAgB,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,SAAc,EACd,cAAmB,EACnB,cAAmB,EACnB,kBAAuB,EACvB,cAAmB,EACnB,OAAmB,EACnB,SAAgB,EAChB,IAAI,EACJ,YAAsB,EACtB,GAAG,EACH,GAAG,KAAK,EACT,EAAE,UAAU,2CA0FZ"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { cn } from '../../lib/utils';
|
|
4
|
+
export function Input({ label, error, className = '', labelClassName = '', errorClassName = '', containerClassName = '', inputClassName = '', variant = 'primary', inputSize = 'md', icon, iconPosition = 'right', ref, ...props }) {
|
|
5
|
+
const reactId = React.useId();
|
|
6
|
+
const id = props.id ?? reactId;
|
|
7
|
+
const sizeClasses = {
|
|
8
|
+
sm: {
|
|
9
|
+
input: 'px-3 py-2 text-xs',
|
|
10
|
+
inputWithIcon: iconPosition === 'left' ? 'pl-9' : 'pr-9',
|
|
11
|
+
iconSize: 'w-4 h-4',
|
|
12
|
+
iconLeft: 'left-3',
|
|
13
|
+
iconRight: 'right-3',
|
|
14
|
+
},
|
|
15
|
+
md: {
|
|
16
|
+
input: 'px-4 py-2.5 text-sm',
|
|
17
|
+
inputWithIcon: iconPosition === 'left' ? 'pl-10' : 'pr-10',
|
|
18
|
+
iconSize: 'w-5 h-5',
|
|
19
|
+
iconLeft: 'left-3.5',
|
|
20
|
+
iconRight: 'right-3.5',
|
|
21
|
+
},
|
|
22
|
+
lg: {
|
|
23
|
+
input: 'px-5 py-3 text-base',
|
|
24
|
+
inputWithIcon: iconPosition === 'left' ? 'pl-12' : 'pr-12',
|
|
25
|
+
iconSize: 'w-6 h-6',
|
|
26
|
+
iconLeft: 'left-4',
|
|
27
|
+
iconRight: 'right-4',
|
|
28
|
+
},
|
|
29
|
+
};
|
|
30
|
+
const variantClasses = {
|
|
31
|
+
primary: 'bg-white/[0.02] border-white/10 focus:border-violet-500/50 focus:ring-violet-500/50 focus:bg-white/[0.04]',
|
|
32
|
+
secondary: 'bg-white/[0.03] border-white/20 focus:border-purple-500/50 focus:ring-purple-500/50 focus:bg-white/[0.05]',
|
|
33
|
+
outline: 'bg-transparent border-gray-600 focus:border-violet-400 focus:ring-violet-400/30',
|
|
34
|
+
};
|
|
35
|
+
const baseStyles = 'w-full border rounded-full text-gray-200 placeholder-gray-600 focus:outline-none focus:ring-1 transition-all duration-300 shadow-inner autofill:bg-white/[0.02] autofill:text-gray-200 autofill:shadow-[inset_0_0_0_1000px_rgba(255,255,255,0.02)]';
|
|
36
|
+
return (_jsxs("div", { className: cn('group relative w-full', containerClassName), children: [label && (_jsx("label", { className: cn('block text-sm font-medium text-gray-400 mb-2', labelClassName), htmlFor: id, children: label })), _jsxs("div", { className: "relative", children: [icon && (_jsx("div", { className: cn('absolute top-1/2 -translate-y-1/2 flex items-center justify-center text-white pointer-events-none z-10', iconPosition === 'left'
|
|
37
|
+
? sizeClasses[inputSize].iconLeft
|
|
38
|
+
: sizeClasses[inputSize].iconRight), children: _jsx("span", { className: sizeClasses[inputSize].iconSize, children: icon }) })), _jsx("input", { ref: ref, id: id, className: cn(baseStyles, sizeClasses[inputSize].input, icon && sizeClasses[inputSize].inputWithIcon, variantClasses[variant], error
|
|
39
|
+
? 'border-red-500/50 focus:border-red-500/70 focus:ring-red-500/50'
|
|
40
|
+
: '', inputClassName, className), ...props })] }), error && (_jsx("p", { className: cn('mt-2 text-sm text-red-400', errorClassName), children: error }))] }));
|
|
41
|
+
}
|
|
42
|
+
//# sourceMappingURL=Input.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Input.js","sourceRoot":"","sources":["../../../src/components/inputs/Input.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAiBrC,MAAM,UAAU,KAAK,CAAC,EACpB,KAAK,EACL,KAAK,EACL,SAAS,GAAG,EAAE,EACd,cAAc,GAAG,EAAE,EACnB,cAAc,GAAG,EAAE,EACnB,kBAAkB,GAAG,EAAE,EACvB,cAAc,GAAG,EAAE,EACnB,OAAO,GAAG,SAAS,EACnB,SAAS,GAAG,IAAI,EAChB,IAAI,EACJ,YAAY,GAAG,OAAO,EACtB,GAAG,EACH,GAAG,KAAK,EACG;IACX,MAAM,OAAO,GAAG,KAAK,CAAC,KAAK,EAAE,CAAC;IAC9B,MAAM,EAAE,GAAG,KAAK,CAAC,EAAE,IAAI,OAAO,CAAC;IAE/B,MAAM,WAAW,GAAG;QAClB,EAAE,EAAE;YACF,KAAK,EAAE,mBAAmB;YAC1B,aAAa,EAAE,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM;YACxD,QAAQ,EAAE,SAAS;YACnB,QAAQ,EAAE,QAAQ;YAClB,SAAS,EAAE,SAAS;SACrB;QACD,EAAE,EAAE;YACF,KAAK,EAAE,qBAAqB;YAC5B,aAAa,EAAE,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;YAC1D,QAAQ,EAAE,SAAS;YACnB,QAAQ,EAAE,UAAU;YACpB,SAAS,EAAE,WAAW;SACvB;QACD,EAAE,EAAE;YACF,KAAK,EAAE,qBAAqB;YAC5B,aAAa,EAAE,YAAY,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO;YAC1D,QAAQ,EAAE,SAAS;YACnB,QAAQ,EAAE,QAAQ;YAClB,SAAS,EAAE,SAAS;SACrB;KACF,CAAC;IAEF,MAAM,cAAc,GAAG;QACrB,OAAO,EACL,2GAA2G;QAC7G,SAAS,EACP,2GAA2G;QAC7G,OAAO,EACL,iFAAiF;KACpF,CAAC;IAEF,MAAM,UAAU,GACd,oPAAoP,CAAC;IAEvP,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,uBAAuB,EAAE,kBAAkB,CAAC,aAC5D,KAAK,IAAI,CACR,gBACE,SAAS,EAAE,EAAE,CACX,8CAA8C,EAC9C,cAAc,CACf,EACD,OAAO,EAAE,EAAE,YAEV,KAAK,GACA,CACT,EACD,eAAK,SAAS,EAAC,UAAU,aACtB,IAAI,IAAI,CACP,cACE,SAAS,EAAE,EAAE,CACX,wGAAwG,EACxG,YAAY,KAAK,MAAM;4BACrB,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,QAAQ;4BACjC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,SAAS,CACrC,YAED,eAAM,SAAS,EAAE,WAAW,CAAC,SAAS,CAAC,CAAC,QAAQ,YAAG,IAAI,GAAQ,GAC3D,CACP,EACD,gBACE,GAAG,EAAE,GAAG,EACR,EAAE,EAAE,EAAE,EACN,SAAS,EAAE,EAAE,CACX,UAAU,EACV,WAAW,CAAC,SAAS,CAAC,CAAC,KAAK,EAC5B,IAAI,IAAI,WAAW,CAAC,SAAS,CAAC,CAAC,aAAa,EAC5C,cAAc,CAAC,OAAO,CAAC,EACvB,KAAK;4BACH,CAAC,CAAC,iEAAiE;4BACnE,CAAC,CAAC,EAAE,EACN,cAAc,EACd,SAAS,CACV,KACG,KAAK,GACT,IACE,EACL,KAAK,IAAI,CACR,YAAG,SAAS,EAAE,EAAE,CAAC,2BAA2B,EAAE,cAAc,CAAC,YAC1D,KAAK,GACJ,CACL,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputField.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/InputField.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAC;AAGlE,QAAA,MAAM,aAAa;;;;mFA0BlB,CAAC;AAuBF,MAAM,WAAW,eACf,SAAQ,IAAI,CAAC,YAAY,CAAC,OAAO,aAAa,CAAC,EAAE,gBAAgB,CAAC;IAClE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAClC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,wBAAgB,UAAU,CAAC,EACzB,WAAoC,EACpC,QAAQ,EACR,QAAQ,EACR,KAAK,EAAE,eAAe,EACtB,YAAiB,EACjB,UAAiB,EACjB,UAA8D,EAC9D,cAAwB,EACxB,OAAuB,EACvB,IAAW,EACX,SAAc,EACd,cAAmB,EACnB,eAAoB,EACpB,kBAAuB,EACvB,QAAgB,EAChB,IAAa,GACd,EAAE,eAAe,2CA8DjB"}
|
|
@@ -4,7 +4,7 @@ import { LuArrowUpRight } from 'react-icons/lu';
|
|
|
4
4
|
import { useState } from 'react';
|
|
5
5
|
import { motion } from 'framer-motion';
|
|
6
6
|
import { cva } from 'class-variance-authority';
|
|
7
|
-
import { cn } from '
|
|
7
|
+
import { cn } from '../../lib/utils';
|
|
8
8
|
const inputVariants = cva('w-full rounded-full text-white placeholder:text-white/50 focus:outline-none transition-colors disabled:opacity-50 disabled:cursor-not-allowed', {
|
|
9
9
|
variants: {
|
|
10
10
|
variant: {
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"InputField.js","sourceRoot":"","sources":["../../../src/components/inputs/InputField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
export interface NumberStepperProps {
|
|
2
|
+
defaultValue?: number;
|
|
3
|
+
value?: number;
|
|
4
|
+
min?: number;
|
|
5
|
+
max?: number;
|
|
6
|
+
step?: number;
|
|
7
|
+
onChange?: (value: number) => void;
|
|
8
|
+
label?: string;
|
|
9
|
+
description?: string;
|
|
10
|
+
className?: string;
|
|
11
|
+
formatDisplay?: (value: number) => string;
|
|
12
|
+
size?: 'sm' | 'md' | 'lg';
|
|
13
|
+
}
|
|
14
|
+
export declare function NumberStepper({ defaultValue, value: controlledValue, min, max, step, onChange, label, description, className, formatDisplay, size, }: NumberStepperProps): import("react/jsx-runtime").JSX.Element;
|
|
15
|
+
//# sourceMappingURL=NumberStepper.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NumberStepper.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/NumberStepper.tsx"],"names":[],"mappings":"AAKA,MAAM,WAAW,kBAAkB;IACjC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;IAC1C,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B;AAED,wBAAgB,aAAa,CAAC,EAC5B,YAAgB,EAChB,KAAK,EAAE,eAAe,EACtB,GAAO,EACP,GAAS,EACT,IAAQ,EACR,QAAQ,EACR,KAAK,EACL,WAAW,EACX,SAAc,EACd,aAAyC,EACzC,IAAW,GACZ,EAAE,kBAAkB,2CAiGpB"}
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
3
|
+
import { IoIosAdd } from 'react-icons/io';
|
|
4
|
+
import { FiMinus } from 'react-icons/fi';
|
|
5
|
+
import { cn } from '../../lib/utils';
|
|
6
|
+
export function NumberStepper({ defaultValue = 1, value: controlledValue, min = 1, max = 100, step = 1, onChange, label, description, className = '', formatDisplay = value => value.toString(), size = 'md', }) {
|
|
7
|
+
const [internalValue, setInternalValue] = useState(defaultValue);
|
|
8
|
+
const currentValue = controlledValue ?? internalValue;
|
|
9
|
+
const handleIncrement = () => {
|
|
10
|
+
if (currentValue < max) {
|
|
11
|
+
const newValue = Math.min(currentValue + step, max);
|
|
12
|
+
if (controlledValue === undefined) {
|
|
13
|
+
setInternalValue(newValue);
|
|
14
|
+
}
|
|
15
|
+
onChange?.(newValue);
|
|
16
|
+
}
|
|
17
|
+
};
|
|
18
|
+
const handleDecrement = () => {
|
|
19
|
+
if (currentValue > min) {
|
|
20
|
+
const newValue = Math.max(currentValue - step, min);
|
|
21
|
+
if (controlledValue === undefined) {
|
|
22
|
+
setInternalValue(newValue);
|
|
23
|
+
}
|
|
24
|
+
onChange?.(newValue);
|
|
25
|
+
}
|
|
26
|
+
};
|
|
27
|
+
const sizeStyles = {
|
|
28
|
+
sm: {
|
|
29
|
+
button: 'w-6 h-6',
|
|
30
|
+
text: 'text-xs min-w-[1.25rem]',
|
|
31
|
+
icon: 'text-xs',
|
|
32
|
+
gap: 'gap-2',
|
|
33
|
+
},
|
|
34
|
+
md: {
|
|
35
|
+
button: 'w-8 h-8',
|
|
36
|
+
text: 'text-sm min-w-[1.5rem]',
|
|
37
|
+
icon: 'text-sm',
|
|
38
|
+
gap: 'gap-4',
|
|
39
|
+
},
|
|
40
|
+
lg: {
|
|
41
|
+
button: 'w-10 h-10',
|
|
42
|
+
text: 'text-base min-w-[2rem]',
|
|
43
|
+
icon: 'text-base',
|
|
44
|
+
gap: 'gap-6',
|
|
45
|
+
},
|
|
46
|
+
};
|
|
47
|
+
return (_jsxs("div", { className: cn('flex flex-col items-center gap-2', className), children: [label && (_jsx("span", { className: "text-xs uppercase tracking-wider text-gray-500 font-medium", children: label })), _jsxs("div", { className: cn('flex items-center bg-white/[0.03] border border-white/10 rounded-full p-1 px-2', sizeStyles[size].gap), children: [_jsx("button", { type: "button", onClick: handleDecrement, disabled: currentValue <= min, className: cn('flex items-center justify-center text-gray-400 hover:text-white hover:bg-white/5 rounded-full transition-colors disabled:opacity-30 disabled:cursor-not-allowed', sizeStyles[size].button), "aria-label": "Decrease value", children: _jsx(FiMinus, { className: sizeStyles[size].icon }) }), _jsx("span", { className: cn('font-medium text-white text-center', sizeStyles[size].text), children: formatDisplay(currentValue) }), _jsx("button", { type: "button", onClick: handleIncrement, disabled: currentValue >= max, className: cn('flex items-center justify-center text-gray-400 hover:text-white hover:bg-white/5 rounded-full transition-colors disabled:opacity-30 disabled:cursor-not-allowed', sizeStyles[size].button), "aria-label": "Increase value", children: _jsx(IoIosAdd, { className: sizeStyles[size].icon }) })] }), description && (_jsx("span", { className: "text-[10px] text-gray-600", children: description }))] }));
|
|
48
|
+
}
|
|
49
|
+
//# sourceMappingURL=NumberStepper.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"NumberStepper.js","sourceRoot":"","sources":["../../../src/components/inputs/NumberStepper.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;AACzC,OAAO,EAAE,EAAE,EAAE,MAAM,iBAAiB,CAAC;AAgBrC,MAAM,UAAU,aAAa,CAAC,EAC5B,YAAY,GAAG,CAAC,EAChB,KAAK,EAAE,eAAe,EACtB,GAAG,GAAG,CAAC,EACP,GAAG,GAAG,GAAG,EACT,IAAI,GAAG,CAAC,EACR,QAAQ,EACR,KAAK,EACL,WAAW,EACX,SAAS,GAAG,EAAE,EACd,aAAa,GAAG,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,QAAQ,EAAE,EACzC,IAAI,GAAG,IAAI,GACQ;IACnB,MAAM,CAAC,aAAa,EAAE,gBAAgB,CAAC,GAAG,QAAQ,CAAC,YAAY,CAAC,CAAC;IAEjE,MAAM,YAAY,GAAG,eAAe,IAAI,aAAa,CAAC;IAEtD,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,YAAY,GAAG,GAAG,EAAE,CAAC;YACvB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC;YACpD,IAAI,eAAe,KAAK,SAAS,EAAE,CAAC;gBAClC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YAC7B,CAAC;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,GAAG,EAAE;QAC3B,IAAI,YAAY,GAAG,GAAG,EAAE,CAAC;YACvB,MAAM,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,YAAY,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC;YACpD,IAAI,eAAe,KAAK,SAAS,EAAE,CAAC;gBAClC,gBAAgB,CAAC,QAAQ,CAAC,CAAC;YAC7B,CAAC;YACD,QAAQ,EAAE,CAAC,QAAQ,CAAC,CAAC;QACvB,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,UAAU,GAAG;QACjB,EAAE,EAAE;YACF,MAAM,EAAE,SAAS;YACjB,IAAI,EAAE,yBAAyB;YAC/B,IAAI,EAAE,SAAS;YACf,GAAG,EAAE,OAAO;SACb;QACD,EAAE,EAAE;YACF,MAAM,EAAE,SAAS;YACjB,IAAI,EAAE,wBAAwB;YAC9B,IAAI,EAAE,SAAS;YACf,GAAG,EAAE,OAAO;SACb;QACD,EAAE,EAAE;YACF,MAAM,EAAE,WAAW;YACnB,IAAI,EAAE,wBAAwB;YAC9B,IAAI,EAAE,WAAW;YACjB,GAAG,EAAE,OAAO;SACb;KACF,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAE,EAAE,CAAC,kCAAkC,EAAE,SAAS,CAAC,aAC9D,KAAK,IAAI,CACR,eAAM,SAAS,EAAC,4DAA4D,YACzE,KAAK,GACD,CACR,EACD,eACE,SAAS,EAAE,EAAE,CACX,gFAAgF,EAChF,UAAU,CAAC,IAAI,CAAC,CAAC,GAAG,CACrB,aAED,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,YAAY,IAAI,GAAG,EAC7B,SAAS,EAAE,EAAE,CACX,iKAAiK,EACjK,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,CACxB,gBACU,gBAAgB,YAE3B,KAAC,OAAO,IAAC,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,GAAI,GACtC,EACT,eACE,SAAS,EAAE,EAAE,CACX,oCAAoC,EACpC,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,CACtB,YAEA,aAAa,CAAC,YAAY,CAAC,GACvB,EACP,iBACE,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,eAAe,EACxB,QAAQ,EAAE,YAAY,IAAI,GAAG,EAC7B,SAAS,EAAE,EAAE,CACX,iKAAiK,EACjK,UAAU,CAAC,IAAI,CAAC,CAAC,MAAM,CACxB,gBACU,gBAAgB,YAE3B,KAAC,QAAQ,IAAC,SAAS,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC,IAAI,GAAI,GACvC,IACL,EACL,WAAW,IAAI,CACd,eAAM,SAAS,EAAC,2BAA2B,YAAE,WAAW,GAAQ,CACjE,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import type { ReactNode } from 'react';
|
|
2
|
+
interface PermissionToggleProps {
|
|
3
|
+
icon: ReactNode;
|
|
4
|
+
title: string;
|
|
5
|
+
description: string;
|
|
6
|
+
enabled: boolean;
|
|
7
|
+
onToggle: (enabled: boolean) => void;
|
|
8
|
+
expandable?: boolean;
|
|
9
|
+
expanded?: boolean;
|
|
10
|
+
children?: ReactNode;
|
|
11
|
+
highlighted?: boolean;
|
|
12
|
+
}
|
|
13
|
+
export declare function PermissionToggle({ icon, title, description, enabled, onToggle, expandable, expanded, children, highlighted, }: PermissionToggleProps): import("react/jsx-runtime").JSX.Element;
|
|
14
|
+
export {};
|
|
15
|
+
//# sourceMappingURL=PermissionToggle.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PermissionToggle.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/PermissionToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvC,UAAU,qBAAqB;IAC7B,IAAI,EAAE,SAAS,CAAC;IAChB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACrC,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,WAAW,EACX,OAAO,EACP,QAAQ,EACR,UAAkB,EAClB,QAAgB,EAChB,QAAQ,EACR,WAAmB,GACpB,EAAE,qBAAqB,2CAuDvB"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
export function PermissionToggle({ icon, title, description, enabled, onToggle, expandable = false, expanded = false, children, highlighted = false, }) {
|
|
3
|
+
const borderClass = highlighted
|
|
4
|
+
? 'border-violet-500/30'
|
|
5
|
+
: 'border-white/5 hover:border-white/10';
|
|
6
|
+
return (_jsxs("div", { className: `bg-white/[0.02] border ${borderClass} rounded-xl overflow-hidden transition-all duration-200`, children: [_jsxs("div", { className: "p-3 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: `w-8 h-8 rounded-full ${highlighted ? 'bg-violet-500/10' : 'bg-white/5'} flex items-center justify-center ${highlighted ? 'text-violet-400' : 'text-gray-400'}`, children: icon }), _jsxs("div", { children: [_jsx("div", { className: "text-sm font-medium text-gray-200", children: title }), _jsx("div", { className: "text-[10px] text-gray-500", children: description })] })] }), _jsxs("label", { className: "relative inline-flex items-center cursor-pointer", children: [_jsx("input", { type: "checkbox", checked: enabled, onChange: e => onToggle(e.target.checked), className: "sr-only peer", "aria-label": `Toggle ${title}` }), _jsx("div", { className: [
|
|
7
|
+
'w-9 h-5 bg-gray-700 rounded-full',
|
|
8
|
+
'peer peer-checked:bg-violet-600',
|
|
9
|
+
'peer-focus-visible:outline-none peer-focus-visible:ring-2',
|
|
10
|
+
'peer-focus-visible:ring-violet-500 peer-focus-visible:ring-offset-2',
|
|
11
|
+
'peer-focus-visible:ring-offset-black',
|
|
12
|
+
"after:content-[''] after:absolute after:top-[2px] after:left-[2px]",
|
|
13
|
+
'after:bg-white after:border-gray-300 after:border',
|
|
14
|
+
'after:rounded-full after:h-4 after:w-4 after:transition-all',
|
|
15
|
+
'peer-checked:after:translate-x-full peer-checked:after:border-white',
|
|
16
|
+
].join(' ') })] })] }), expandable && expanded && enabled && (_jsx("div", { className: "px-3 pb-3 pt-0 border-t border-white/5 bg-white/[0.01]", children: children }))] }));
|
|
17
|
+
}
|
|
18
|
+
//# sourceMappingURL=PermissionToggle.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"PermissionToggle.js","sourceRoot":"","sources":["../../../src/components/inputs/PermissionToggle.tsx"],"names":[],"mappings":";AAcA,MAAM,UAAU,gBAAgB,CAAC,EAC/B,IAAI,EACJ,KAAK,EACL,WAAW,EACX,OAAO,EACP,QAAQ,EACR,UAAU,GAAG,KAAK,EAClB,QAAQ,GAAG,KAAK,EAChB,QAAQ,EACR,WAAW,GAAG,KAAK,GACG;IACtB,MAAM,WAAW,GAAG,WAAW;QAC7B,CAAC,CAAC,sBAAsB;QACxB,CAAC,CAAC,sCAAsC,CAAC;IAE3C,OAAO,CACL,eACE,SAAS,EAAE,0BAA0B,WAAW,yDAAyD,aAEzG,eAAK,SAAS,EAAC,uCAAuC,aACpD,eAAK,SAAS,EAAC,yBAAyB,aACtC,cACE,SAAS,EAAE,wBACT,WAAW,CAAC,CAAC,CAAC,kBAAkB,CAAC,CAAC,CAAC,YACrC,qCACE,WAAW,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,eACpC,EAAE,YAED,IAAI,GACD,EACN,0BACE,cAAK,SAAS,EAAC,mCAAmC,YAAE,KAAK,GAAO,EAChE,cAAK,SAAS,EAAC,2BAA2B,YAAE,WAAW,GAAO,IAC1D,IACF,EACN,iBAAO,SAAS,EAAC,kDAAkD,aACjE,gBACE,IAAI,EAAC,UAAU,EACf,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,EACzC,SAAS,EAAC,cAAc,gBACZ,UAAU,KAAK,EAAE,GAC7B,EACF,cACE,SAAS,EAAE;oCACT,kCAAkC;oCAClC,iCAAiC;oCACjC,2DAA2D;oCAC3D,qEAAqE;oCACrE,sCAAsC;oCACtC,oEAAoE;oCACpE,mDAAmD;oCACnD,6DAA6D;oCAC7D,qEAAqE;iCACtE,CAAC,IAAI,CAAC,GAAG,CAAC,GACN,IACD,IACJ,EACL,UAAU,IAAI,QAAQ,IAAI,OAAO,IAAI,CACpC,cAAK,SAAS,EAAC,wDAAwD,YACpE,QAAQ,GACL,CACP,IACG,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface SelectOption {
|
|
3
|
+
value: string;
|
|
4
|
+
label: string;
|
|
5
|
+
}
|
|
6
|
+
export interface SelectProps {
|
|
7
|
+
options: SelectOption[];
|
|
8
|
+
placeholder?: string;
|
|
9
|
+
label?: string;
|
|
10
|
+
error?: string;
|
|
11
|
+
selectSize?: 'sm' | 'md' | 'lg';
|
|
12
|
+
variant?: 'primary' | 'secondary' | 'outline';
|
|
13
|
+
value?: string;
|
|
14
|
+
defaultValue?: string;
|
|
15
|
+
onChange?: (value: string) => void;
|
|
16
|
+
className?: string;
|
|
17
|
+
labelClassName?: string;
|
|
18
|
+
errorClassName?: string;
|
|
19
|
+
containerClassName?: string;
|
|
20
|
+
id?: string;
|
|
21
|
+
name?: string;
|
|
22
|
+
}
|
|
23
|
+
export declare const Select: React.FC<SelectProps>;
|
|
24
|
+
//# sourceMappingURL=Select.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/Select.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAGlE,MAAM,WAAW,YAAY;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,OAAO,EAAE,YAAY,EAAE,CAAC;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAChC,OAAO,CAAC,EAAE,SAAS,GAAG,WAAW,GAAG,SAAS,CAAC;IAC9C,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,MAAM,EAAE,KAAK,CAAC,EAAE,CAAC,WAAW,CAuSxC,CAAC"}
|
|
@@ -0,0 +1,156 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
import { useState, useRef, useEffect, useId } from 'react';
|
|
4
|
+
import { cn } from '../../lib/utils';
|
|
5
|
+
export const Select = ({ options, placeholder = 'Select...', label, error, selectSize = 'md', variant = 'primary', value, defaultValue = '', onChange, className = '', labelClassName = '', errorClassName = '', containerClassName = '', id: providedId, name, }) => {
|
|
6
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
7
|
+
const [internalValue, setInternalValue] = useState(defaultValue);
|
|
8
|
+
const [highlightedIndex, setHighlightedIndex] = useState(-1);
|
|
9
|
+
const [typeAheadBuffer, setTypeAheadBuffer] = useState('');
|
|
10
|
+
const dropdownRef = useRef(null);
|
|
11
|
+
const buttonRef = useRef(null);
|
|
12
|
+
const listboxRef = useRef(null);
|
|
13
|
+
const typeAheadTimeoutRef = useRef(null);
|
|
14
|
+
const reactId = useId();
|
|
15
|
+
const id = providedId ?? reactId;
|
|
16
|
+
const buttonId = `${id}-button`;
|
|
17
|
+
const listboxId = `${id}-listbox`;
|
|
18
|
+
const errorId = error ? `${id}-error` : undefined;
|
|
19
|
+
const isControlled = value !== undefined;
|
|
20
|
+
const selectedValue = isControlled ? value : internalValue;
|
|
21
|
+
const selectedIndex = options.findIndex(opt => opt.value === selectedValue);
|
|
22
|
+
// Sync defaultValue changes in uncontrolled mode
|
|
23
|
+
useEffect(() => {
|
|
24
|
+
if (!isControlled && defaultValue !== undefined) {
|
|
25
|
+
setInternalValue(defaultValue);
|
|
26
|
+
}
|
|
27
|
+
}, [defaultValue, isControlled]);
|
|
28
|
+
const sizeClasses = {
|
|
29
|
+
sm: 'px-3 py-2 text-xs',
|
|
30
|
+
md: 'px-4 py-2.5 text-sm',
|
|
31
|
+
lg: 'px-5 py-3 text-base',
|
|
32
|
+
};
|
|
33
|
+
const dropdownSizeClasses = {
|
|
34
|
+
sm: 'text-xs',
|
|
35
|
+
md: 'text-sm',
|
|
36
|
+
lg: 'text-base',
|
|
37
|
+
};
|
|
38
|
+
const variantClasses = {
|
|
39
|
+
primary: 'bg-white/[0.02] border-white/10 focus:border-violet-500/50 focus:ring-violet-500/50 focus:bg-white/[0.04]',
|
|
40
|
+
secondary: 'bg-white/[0.03] border-white/20 focus:border-purple-500/50 focus:ring-purple-500/50 focus:bg-white/[0.05]',
|
|
41
|
+
outline: 'bg-transparent border-gray-600 focus:border-violet-400 focus:ring-violet-400/30',
|
|
42
|
+
};
|
|
43
|
+
const selectedOption = options.find(opt => opt.value === selectedValue);
|
|
44
|
+
// Close dropdown on outside click
|
|
45
|
+
useEffect(() => {
|
|
46
|
+
const handleClickOutside = (event) => {
|
|
47
|
+
if (dropdownRef.current &&
|
|
48
|
+
!dropdownRef.current.contains(event.target)) {
|
|
49
|
+
setIsOpen(false);
|
|
50
|
+
}
|
|
51
|
+
};
|
|
52
|
+
document.addEventListener('mousedown', handleClickOutside);
|
|
53
|
+
return () => document.removeEventListener('mousedown', handleClickOutside);
|
|
54
|
+
}, []);
|
|
55
|
+
// Reset highlighted index and focus listbox when dropdown opens
|
|
56
|
+
useEffect(() => {
|
|
57
|
+
if (isOpen) {
|
|
58
|
+
setHighlightedIndex(selectedIndex >= 0 ? selectedIndex : 0);
|
|
59
|
+
// Focus the listbox so keyboard navigation works
|
|
60
|
+
requestAnimationFrame(() => {
|
|
61
|
+
listboxRef.current?.focus();
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
}, [isOpen, selectedIndex]);
|
|
65
|
+
const handleSelect = (newValue) => {
|
|
66
|
+
if (!isControlled) {
|
|
67
|
+
setInternalValue(newValue);
|
|
68
|
+
}
|
|
69
|
+
setIsOpen(false);
|
|
70
|
+
buttonRef.current?.focus();
|
|
71
|
+
onChange?.(newValue);
|
|
72
|
+
};
|
|
73
|
+
const handleTypeAhead = (char) => {
|
|
74
|
+
if (typeAheadTimeoutRef.current) {
|
|
75
|
+
clearTimeout(typeAheadTimeoutRef.current);
|
|
76
|
+
}
|
|
77
|
+
const newBuffer = typeAheadBuffer + char.toLowerCase();
|
|
78
|
+
setTypeAheadBuffer(newBuffer);
|
|
79
|
+
const matchIndex = options.findIndex(opt => opt.label.toLowerCase().startsWith(newBuffer));
|
|
80
|
+
if (matchIndex >= 0) {
|
|
81
|
+
setHighlightedIndex(matchIndex);
|
|
82
|
+
}
|
|
83
|
+
typeAheadTimeoutRef.current = setTimeout(() => {
|
|
84
|
+
setTypeAheadBuffer('');
|
|
85
|
+
}, 500);
|
|
86
|
+
};
|
|
87
|
+
const handleButtonKeyDown = (e) => {
|
|
88
|
+
switch (e.key) {
|
|
89
|
+
case 'Enter':
|
|
90
|
+
case ' ':
|
|
91
|
+
case 'ArrowDown':
|
|
92
|
+
case 'ArrowUp':
|
|
93
|
+
e.preventDefault();
|
|
94
|
+
setIsOpen(true);
|
|
95
|
+
break;
|
|
96
|
+
case 'Escape':
|
|
97
|
+
setIsOpen(false);
|
|
98
|
+
break;
|
|
99
|
+
default:
|
|
100
|
+
if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {
|
|
101
|
+
e.preventDefault();
|
|
102
|
+
setIsOpen(true);
|
|
103
|
+
handleTypeAhead(e.key);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
};
|
|
107
|
+
const handleListboxKeyDown = (e) => {
|
|
108
|
+
switch (e.key) {
|
|
109
|
+
case 'ArrowDown':
|
|
110
|
+
e.preventDefault();
|
|
111
|
+
setHighlightedIndex(prev => prev < options.length - 1 ? prev + 1 : prev);
|
|
112
|
+
break;
|
|
113
|
+
case 'ArrowUp':
|
|
114
|
+
e.preventDefault();
|
|
115
|
+
setHighlightedIndex(prev => (prev > 0 ? prev - 1 : prev));
|
|
116
|
+
break;
|
|
117
|
+
case 'Home':
|
|
118
|
+
e.preventDefault();
|
|
119
|
+
setHighlightedIndex(0);
|
|
120
|
+
break;
|
|
121
|
+
case 'End':
|
|
122
|
+
e.preventDefault();
|
|
123
|
+
setHighlightedIndex(options.length - 1);
|
|
124
|
+
break;
|
|
125
|
+
case 'Enter':
|
|
126
|
+
case ' ':
|
|
127
|
+
e.preventDefault();
|
|
128
|
+
if (highlightedIndex >= 0) {
|
|
129
|
+
handleSelect(options[highlightedIndex].value);
|
|
130
|
+
}
|
|
131
|
+
break;
|
|
132
|
+
case 'Escape':
|
|
133
|
+
e.preventDefault();
|
|
134
|
+
setIsOpen(false);
|
|
135
|
+
buttonRef.current?.focus();
|
|
136
|
+
break;
|
|
137
|
+
default:
|
|
138
|
+
if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {
|
|
139
|
+
e.preventDefault();
|
|
140
|
+
handleTypeAhead(e.key);
|
|
141
|
+
}
|
|
142
|
+
}
|
|
143
|
+
};
|
|
144
|
+
return (_jsxs("div", { className: cn('relative w-full', containerClassName), ref: dropdownRef, children: [label && (_jsx("label", { id: buttonId, className: cn('block text-sm font-medium text-gray-400 mb-2', labelClassName), children: label })), _jsx("input", { type: "hidden", name: name, id: id, value: selectedValue }), _jsxs("button", { ref: buttonRef, type: "button", onClick: () => setIsOpen(!isOpen), onKeyDown: handleButtonKeyDown, "aria-haspopup": "listbox", "aria-expanded": isOpen, "aria-labelledby": label ? buttonId : undefined, "aria-invalid": error ? 'true' : undefined, "aria-describedby": errorId, className: cn('w-full border rounded-full text-gray-200 placeholder-gray-600 focus:outline-none focus:ring-1 transition-all duration-300 shadow-inner cursor-pointer flex items-center justify-between', variantClasses[variant], error
|
|
145
|
+
? 'border-red-500/50 focus:border-red-500 focus:ring-red-500'
|
|
146
|
+
: '', sizeClasses[selectSize], className), children: [_jsx("span", { className: selectedValue ? 'text-white' : 'text-gray-500', children: selectedOption ? selectedOption.label : placeholder }), _jsx("svg", { className: `w-5 h-5 text-gray-500 transition-transform ${isOpen ? 'rotate-180' : ''}`, fill: "none", stroke: "currentColor", viewBox: "0 0 24 24", "aria-hidden": "true", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M19 9l-7 7-7-7" }) })] }), isOpen && (_jsx("div", { className: "absolute z-50 w-full mt-2", children: _jsx("div", { ref: listboxRef, role: "listbox", id: listboxId, "aria-labelledby": label ? buttonId : undefined, "aria-activedescendant": highlightedIndex >= 0
|
|
147
|
+
? `${id}-option-${highlightedIndex}`
|
|
148
|
+
: undefined, tabIndex: -1, onKeyDown: handleListboxKeyDown, className: "bg-[#0a0a0f] border border-white/10 rounded-2xl p-2 shadow-xl backdrop-blur-sm focus:outline-none", children: options.map((option, index) => (_jsx("div", { id: `${id}-option-${index}`, role: "option", "aria-selected": selectedValue === option.value, onClick: () => handleSelect(option.value), onMouseEnter: () => setHighlightedIndex(index), className: cn('w-full text-left px-4 py-3 rounded-xl transition-all cursor-pointer', dropdownSizeClasses[selectSize], selectedValue === option.value &&
|
|
149
|
+
'bg-violet-600/20 text-white', highlightedIndex === index &&
|
|
150
|
+
selectedValue !== option.value &&
|
|
151
|
+
'bg-white/5', selectedValue !== option.value &&
|
|
152
|
+
highlightedIndex !== index &&
|
|
153
|
+
'text-white hover:bg-white/5'), children: option.label }, option.value))) }) })), error && (_jsx("p", { id: errorId, className: cn('mt-2 text-sm text-red-400', errorClassName), children: error }))] }));
|
|
154
|
+
};
|
|
155
|
+
Select.displayName = 'Select';
|
|
156
|
+
//# sourceMappingURL=Select.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../src/components/inputs/Select.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
interface TagInputProps {
|
|
2
|
+
label: string;
|
|
3
|
+
placeholder: string;
|
|
4
|
+
tags: string[];
|
|
5
|
+
onTagsChange: (tags: string[]) => void;
|
|
6
|
+
helpText?: string;
|
|
7
|
+
}
|
|
8
|
+
export declare function TagInput({ label, placeholder, tags, onTagsChange, helpText, }: TagInputProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export {};
|
|
10
|
+
//# sourceMappingURL=TagInput.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagInput.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/TagInput.tsx"],"names":[],"mappings":"AAGA,UAAU,aAAa;IACrB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,IAAI,EAAE,MAAM,EAAE,CAAC;IACf,YAAY,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACvC,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB;AAED,wBAAgB,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,YAAY,EACZ,QAAQ,GACT,EAAE,aAAa,2CAiDf"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
+
import { useState } from 'react';
|
|
3
|
+
import { LuX } from 'react-icons/lu';
|
|
4
|
+
export function TagInput({ label, placeholder, tags, onTagsChange, helpText, }) {
|
|
5
|
+
const [input, setInput] = useState('');
|
|
6
|
+
const handleAddTag = (e) => {
|
|
7
|
+
if (e.key === 'Enter') {
|
|
8
|
+
e.preventDefault();
|
|
9
|
+
if (input.trim()) {
|
|
10
|
+
onTagsChange([...tags, input.trim()]);
|
|
11
|
+
setInput('');
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
const handleRemoveTag = (index) => {
|
|
16
|
+
onTagsChange(tags.filter((_, i) => i !== index));
|
|
17
|
+
};
|
|
18
|
+
return (_jsxs("div", { className: "space-y-1.5", children: [_jsx("label", { className: "text-xs font-medium text-gray-300 ml-1 block", children: label }), _jsxs("div", { className: "w-full bg-white/5 border border-white/10 rounded-2xl px-3 py-2 flex flex-wrap gap-2 focus-within:border-violet-500/50 transition-colors shadow-inner min-h-[46px]", children: [tags.map((tag, index) => (_jsxs("span", { className: "bg-violet-500/20 border border-violet-500/20 text-violet-100 text-[11px] font-medium px-2 py-0.5 rounded-md flex items-center gap-1", children: [tag, _jsx("button", { onClick: () => handleRemoveTag(index), className: "hover:text-white text-violet-300 focus:outline-none", children: _jsx(LuX, { className: "text-[12px]" }) })] }, index))), _jsx("input", { className: "bg-transparent border-none focus:ring-0 text-sm p-0 text-gray-300 placeholder:text-gray-600 flex-grow min-w-[80px] h-6 self-center outline-none", placeholder: placeholder, type: "text", value: input, onChange: e => setInput(e.target.value), onKeyDown: handleAddTag })] }), helpText && _jsx("p", { className: "text-[10px] text-gray-500 ml-1", children: helpText })] }));
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=TagInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TagInput.js","sourceRoot":"","sources":["../../../src/components/inputs/TagInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,QAAQ,EAAiB,MAAM,OAAO,CAAC;AAChD,OAAO,EAAE,GAAG,EAAE,MAAM,gBAAgB,CAAC;AAUrC,MAAM,UAAU,QAAQ,CAAC,EACvB,KAAK,EACL,WAAW,EACX,IAAI,EACJ,YAAY,EACZ,QAAQ,GACM;IACd,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEvC,MAAM,YAAY,GAAG,CAAC,CAAkC,EAAE,EAAE;QAC1D,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,EAAE,CAAC;YACtB,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,KAAK,CAAC,IAAI,EAAE,EAAE,CAAC;gBACjB,YAAY,CAAC,CAAC,GAAG,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;gBACtC,QAAQ,CAAC,EAAE,CAAC,CAAC;YACf,CAAC;QACH,CAAC;IACH,CAAC,CAAC;IAEF,MAAM,eAAe,GAAG,CAAC,KAAa,EAAE,EAAE;QACxC,YAAY,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC;IACnD,CAAC,CAAC;IAEF,OAAO,CACL,eAAK,SAAS,EAAC,aAAa,aAC1B,gBAAO,SAAS,EAAC,8CAA8C,YAC5D,KAAK,GACA,EACR,eAAK,SAAS,EAAC,mKAAmK,aAC/K,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,KAAK,EAAE,EAAE,CAAC,CACxB,gBAEE,SAAS,EAAC,qIAAqI,aAE9I,GAAG,EACJ,iBACE,OAAO,EAAE,GAAG,EAAE,CAAC,eAAe,CAAC,KAAK,CAAC,EACrC,SAAS,EAAC,qDAAqD,YAE/D,KAAC,GAAG,IAAC,SAAS,EAAC,aAAa,GAAG,GACxB,KATJ,KAAK,CAUL,CACR,CAAC,EACF,gBACE,SAAS,EAAC,iJAAiJ,EAC3J,WAAW,EAAE,WAAW,EACxB,IAAI,EAAC,MAAM,EACX,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACvC,SAAS,EAAE,YAAY,GACvB,IACE,EACL,QAAQ,IAAI,YAAG,SAAS,EAAC,gCAAgC,YAAE,QAAQ,GAAK,IACrE,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
export interface ToggleOptionProps {
|
|
3
|
+
label: string;
|
|
4
|
+
description?: string;
|
|
5
|
+
checked?: boolean;
|
|
6
|
+
defaultChecked?: boolean;
|
|
7
|
+
onChange?: (checked: boolean) => void;
|
|
8
|
+
disabled?: boolean;
|
|
9
|
+
size?: 'sm' | 'md' | 'lg';
|
|
10
|
+
variant?: 'default' | 'primary' | 'success' | 'warning';
|
|
11
|
+
labelClassName?: string;
|
|
12
|
+
descriptionClassName?: string;
|
|
13
|
+
toggleClassName?: string;
|
|
14
|
+
containerClassName?: string;
|
|
15
|
+
layout?: 'horizontal' | 'vertical';
|
|
16
|
+
icon?: React.ReactNode;
|
|
17
|
+
id?: string;
|
|
18
|
+
}
|
|
19
|
+
export declare function ToggleOption({ label, description, checked: controlledChecked, defaultChecked, onChange, disabled, size, variant, labelClassName, descriptionClassName, toggleClassName, containerClassName, layout, icon, id: providedId, }: ToggleOptionProps): import("react/jsx-runtime").JSX.Element;
|
|
20
|
+
//# sourceMappingURL=ToggleOption.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ToggleOption.d.ts","sourceRoot":"","sources":["../../../src/components/inputs/ToggleOption.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;IAC1B,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,CAAC;IACxD,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;IACnC,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,wBAAgB,YAAY,CAAC,EAC3B,KAAK,EACL,WAAW,EACX,OAAO,EAAE,iBAAiB,EAC1B,cAAsB,EACtB,QAAQ,EACR,QAAgB,EAChB,IAAW,EACX,OAAmB,EACnB,cAAmB,EACnB,oBAAyB,EACzB,eAAoB,EACpB,kBAAuB,EACvB,MAAqB,EACrB,IAAI,EACJ,EAAE,EAAE,UAAU,GACf,EAAE,iBAAiB,2CAsInB"}
|