@pollinations/ui 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -10
- package/dist/{Button-DMJ2K6Gr.d.ts → Button-Bn8pGg6N.d.ts} +1 -1
- package/dist/{Button-CNzpisJf.d.cts → Button-CWUBCiIc.d.cts} +1 -1
- package/dist/{Chip-BS8ronOu.d.ts → Chip-C5impfYd.d.ts} +2 -2
- package/dist/{Chip-DyqWrq0r.d.cts → Chip-SM52sUbZ.d.cts} +2 -2
- package/dist/app.css +1 -1
- package/dist/auth/index.cjs +1 -9
- package/dist/auth/index.cjs.map +1 -1
- package/dist/auth/index.d.cts +1 -2
- package/dist/auth/index.d.ts +1 -2
- package/dist/auth/index.js +1 -9
- package/dist/auth/index.js.map +1 -1
- package/dist/auth/sdk.d.cts +2 -2
- package/dist/auth/sdk.d.ts +2 -2
- package/dist/index.cjs +354 -177
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +47 -9
- package/dist/index.d.ts +47 -9
- package/dist/index.js +346 -176
- package/dist/index.js.map +1 -1
- package/dist/modality/index.cjs +6 -38
- package/dist/modality/index.cjs.map +1 -1
- package/dist/modality/index.d.cts +7 -27
- package/dist/modality/index.d.ts +7 -27
- package/dist/modality/index.js +6 -37
- package/dist/modality/index.js.map +1 -1
- package/dist/styles.css +1 -1
- package/dist/theme-VMRlhqST.d.cts +9 -0
- package/dist/theme-VMRlhqST.d.ts +9 -0
- package/dist/wallet/index.cjs +4 -1
- package/dist/wallet/index.cjs.map +1 -1
- package/dist/wallet/index.d.cts +2 -2
- package/dist/wallet/index.d.ts +2 -2
- package/dist/wallet/index.js +4 -1
- package/dist/wallet/index.js.map +1 -1
- package/dist/wallet/sdk.cjs +4 -1
- package/dist/wallet/sdk.cjs.map +1 -1
- package/dist/wallet/sdk.js +4 -1
- package/dist/wallet/sdk.js.map +1 -1
- package/package.json +3 -8
- package/dist/showcase/index.cjs +0 -2851
- package/dist/showcase/index.cjs.map +0 -1
- package/dist/showcase/index.d.cts +0 -19
- package/dist/showcase/index.d.ts +0 -19
- package/dist/showcase/index.js +0 -2839
- package/dist/showcase/index.js.map +0 -1
- package/dist/theme-DfHMjWB7.d.cts +0 -16
- package/dist/theme-DfHMjWB7.d.ts +0 -16
package/README.md
CHANGED
|
@@ -109,22 +109,21 @@ Wallet-specific colors and utilities live in a separate stylesheet:
|
|
|
109
109
|
These are intentionally bare wrappers around `useAuth*` hooks. They render
|
|
110
110
|
the data and nothing else — no default copy, no default theme, no default
|
|
111
111
|
intent. The app composes layout, copy, and color.
|
|
112
|
-
- `@pollinations/ui/showcase` exports `DesignShowcase`, a package-owned
|
|
113
|
-
internal preview surface for rendering primitives and tokens together.
|
|
114
112
|
- `@pollinations/ui/wallet` exports SDK-free wallet-specific display helpers
|
|
115
113
|
and recipes: `formatPollen`, `PaidChip`, `TierChip`, `WalletDot`,
|
|
116
114
|
`WalletBalanceCard`, `PAID_BALANCE_CHART_COLOR`, and
|
|
117
115
|
`TIER_BALANCE_CHART_COLOR`.
|
|
118
116
|
- `@pollinations/ui/wallet/sdk` exports SDK-backed wallet components:
|
|
119
117
|
`Balance`, `KeyBudget`, `KeyExpiry`, `KeyModels`, and `KeyPrefix`.
|
|
120
|
-
- `@pollinations/ui/modality` exports model-modality color recipes
|
|
121
|
-
`ModalityButton`.
|
|
118
|
+
- `@pollinations/ui/modality` exports model-modality color recipes.
|
|
122
119
|
- `@pollinations/ui/assets/*` exports canonical Pollinations source SVGs:
|
|
123
120
|
`logo.svg` and `logo-wordmark.svg`.
|
|
124
|
-
- **Design primitives** — `Button`, `
|
|
125
|
-
`CopyButton`, `Dialog`, `Dropdown`, `ExternalLinkButton`,
|
|
126
|
-
`InfoTip`, `Input`, `MultiSelect`, `PeriodPicker`,
|
|
127
|
-
`
|
|
121
|
+
- **Design primitives** — `Alert`, `Button`, `ButtonGroup`, `Chip`, `ChevronIcon`,
|
|
122
|
+
`Collapsible`, `CopyButton`, `Dialog`, `Dropdown`, `ExternalLinkButton`,
|
|
123
|
+
`IconButton`, `InfoTip`, `Input`, `MultiSelect`, `PeriodPicker`,
|
|
124
|
+
`ScrollArea`, `Section`, `Slider`, `StatCard`, `Surface`, `Switch`,
|
|
125
|
+
`Table`, `TableBody`, `TableCell`, `TableHead`, `TableHeaderCell`,
|
|
126
|
+
`TableRow`, `TabButton`, `Tooltip`.
|
|
128
127
|
- **Helpers** — `cn`, `useScrollLock`, `currentPeriod`,
|
|
129
128
|
`getPeriodBucketKeys`, `periodBucketKeyToDate`.
|
|
130
129
|
- **Theme** — `themes` (runtime array of theme names), `ThemeName` (type).
|
|
@@ -140,8 +139,8 @@ from `@pollinations/sdk/react` (`useAccountKeyUsage`, `useAccountKey`,
|
|
|
140
139
|
such as auth, wallet, and modality.
|
|
141
140
|
- Public subpath exports (`@pollinations/ui/auth`,
|
|
142
141
|
`@pollinations/ui/auth/sdk`, `@pollinations/ui/wallet`,
|
|
143
|
-
`@pollinations/ui/wallet/sdk`, `@pollinations/ui/modality
|
|
144
|
-
|
|
142
|
+
`@pollinations/ui/wallet/sdk`, `@pollinations/ui/modality`) are built
|
|
143
|
+
directly from those modules.
|
|
145
144
|
|
|
146
145
|
## Theming
|
|
147
146
|
|
|
@@ -204,6 +203,12 @@ Wallet tokens are public when `@pollinations/ui/wallet.css` is imported:
|
|
|
204
203
|
| `--polli-color-danger-bg-light` | Error surface background. |
|
|
205
204
|
| `--polli-color-danger-text` | Error text foreground. |
|
|
206
205
|
| `--polli-color-danger-border` | Error border. |
|
|
206
|
+
| `--polli-color-success-bg-light` | Success surface background. |
|
|
207
|
+
| `--polli-color-success-text` | Success text foreground. |
|
|
208
|
+
| `--polli-color-success-border` | Success border. |
|
|
209
|
+
| `--polli-color-warning-bg-light` | Warning surface background. |
|
|
210
|
+
| `--polli-color-warning-text` | Warning text foreground. |
|
|
211
|
+
| `--polli-color-warning-border` | Warning border. |
|
|
207
212
|
|
|
208
213
|
**Example:**
|
|
209
214
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { PropsWithChildren } from 'react';
|
|
3
|
-
import { T as ThemeName } from './theme-
|
|
3
|
+
import { T as ThemeName } from './theme-VMRlhqST.js';
|
|
4
4
|
|
|
5
5
|
/** Button only supports `danger`. Label/status color recipes live on Chip. */
|
|
6
6
|
type ButtonIntent = "danger";
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { PropsWithChildren } from 'react';
|
|
3
|
-
import { T as ThemeName } from './theme-
|
|
3
|
+
import { T as ThemeName } from './theme-VMRlhqST.cjs';
|
|
4
4
|
|
|
5
5
|
/** Button only supports `danger`. Label/status color recipes live on Chip. */
|
|
6
6
|
type ButtonIntent = "danger";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { FC, ComponentPropsWithoutRef } from 'react';
|
|
2
|
-
import { T as ThemeName } from './theme-
|
|
2
|
+
import { T as ThemeName } from './theme-VMRlhqST.js';
|
|
3
3
|
|
|
4
4
|
/** Semantic chip labels for status and metadata badges. */
|
|
5
|
-
type ChipIntent = "news" | "alpha" | "neutral";
|
|
5
|
+
type ChipIntent = "news" | "alpha" | "neutral" | "success" | "warning" | "danger";
|
|
6
6
|
declare const chipSizes: {
|
|
7
7
|
readonly sm: "polli:px-2 polli:py-0.5 polli:text-xs";
|
|
8
8
|
readonly md: "polli:px-2.5 polli:py-0.5 polli:text-sm";
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { FC, ComponentPropsWithoutRef } from 'react';
|
|
2
|
-
import { T as ThemeName } from './theme-
|
|
2
|
+
import { T as ThemeName } from './theme-VMRlhqST.cjs';
|
|
3
3
|
|
|
4
4
|
/** Semantic chip labels for status and metadata badges. */
|
|
5
|
-
type ChipIntent = "news" | "alpha" | "neutral";
|
|
5
|
+
type ChipIntent = "news" | "alpha" | "neutral" | "success" | "warning" | "danger";
|
|
6
6
|
declare const chipSizes: {
|
|
7
7
|
readonly sm: "polli:px-2 polli:py-0.5 polli:text-xs";
|
|
8
8
|
readonly md: "polli:px-2.5 polli:py-0.5 polli:text-sm";
|
package/dist/app.css
CHANGED
package/dist/auth/index.cjs
CHANGED
|
@@ -199,18 +199,10 @@ function ErrorBanner({ children }) {
|
|
|
199
199
|
}
|
|
200
200
|
function AuthInfoCard({
|
|
201
201
|
title = "Authorize",
|
|
202
|
-
titleId,
|
|
203
202
|
children
|
|
204
203
|
}) {
|
|
205
204
|
return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("div", { className: "polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4", children: [
|
|
206
|
-
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
207
|
-
"p",
|
|
208
|
-
{
|
|
209
|
-
id: titleId,
|
|
210
|
-
className: "polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft",
|
|
211
|
-
children: title
|
|
212
|
-
}
|
|
213
|
-
),
|
|
205
|
+
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("p", { className: "polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft", children: title }),
|
|
214
206
|
children
|
|
215
207
|
] });
|
|
216
208
|
}
|
package/dist/auth/index.cjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/modules/auth/index.ts","../../src/primitives/Dialog.tsx","../../src/lib/cn.ts","../../src/modules/auth/AuthModal.tsx"],"sourcesContent":["export {\n AuthInfoCard,\n type AuthInfoCardProps,\n AuthModal,\n AuthModalHeader,\n type AuthModalHeaderProps,\n AuthModalLoading,\n type AuthModalProps,\n ErrorBanner,\n} from \"./AuthModal.tsx\";\n","import { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport type { FC, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn.ts\";\nimport type { ThemeName } from \"../theme.ts\";\n\nconst sizeClasses = {\n sm: \"polli:max-w-md\",\n md: \"polli:max-w-xl\",\n lg: \"polli:max-w-2xl\",\n} as const;\n\nexport type DialogProps = {\n open: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: ReactNode;\n triggerAsChild?: boolean;\n triggerClassName?: string;\n title?: ReactNode;\n titleClassName?: string;\n ariaLabel?: string;\n labelledBy?: string;\n theme?: ThemeName;\n size?: keyof typeof sizeClasses;\n showBackdrop?: boolean;\n backdropClassName?: string;\n positionerClassName?: string;\n contentClassName?: string;\n children: ReactNode;\n};\n\nexport const Dialog: FC<DialogProps> = ({\n open,\n onOpenChange,\n trigger,\n triggerAsChild = false,\n triggerClassName,\n title,\n titleClassName,\n ariaLabel,\n labelledBy,\n theme = \"blue\",\n size = \"md\",\n showBackdrop = true,\n backdropClassName,\n positionerClassName,\n contentClassName,\n children,\n}) => (\n <ArkDialog.Root\n open={open}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n {trigger && (\n <ArkDialog.Trigger\n asChild={triggerAsChild}\n className={triggerClassName}\n >\n {trigger}\n </ArkDialog.Trigger>\n )}\n <Portal>\n {showBackdrop && (\n <ArkDialog.Backdrop\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[100] polli:bg-gray-950/50\",\n backdropClassName,\n )}\n />\n )}\n <ArkDialog.Positioner\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[110] polli:flex polli:h-dvh polli:items-start polli:justify-center polli:overflow-hidden polli:p-4\",\n positionerClassName,\n )}\n >\n <ArkDialog.Content\n data-theme={theme}\n aria-label={ariaLabel}\n aria-labelledby={labelledBy}\n className={cn(\n \"polli:my-auto polli:w-full polli:overflow-hidden polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-white polli:shadow-lg\",\n sizeClasses[size],\n contentClassName,\n )}\n >\n {title && (\n <DialogTitle\n className={cn(\n \"polli:px-6 polli:pt-6 polli:font-subheading polli:text-xl polli:text-theme-text-strong\",\n titleClassName,\n )}\n >\n {title}\n </DialogTitle>\n )}\n {children}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n </Portal>\n </ArkDialog.Root>\n);\n\nexport const DialogTitle = ArkDialog.Title;\n","import { clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({ prefix: \"polli\" });\n\n/** Internal class merge for polli:-prefixed package primitive classes. */\nexport function cn(...inputs: (string | undefined | null | false)[]) {\n return twMerge(clsx(...inputs));\n}\n","import type { CSSProperties, ReactNode } from \"react\";\nimport logoUrl from \"../../assets/logo.svg\";\nimport { Dialog } from \"../../primitives/Dialog.tsx\";\n\nconst authLogoMask: CSSProperties = {\n WebkitMask: `url(${logoUrl}) center / contain no-repeat`,\n mask: `url(${logoUrl}) center / contain no-repeat`,\n};\n\nexport type AuthModalProps = {\n children: ReactNode;\n dialog?: {\n label?: string;\n labelledBy?: string;\n };\n tone?: \"default\" | \"error\";\n};\n\nexport function AuthModal({\n children,\n dialog,\n tone = \"default\",\n}: AuthModalProps) {\n const borderClass =\n tone === \"error\"\n ? \"polli:border-intent-danger-border\"\n : \"polli:border-theme-border\";\n return (\n <Dialog\n open\n theme=\"amber\"\n showBackdrop={false}\n ariaLabel={dialog?.label}\n labelledBy={dialog?.labelledBy}\n positionerClassName=\"polli:items-start polli:overflow-y-auto polli:bg-theme-bg-pale\"\n contentClassName={`polli:bg-surface-white polli:border-2 ${borderClass} polli:rounded-lg polli:shadow-lg polli:max-w-xl polli:w-full polli:my-auto`}\n >\n {children}\n </Dialog>\n );\n}\n\nexport type AuthModalHeaderProps = {\n children?: ReactNode;\n};\n\nexport function AuthModalHeader({ children }: AuthModalHeaderProps) {\n const logo = (\n <a\n href=\"https://pollinations.ai\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"polli:block polli:shrink-0 polli:text-theme-text-strong\"\n aria-label=\"pollinations.ai\"\n >\n <span className=\"polli:sr-only\">pollinations.ai</span>\n <span\n aria-hidden=\"true\"\n className=\"polli:block polli:h-8 polli:w-8 polli:bg-current\"\n style={authLogoMask}\n />\n </a>\n );\n if (!children) {\n return (\n <div className=\"polli:flex polli:justify-start polli:px-6 polli:pt-6\">\n {logo}\n </div>\n );\n }\n return (\n <div className=\"polli:px-6 polli:pt-6 polli:pb-2\">\n <div className=\"polli:flex polli:items-center polli:justify-between polli:gap-3\">\n {logo}\n {children}\n </div>\n </div>\n );\n}\n\nexport function AuthModalLoading() {\n return (\n <AuthModal>\n <AuthModalHeader />\n <div className=\"polli:px-8 polli:pt-2 polli:pb-8 polli:text-center\">\n <p className=\"polli:text-theme-text-strong\">Loading...</p>\n </div>\n </AuthModal>\n );\n}\n\nexport function ErrorBanner({ children }: { children: ReactNode }) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-intent-danger-border polli:bg-intent-danger-bg-light polli:p-4\">\n <p className=\"polli:text-sm polli:text-intent-danger-text\">\n {children}\n </p>\n </div>\n );\n}\n\nexport type AuthInfoCardProps = {\n title?: string;\n titleId?: string;\n children: ReactNode;\n};\n\nexport function AuthInfoCard({\n title = \"Authorize\",\n titleId,\n children,\n}: AuthInfoCardProps) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4\">\n <p\n id={titleId}\n className=\"polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft\"\n >\n {title}\n </p>\n {children}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;A;;;;;ACAA,oBAAoC;AACpC,oBAAuB;;;ACDvB,kBAAqB;AACrB,4BAAoC;AAEpC,IAAM,cAAU,2CAAoB,EAAE,QAAQ,QAAQ,CAAC;AAGhD,SAAS,MAAM,QAA+C;AACjE,SAAO,YAAQ,kBAAK,GAAG,MAAM,CAAC;AAClC;;;AD8CY;AAhDZ,IAAM,cAAc;AAAA,EAChB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACR;AAqBO,IAAM,SAA0B,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,MACI;AAAA,EAAC,cAAAA,OAAU;AAAA,EAAV;AAAA,IACG;AAAA,IACA,cAAc,CAAC,YAAY,eAAe,QAAQ,IAAI;AAAA,IAErD;AAAA,iBACG;AAAA,QAAC,cAAAA,OAAU;AAAA,QAAV;AAAA,UACG,SAAS;AAAA,UACT,WAAW;AAAA,UAEV;AAAA;AAAA,MACL;AAAA,MAEJ,6CAAC,wBACI;AAAA,wBACG;AAAA,UAAC,cAAAA,OAAU;AAAA,UAAV;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA;AAAA,YACJ;AAAA;AAAA,QACJ;AAAA,QAEJ;AAAA,UAAC,cAAAA,OAAU;AAAA,UAAV;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA;AAAA,YACJ;AAAA,YAEA;AAAA,cAAC,cAAAA,OAAU;AAAA,cAAV;AAAA,gBACG,cAAY;AAAA,gBACZ,cAAY;AAAA,gBACZ,mBAAiB;AAAA,gBACjB,WAAW;AAAA,kBACP;AAAA,kBACA,YAAY,IAAI;AAAA,kBAChB;AAAA,gBACJ;AAAA,gBAEC;AAAA,2BACG;AAAA,oBAAC;AAAA;AAAA,sBACG,WAAW;AAAA,wBACP;AAAA,wBACA;AAAA,sBACJ;AAAA,sBAEC;AAAA;AAAA,kBACL;AAAA,kBAEH;AAAA;AAAA;AAAA,YACL;AAAA;AAAA,QACJ;AAAA,SACJ;AAAA;AAAA;AACJ;AAGG,IAAM,cAAc,cAAAA,OAAU;;;AE3E7B,IAAAC,sBAAA;AAxBR,IAAM,eAA8B;AAAA,EAChC,YAAY,OAAO,YAAO;AAAA,EAC1B,MAAM,OAAO,YAAO;AACxB;AAWO,SAAS,UAAU;AAAA,EACtB;AAAA,EACA;AAAA,EACA,OAAO;AACX,GAAmB;AACf,QAAM,cACF,SAAS,UACH,sCACA;AACV,SACI;AAAA,IAAC;AAAA;AAAA,MACG,MAAI;AAAA,MACJ,OAAM;AAAA,MACN,cAAc;AAAA,MACd,WAAW,QAAQ;AAAA,MACnB,YAAY,QAAQ;AAAA,MACpB,qBAAoB;AAAA,MACpB,kBAAkB,yCAAyC,WAAW;AAAA,MAErE;AAAA;AAAA,EACL;AAER;AAMO,SAAS,gBAAgB,EAAE,SAAS,GAAyB;AAChE,QAAM,OACF;AAAA,IAAC;AAAA;AAAA,MACG,MAAK;AAAA,MACL,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,WAAU;AAAA,MACV,cAAW;AAAA,MAEX;AAAA,qDAAC,UAAK,WAAU,iBAAgB,6BAAe;AAAA,QAC/C;AAAA,UAAC;AAAA;AAAA,YACG,eAAY;AAAA,YACZ,WAAU;AAAA,YACV,OAAO;AAAA;AAAA,QACX;AAAA;AAAA;AAAA,EACJ;AAEJ,MAAI,CAAC,UAAU;AACX,WACI,6CAAC,SAAI,WAAU,wDACV,gBACL;AAAA,EAER;AACA,SACI,6CAAC,SAAI,WAAU,oCACX,wDAAC,SAAI,WAAU,mEACV;AAAA;AAAA,IACA;AAAA,KACL,GACJ;AAER;AAEO,SAAS,mBAAmB;AAC/B,SACI,8CAAC,aACG;AAAA,iDAAC,mBAAgB;AAAA,IACjB,6CAAC,SAAI,WAAU,sDACX,uDAAC,OAAE,WAAU,gCAA+B,wBAAU,GAC1D;AAAA,KACJ;AAER;AAEO,SAAS,YAAY,EAAE,SAAS,GAA4B;AAC/D,SACI,6CAAC,SAAI,WAAU,+GACX,uDAAC,OAAE,WAAU,+CACR,UACL,GACJ;AAER;AAQO,SAAS,aAAa;AAAA,EACzB,QAAQ;AAAA,EACR;AAAA,EACA;AACJ,GAAsB;AAClB,SACI,8CAAC,SAAI,WAAU,8FACX;AAAA;AAAA,MAAC;AAAA;AAAA,QACG,IAAI;AAAA,QACJ,WAAU;AAAA,QAET;AAAA;AAAA,IACL;AAAA,IACC;AAAA,KACL;AAER;","names":["ArkDialog","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/modules/auth/index.ts","../../src/primitives/Dialog.tsx","../../src/lib/cn.ts","../../src/modules/auth/AuthModal.tsx"],"sourcesContent":["export {\n AuthInfoCard,\n type AuthInfoCardProps,\n AuthModal,\n AuthModalHeader,\n type AuthModalHeaderProps,\n AuthModalLoading,\n type AuthModalProps,\n ErrorBanner,\n} from \"./AuthModal.tsx\";\n","import { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport type { FC, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn.ts\";\nimport type { ThemeName } from \"../theme.ts\";\n\nconst sizeClasses = {\n sm: \"polli:max-w-md\",\n md: \"polli:max-w-xl\",\n lg: \"polli:max-w-2xl\",\n} as const;\n\nexport type DialogProps = {\n open: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: ReactNode;\n triggerAsChild?: boolean;\n triggerClassName?: string;\n title?: ReactNode;\n titleClassName?: string;\n ariaLabel?: string;\n labelledBy?: string;\n theme?: ThemeName;\n size?: keyof typeof sizeClasses;\n showBackdrop?: boolean;\n backdropClassName?: string;\n positionerClassName?: string;\n contentClassName?: string;\n children: ReactNode;\n};\n\nexport const Dialog: FC<DialogProps> = ({\n open,\n onOpenChange,\n trigger,\n triggerAsChild = false,\n triggerClassName,\n title,\n titleClassName,\n ariaLabel,\n labelledBy,\n theme = \"blue\",\n size = \"md\",\n showBackdrop = true,\n backdropClassName,\n positionerClassName,\n contentClassName,\n children,\n}) => (\n <ArkDialog.Root\n open={open}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n {trigger && (\n <ArkDialog.Trigger\n asChild={triggerAsChild}\n className={triggerClassName}\n >\n {trigger}\n </ArkDialog.Trigger>\n )}\n <Portal>\n {showBackdrop && (\n <ArkDialog.Backdrop\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[100] polli:bg-gray-950/50\",\n backdropClassName,\n )}\n />\n )}\n <ArkDialog.Positioner\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[110] polli:flex polli:h-dvh polli:items-start polli:justify-center polli:overflow-hidden polli:p-4\",\n positionerClassName,\n )}\n >\n <ArkDialog.Content\n data-theme={theme}\n aria-label={ariaLabel}\n aria-labelledby={labelledBy}\n className={cn(\n \"polli:my-auto polli:w-full polli:overflow-hidden polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-white polli:shadow-lg\",\n sizeClasses[size],\n contentClassName,\n )}\n >\n {title && (\n <DialogTitle\n className={cn(\n \"polli:px-6 polli:pt-6 polli:font-subheading polli:text-xl polli:text-theme-text-strong\",\n titleClassName,\n )}\n >\n {title}\n </DialogTitle>\n )}\n {children}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n </Portal>\n </ArkDialog.Root>\n);\n\nexport const DialogTitle = ArkDialog.Title;\n","import { clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({ prefix: \"polli\" });\n\n/** Internal class merge for polli:-prefixed package primitive classes. */\nexport function cn(...inputs: (string | undefined | null | false)[]) {\n return twMerge(clsx(...inputs));\n}\n","import type { CSSProperties, ReactNode } from \"react\";\nimport logoUrl from \"../../assets/logo.svg\";\nimport { Dialog } from \"../../primitives/Dialog.tsx\";\n\nconst authLogoMask: CSSProperties = {\n WebkitMask: `url(${logoUrl}) center / contain no-repeat`,\n mask: `url(${logoUrl}) center / contain no-repeat`,\n};\n\nexport type AuthModalProps = {\n children: ReactNode;\n dialog?: {\n label?: string;\n labelledBy?: string;\n };\n tone?: \"default\" | \"error\";\n};\n\nexport function AuthModal({\n children,\n dialog,\n tone = \"default\",\n}: AuthModalProps) {\n const borderClass =\n tone === \"error\"\n ? \"polli:border-intent-danger-border\"\n : \"polli:border-theme-border\";\n return (\n <Dialog\n open\n theme=\"amber\"\n showBackdrop={false}\n ariaLabel={dialog?.label}\n labelledBy={dialog?.labelledBy}\n positionerClassName=\"polli:items-start polli:overflow-y-auto polli:bg-theme-bg-pale\"\n contentClassName={`polli:bg-surface-white polli:border-2 ${borderClass} polli:rounded-lg polli:shadow-lg polli:max-w-xl polli:w-full polli:my-auto`}\n >\n {children}\n </Dialog>\n );\n}\n\nexport type AuthModalHeaderProps = {\n children?: ReactNode;\n};\n\nexport function AuthModalHeader({ children }: AuthModalHeaderProps) {\n const logo = (\n <a\n href=\"https://pollinations.ai\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"polli:block polli:shrink-0 polli:text-theme-text-strong\"\n aria-label=\"pollinations.ai\"\n >\n <span className=\"polli:sr-only\">pollinations.ai</span>\n <span\n aria-hidden=\"true\"\n className=\"polli:block polli:h-8 polli:w-8 polli:bg-current\"\n style={authLogoMask}\n />\n </a>\n );\n if (!children) {\n return (\n <div className=\"polli:flex polli:justify-start polli:px-6 polli:pt-6\">\n {logo}\n </div>\n );\n }\n return (\n <div className=\"polli:px-6 polli:pt-6 polli:pb-2\">\n <div className=\"polli:flex polli:items-center polli:justify-between polli:gap-3\">\n {logo}\n {children}\n </div>\n </div>\n );\n}\n\nexport function AuthModalLoading() {\n return (\n <AuthModal>\n <AuthModalHeader />\n <div className=\"polli:px-8 polli:pt-2 polli:pb-8 polli:text-center\">\n <p className=\"polli:text-theme-text-strong\">Loading...</p>\n </div>\n </AuthModal>\n );\n}\n\nexport function ErrorBanner({ children }: { children: ReactNode }) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-intent-danger-border polli:bg-intent-danger-bg-light polli:p-4\">\n <p className=\"polli:text-sm polli:text-intent-danger-text\">\n {children}\n </p>\n </div>\n );\n}\n\nexport type AuthInfoCardProps = {\n title?: string;\n children: ReactNode;\n};\n\nexport function AuthInfoCard({\n title = \"Authorize\",\n children,\n}: AuthInfoCardProps) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4\">\n <p className=\"polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft\">\n {title}\n </p>\n {children}\n </div>\n );\n}\n"],"mappings":"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","names":["ArkDialog","import_jsx_runtime"]}
|
package/dist/auth/index.d.cts
CHANGED
|
@@ -20,9 +20,8 @@ declare function ErrorBanner({ children }: {
|
|
|
20
20
|
}): react_jsx_runtime.JSX.Element;
|
|
21
21
|
type AuthInfoCardProps = {
|
|
22
22
|
title?: string;
|
|
23
|
-
titleId?: string;
|
|
24
23
|
children: ReactNode;
|
|
25
24
|
};
|
|
26
|
-
declare function AuthInfoCard({ title,
|
|
25
|
+
declare function AuthInfoCard({ title, children, }: AuthInfoCardProps): react_jsx_runtime.JSX.Element;
|
|
27
26
|
|
|
28
27
|
export { AuthInfoCard, type AuthInfoCardProps, AuthModal, AuthModalHeader, type AuthModalHeaderProps, AuthModalLoading, type AuthModalProps, ErrorBanner };
|
package/dist/auth/index.d.ts
CHANGED
|
@@ -20,9 +20,8 @@ declare function ErrorBanner({ children }: {
|
|
|
20
20
|
}): react_jsx_runtime.JSX.Element;
|
|
21
21
|
type AuthInfoCardProps = {
|
|
22
22
|
title?: string;
|
|
23
|
-
titleId?: string;
|
|
24
23
|
children: ReactNode;
|
|
25
24
|
};
|
|
26
|
-
declare function AuthInfoCard({ title,
|
|
25
|
+
declare function AuthInfoCard({ title, children, }: AuthInfoCardProps): react_jsx_runtime.JSX.Element;
|
|
27
26
|
|
|
28
27
|
export { AuthInfoCard, type AuthInfoCardProps, AuthModal, AuthModalHeader, type AuthModalHeaderProps, AuthModalLoading, type AuthModalProps, ErrorBanner };
|
package/dist/auth/index.js
CHANGED
|
@@ -169,18 +169,10 @@ function ErrorBanner({ children }) {
|
|
|
169
169
|
}
|
|
170
170
|
function AuthInfoCard({
|
|
171
171
|
title = "Authorize",
|
|
172
|
-
titleId,
|
|
173
172
|
children
|
|
174
173
|
}) {
|
|
175
174
|
return /* @__PURE__ */ jsxs2("div", { className: "polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4", children: [
|
|
176
|
-
/* @__PURE__ */ jsx2(
|
|
177
|
-
"p",
|
|
178
|
-
{
|
|
179
|
-
id: titleId,
|
|
180
|
-
className: "polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft",
|
|
181
|
-
children: title
|
|
182
|
-
}
|
|
183
|
-
),
|
|
175
|
+
/* @__PURE__ */ jsx2("p", { className: "polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft", children: title }),
|
|
184
176
|
children
|
|
185
177
|
] });
|
|
186
178
|
}
|
package/dist/auth/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/primitives/Dialog.tsx","../../src/lib/cn.ts","../../src/modules/auth/AuthModal.tsx"],"sourcesContent":["import { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport type { FC, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn.ts\";\nimport type { ThemeName } from \"../theme.ts\";\n\nconst sizeClasses = {\n sm: \"polli:max-w-md\",\n md: \"polli:max-w-xl\",\n lg: \"polli:max-w-2xl\",\n} as const;\n\nexport type DialogProps = {\n open: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: ReactNode;\n triggerAsChild?: boolean;\n triggerClassName?: string;\n title?: ReactNode;\n titleClassName?: string;\n ariaLabel?: string;\n labelledBy?: string;\n theme?: ThemeName;\n size?: keyof typeof sizeClasses;\n showBackdrop?: boolean;\n backdropClassName?: string;\n positionerClassName?: string;\n contentClassName?: string;\n children: ReactNode;\n};\n\nexport const Dialog: FC<DialogProps> = ({\n open,\n onOpenChange,\n trigger,\n triggerAsChild = false,\n triggerClassName,\n title,\n titleClassName,\n ariaLabel,\n labelledBy,\n theme = \"blue\",\n size = \"md\",\n showBackdrop = true,\n backdropClassName,\n positionerClassName,\n contentClassName,\n children,\n}) => (\n <ArkDialog.Root\n open={open}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n {trigger && (\n <ArkDialog.Trigger\n asChild={triggerAsChild}\n className={triggerClassName}\n >\n {trigger}\n </ArkDialog.Trigger>\n )}\n <Portal>\n {showBackdrop && (\n <ArkDialog.Backdrop\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[100] polli:bg-gray-950/50\",\n backdropClassName,\n )}\n />\n )}\n <ArkDialog.Positioner\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[110] polli:flex polli:h-dvh polli:items-start polli:justify-center polli:overflow-hidden polli:p-4\",\n positionerClassName,\n )}\n >\n <ArkDialog.Content\n data-theme={theme}\n aria-label={ariaLabel}\n aria-labelledby={labelledBy}\n className={cn(\n \"polli:my-auto polli:w-full polli:overflow-hidden polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-white polli:shadow-lg\",\n sizeClasses[size],\n contentClassName,\n )}\n >\n {title && (\n <DialogTitle\n className={cn(\n \"polli:px-6 polli:pt-6 polli:font-subheading polli:text-xl polli:text-theme-text-strong\",\n titleClassName,\n )}\n >\n {title}\n </DialogTitle>\n )}\n {children}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n </Portal>\n </ArkDialog.Root>\n);\n\nexport const DialogTitle = ArkDialog.Title;\n","import { clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({ prefix: \"polli\" });\n\n/** Internal class merge for polli:-prefixed package primitive classes. */\nexport function cn(...inputs: (string | undefined | null | false)[]) {\n return twMerge(clsx(...inputs));\n}\n","import type { CSSProperties, ReactNode } from \"react\";\nimport logoUrl from \"../../assets/logo.svg\";\nimport { Dialog } from \"../../primitives/Dialog.tsx\";\n\nconst authLogoMask: CSSProperties = {\n WebkitMask: `url(${logoUrl}) center / contain no-repeat`,\n mask: `url(${logoUrl}) center / contain no-repeat`,\n};\n\nexport type AuthModalProps = {\n children: ReactNode;\n dialog?: {\n label?: string;\n labelledBy?: string;\n };\n tone?: \"default\" | \"error\";\n};\n\nexport function AuthModal({\n children,\n dialog,\n tone = \"default\",\n}: AuthModalProps) {\n const borderClass =\n tone === \"error\"\n ? \"polli:border-intent-danger-border\"\n : \"polli:border-theme-border\";\n return (\n <Dialog\n open\n theme=\"amber\"\n showBackdrop={false}\n ariaLabel={dialog?.label}\n labelledBy={dialog?.labelledBy}\n positionerClassName=\"polli:items-start polli:overflow-y-auto polli:bg-theme-bg-pale\"\n contentClassName={`polli:bg-surface-white polli:border-2 ${borderClass} polli:rounded-lg polli:shadow-lg polli:max-w-xl polli:w-full polli:my-auto`}\n >\n {children}\n </Dialog>\n );\n}\n\nexport type AuthModalHeaderProps = {\n children?: ReactNode;\n};\n\nexport function AuthModalHeader({ children }: AuthModalHeaderProps) {\n const logo = (\n <a\n href=\"https://pollinations.ai\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"polli:block polli:shrink-0 polli:text-theme-text-strong\"\n aria-label=\"pollinations.ai\"\n >\n <span className=\"polli:sr-only\">pollinations.ai</span>\n <span\n aria-hidden=\"true\"\n className=\"polli:block polli:h-8 polli:w-8 polli:bg-current\"\n style={authLogoMask}\n />\n </a>\n );\n if (!children) {\n return (\n <div className=\"polli:flex polli:justify-start polli:px-6 polli:pt-6\">\n {logo}\n </div>\n );\n }\n return (\n <div className=\"polli:px-6 polli:pt-6 polli:pb-2\">\n <div className=\"polli:flex polli:items-center polli:justify-between polli:gap-3\">\n {logo}\n {children}\n </div>\n </div>\n );\n}\n\nexport function AuthModalLoading() {\n return (\n <AuthModal>\n <AuthModalHeader />\n <div className=\"polli:px-8 polli:pt-2 polli:pb-8 polli:text-center\">\n <p className=\"polli:text-theme-text-strong\">Loading...</p>\n </div>\n </AuthModal>\n );\n}\n\nexport function ErrorBanner({ children }: { children: ReactNode }) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-intent-danger-border polli:bg-intent-danger-bg-light polli:p-4\">\n <p className=\"polli:text-sm polli:text-intent-danger-text\">\n {children}\n </p>\n </div>\n );\n}\n\nexport type AuthInfoCardProps = {\n title?: string;\n titleId?: string;\n children: ReactNode;\n};\n\nexport function AuthInfoCard({\n title = \"Authorize\",\n titleId,\n children,\n}: AuthInfoCardProps) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4\">\n <p\n id={titleId}\n className=\"polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft\"\n >\n {title}\n </p>\n {children}\n </div>\n );\n}\n"],"mappings":"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","names":["jsx","jsxs"]}
|
|
1
|
+
{"version":3,"sources":["../../src/primitives/Dialog.tsx","../../src/lib/cn.ts","../../src/modules/auth/AuthModal.tsx"],"sourcesContent":["import { Dialog as ArkDialog } from \"@ark-ui/react/dialog\";\nimport { Portal } from \"@ark-ui/react/portal\";\nimport type { FC, ReactNode } from \"react\";\nimport { cn } from \"../lib/cn.ts\";\nimport type { ThemeName } from \"../theme.ts\";\n\nconst sizeClasses = {\n sm: \"polli:max-w-md\",\n md: \"polli:max-w-xl\",\n lg: \"polli:max-w-2xl\",\n} as const;\n\nexport type DialogProps = {\n open: boolean;\n onOpenChange?: (open: boolean) => void;\n trigger?: ReactNode;\n triggerAsChild?: boolean;\n triggerClassName?: string;\n title?: ReactNode;\n titleClassName?: string;\n ariaLabel?: string;\n labelledBy?: string;\n theme?: ThemeName;\n size?: keyof typeof sizeClasses;\n showBackdrop?: boolean;\n backdropClassName?: string;\n positionerClassName?: string;\n contentClassName?: string;\n children: ReactNode;\n};\n\nexport const Dialog: FC<DialogProps> = ({\n open,\n onOpenChange,\n trigger,\n triggerAsChild = false,\n triggerClassName,\n title,\n titleClassName,\n ariaLabel,\n labelledBy,\n theme = \"blue\",\n size = \"md\",\n showBackdrop = true,\n backdropClassName,\n positionerClassName,\n contentClassName,\n children,\n}) => (\n <ArkDialog.Root\n open={open}\n onOpenChange={(details) => onOpenChange?.(details.open)}\n >\n {trigger && (\n <ArkDialog.Trigger\n asChild={triggerAsChild}\n className={triggerClassName}\n >\n {trigger}\n </ArkDialog.Trigger>\n )}\n <Portal>\n {showBackdrop && (\n <ArkDialog.Backdrop\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[100] polli:bg-gray-950/50\",\n backdropClassName,\n )}\n />\n )}\n <ArkDialog.Positioner\n className={cn(\n \"polli:fixed polli:inset-0 polli:z-[110] polli:flex polli:h-dvh polli:items-start polli:justify-center polli:overflow-hidden polli:p-4\",\n positionerClassName,\n )}\n >\n <ArkDialog.Content\n data-theme={theme}\n aria-label={ariaLabel}\n aria-labelledby={labelledBy}\n className={cn(\n \"polli:my-auto polli:w-full polli:overflow-hidden polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-white polli:shadow-lg\",\n sizeClasses[size],\n contentClassName,\n )}\n >\n {title && (\n <DialogTitle\n className={cn(\n \"polli:px-6 polli:pt-6 polli:font-subheading polli:text-xl polli:text-theme-text-strong\",\n titleClassName,\n )}\n >\n {title}\n </DialogTitle>\n )}\n {children}\n </ArkDialog.Content>\n </ArkDialog.Positioner>\n </Portal>\n </ArkDialog.Root>\n);\n\nexport const DialogTitle = ArkDialog.Title;\n","import { clsx } from \"clsx\";\nimport { extendTailwindMerge } from \"tailwind-merge\";\n\nconst twMerge = extendTailwindMerge({ prefix: \"polli\" });\n\n/** Internal class merge for polli:-prefixed package primitive classes. */\nexport function cn(...inputs: (string | undefined | null | false)[]) {\n return twMerge(clsx(...inputs));\n}\n","import type { CSSProperties, ReactNode } from \"react\";\nimport logoUrl from \"../../assets/logo.svg\";\nimport { Dialog } from \"../../primitives/Dialog.tsx\";\n\nconst authLogoMask: CSSProperties = {\n WebkitMask: `url(${logoUrl}) center / contain no-repeat`,\n mask: `url(${logoUrl}) center / contain no-repeat`,\n};\n\nexport type AuthModalProps = {\n children: ReactNode;\n dialog?: {\n label?: string;\n labelledBy?: string;\n };\n tone?: \"default\" | \"error\";\n};\n\nexport function AuthModal({\n children,\n dialog,\n tone = \"default\",\n}: AuthModalProps) {\n const borderClass =\n tone === \"error\"\n ? \"polli:border-intent-danger-border\"\n : \"polli:border-theme-border\";\n return (\n <Dialog\n open\n theme=\"amber\"\n showBackdrop={false}\n ariaLabel={dialog?.label}\n labelledBy={dialog?.labelledBy}\n positionerClassName=\"polli:items-start polli:overflow-y-auto polli:bg-theme-bg-pale\"\n contentClassName={`polli:bg-surface-white polli:border-2 ${borderClass} polli:rounded-lg polli:shadow-lg polli:max-w-xl polli:w-full polli:my-auto`}\n >\n {children}\n </Dialog>\n );\n}\n\nexport type AuthModalHeaderProps = {\n children?: ReactNode;\n};\n\nexport function AuthModalHeader({ children }: AuthModalHeaderProps) {\n const logo = (\n <a\n href=\"https://pollinations.ai\"\n target=\"_blank\"\n rel=\"noopener noreferrer\"\n className=\"polli:block polli:shrink-0 polli:text-theme-text-strong\"\n aria-label=\"pollinations.ai\"\n >\n <span className=\"polli:sr-only\">pollinations.ai</span>\n <span\n aria-hidden=\"true\"\n className=\"polli:block polli:h-8 polli:w-8 polli:bg-current\"\n style={authLogoMask}\n />\n </a>\n );\n if (!children) {\n return (\n <div className=\"polli:flex polli:justify-start polli:px-6 polli:pt-6\">\n {logo}\n </div>\n );\n }\n return (\n <div className=\"polli:px-6 polli:pt-6 polli:pb-2\">\n <div className=\"polli:flex polli:items-center polli:justify-between polli:gap-3\">\n {logo}\n {children}\n </div>\n </div>\n );\n}\n\nexport function AuthModalLoading() {\n return (\n <AuthModal>\n <AuthModalHeader />\n <div className=\"polli:px-8 polli:pt-2 polli:pb-8 polli:text-center\">\n <p className=\"polli:text-theme-text-strong\">Loading...</p>\n </div>\n </AuthModal>\n );\n}\n\nexport function ErrorBanner({ children }: { children: ReactNode }) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-intent-danger-border polli:bg-intent-danger-bg-light polli:p-4\">\n <p className=\"polli:text-sm polli:text-intent-danger-text\">\n {children}\n </p>\n </div>\n );\n}\n\nexport type AuthInfoCardProps = {\n title?: string;\n children: ReactNode;\n};\n\nexport function AuthInfoCard({\n title = \"Authorize\",\n children,\n}: AuthInfoCardProps) {\n return (\n <div className=\"polli:rounded-lg polli:border-2 polli:border-theme-border polli:bg-theme-bg-pale polli:p-4\">\n <p className=\"polli:mb-2 polli:font-body polli:text-xs polli:font-semibold polli:tracking-wide polli:text-theme-text-soft\">\n {title}\n </p>\n {children}\n </div>\n );\n}\n"],"mappings":";;;;AAAA,SAAS,UAAU,iBAAiB;AACpC,SAAS,cAAc;;;ACDvB,SAAS,YAAY;AACrB,SAAS,2BAA2B;AAEpC,IAAM,UAAU,oBAAoB,EAAE,QAAQ,QAAQ,CAAC;AAGhD,SAAS,MAAM,QAA+C;AACjE,SAAO,QAAQ,KAAK,GAAG,MAAM,CAAC;AAClC;;;AD8CY,cAsBI,YAtBJ;AAhDZ,IAAM,cAAc;AAAA,EAChB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AACR;AAqBO,IAAM,SAA0B,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACJ,MACI;AAAA,EAAC,UAAU;AAAA,EAAV;AAAA,IACG;AAAA,IACA,cAAc,CAAC,YAAY,eAAe,QAAQ,IAAI;AAAA,IAErD;AAAA,iBACG;AAAA,QAAC,UAAU;AAAA,QAAV;AAAA,UACG,SAAS;AAAA,UACT,WAAW;AAAA,UAEV;AAAA;AAAA,MACL;AAAA,MAEJ,qBAAC,UACI;AAAA,wBACG;AAAA,UAAC,UAAU;AAAA,UAAV;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA;AAAA,YACJ;AAAA;AAAA,QACJ;AAAA,QAEJ;AAAA,UAAC,UAAU;AAAA,UAAV;AAAA,YACG,WAAW;AAAA,cACP;AAAA,cACA;AAAA,YACJ;AAAA,YAEA;AAAA,cAAC,UAAU;AAAA,cAAV;AAAA,gBACG,cAAY;AAAA,gBACZ,cAAY;AAAA,gBACZ,mBAAiB;AAAA,gBACjB,WAAW;AAAA,kBACP;AAAA,kBACA,YAAY,IAAI;AAAA,kBAChB;AAAA,gBACJ;AAAA,gBAEC;AAAA,2BACG;AAAA,oBAAC;AAAA;AAAA,sBACG,WAAW;AAAA,wBACP;AAAA,wBACA;AAAA,sBACJ;AAAA,sBAEC;AAAA;AAAA,kBACL;AAAA,kBAEH;AAAA;AAAA;AAAA,YACL;AAAA;AAAA,QACJ;AAAA,SACJ;AAAA;AAAA;AACJ;AAGG,IAAM,cAAc,UAAU;;;AE3E7B,gBAAAA,MAoBA,QAAAC,aApBA;AAxBR,IAAM,eAA8B;AAAA,EAChC,YAAY,OAAO,YAAO;AAAA,EAC1B,MAAM,OAAO,YAAO;AACxB;AAWO,SAAS,UAAU;AAAA,EACtB;AAAA,EACA;AAAA,EACA,OAAO;AACX,GAAmB;AACf,QAAM,cACF,SAAS,UACH,sCACA;AACV,SACI,gBAAAD;AAAA,IAAC;AAAA;AAAA,MACG,MAAI;AAAA,MACJ,OAAM;AAAA,MACN,cAAc;AAAA,MACd,WAAW,QAAQ;AAAA,MACnB,YAAY,QAAQ;AAAA,MACpB,qBAAoB;AAAA,MACpB,kBAAkB,yCAAyC,WAAW;AAAA,MAErE;AAAA;AAAA,EACL;AAER;AAMO,SAAS,gBAAgB,EAAE,SAAS,GAAyB;AAChE,QAAM,OACF,gBAAAC;AAAA,IAAC;AAAA;AAAA,MACG,MAAK;AAAA,MACL,QAAO;AAAA,MACP,KAAI;AAAA,MACJ,WAAU;AAAA,MACV,cAAW;AAAA,MAEX;AAAA,wBAAAD,KAAC,UAAK,WAAU,iBAAgB,6BAAe;AAAA,QAC/C,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACG,eAAY;AAAA,YACZ,WAAU;AAAA,YACV,OAAO;AAAA;AAAA,QACX;AAAA;AAAA;AAAA,EACJ;AAEJ,MAAI,CAAC,UAAU;AACX,WACI,gBAAAA,KAAC,SAAI,WAAU,wDACV,gBACL;AAAA,EAER;AACA,SACI,gBAAAA,KAAC,SAAI,WAAU,oCACX,0BAAAC,MAAC,SAAI,WAAU,mEACV;AAAA;AAAA,IACA;AAAA,KACL,GACJ;AAER;AAEO,SAAS,mBAAmB;AAC/B,SACI,gBAAAA,MAAC,aACG;AAAA,oBAAAD,KAAC,mBAAgB;AAAA,IACjB,gBAAAA,KAAC,SAAI,WAAU,sDACX,0BAAAA,KAAC,OAAE,WAAU,gCAA+B,wBAAU,GAC1D;AAAA,KACJ;AAER;AAEO,SAAS,YAAY,EAAE,SAAS,GAA4B;AAC/D,SACI,gBAAAA,KAAC,SAAI,WAAU,+GACX,0BAAAA,KAAC,OAAE,WAAU,+CACR,UACL,GACJ;AAER;AAOO,SAAS,aAAa;AAAA,EACzB,QAAQ;AAAA,EACR;AACJ,GAAsB;AAClB,SACI,gBAAAC,MAAC,SAAI,WAAU,8FACX;AAAA,oBAAAD,KAAC,OAAE,WAAU,+GACR,iBACL;AAAA,IACC;AAAA,KACL;AAER;","names":["jsx","jsxs"]}
|
package/dist/auth/sdk.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
-
import { a as ButtonProps } from '../Button-
|
|
4
|
-
import '../theme-
|
|
3
|
+
import { a as ButtonProps } from '../Button-CWUBCiIc.cjs';
|
|
4
|
+
import '../theme-VMRlhqST.cjs';
|
|
5
5
|
|
|
6
6
|
type LoginButtonProps = Omit<ButtonProps<"button">, "as" | "onClick" | "children"> & {
|
|
7
7
|
children: ReactNode;
|
package/dist/auth/sdk.d.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
|
-
import { a as ButtonProps } from '../Button-
|
|
4
|
-
import '../theme-
|
|
3
|
+
import { a as ButtonProps } from '../Button-Bn8pGg6N.js';
|
|
4
|
+
import '../theme-VMRlhqST.js';
|
|
5
5
|
|
|
6
6
|
type LoginButtonProps = Omit<ButtonProps<"button">, "as" | "onClick" | "children"> & {
|
|
7
7
|
children: ReactNode;
|