@aortl/admin-react 0.2.0 → 0.3.0
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 +3 -1
- package/dist/Tooltip.d.ts +36 -0
- package/dist/Tooltip.d.ts.map +1 -0
- package/dist/admin.css +97 -0
- package/dist/admin.scoped.css +100 -0
- package/dist/index.cjs +44 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.mjs +44 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
# @aortl/admin-react
|
|
2
2
|
|
|
3
|
-
React component library for the admin design system. Renders the same class names as `@aortl/admin-css
|
|
3
|
+
React component library for the admin design system. Renders the same class names as [`@aortl/admin-css`](https://www.npmjs.com/package/@aortl/admin-css), so vanilla HTML and React look identical.
|
|
4
|
+
|
|
5
|
+
[View on npm](https://www.npmjs.com/package/@aortl/admin-react) · [Docs](https://digital-udvikling.github.io/admin-design-system/)
|
|
4
6
|
|
|
5
7
|
## Install
|
|
6
8
|
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { Tooltip as BaseTooltip } from '@base-ui/react/tooltip';
|
|
2
|
+
import { ComponentProps, ReactElement, ReactNode } from 'react';
|
|
3
|
+
export type TooltipProviderProps = ComponentProps<typeof BaseTooltip.Provider>;
|
|
4
|
+
declare function TooltipProvider(props: TooltipProviderProps): import("react/jsx-runtime").JSX.Element;
|
|
5
|
+
export type TooltipRootProps = ComponentProps<typeof BaseTooltip.Root>;
|
|
6
|
+
declare function TooltipRoot(props: TooltipRootProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export type TooltipTriggerProps = ComponentProps<typeof BaseTooltip.Trigger>;
|
|
8
|
+
declare function TooltipTrigger(props: TooltipTriggerProps): import("react/jsx-runtime").JSX.Element;
|
|
9
|
+
export type TooltipSize = "sm" | "md";
|
|
10
|
+
type TooltipPositionerProps = ComponentProps<typeof BaseTooltip.Positioner>;
|
|
11
|
+
export interface TooltipPopupProps extends ComponentProps<typeof BaseTooltip.Popup> {
|
|
12
|
+
size?: TooltipSize;
|
|
13
|
+
side?: TooltipPositionerProps["side"];
|
|
14
|
+
align?: TooltipPositionerProps["align"];
|
|
15
|
+
sideOffset?: TooltipPositionerProps["sideOffset"];
|
|
16
|
+
}
|
|
17
|
+
declare function TooltipPopup({ size, side, align, sideOffset, role, className, children, ...rest }: TooltipPopupProps): import("react/jsx-runtime").JSX.Element;
|
|
18
|
+
export interface TooltipProps extends Omit<TooltipRootProps, "children"> {
|
|
19
|
+
/** Tooltip body — string or rich node. */
|
|
20
|
+
content: ReactNode;
|
|
21
|
+
side?: TooltipPopupProps["side"];
|
|
22
|
+
align?: TooltipPopupProps["align"];
|
|
23
|
+
sideOffset?: TooltipPopupProps["sideOffset"];
|
|
24
|
+
size?: TooltipSize;
|
|
25
|
+
/** The trigger element. Must be a single React element so Base UI can merge trigger props/refs into it. */
|
|
26
|
+
children: ReactElement;
|
|
27
|
+
}
|
|
28
|
+
declare function TooltipShorthand({ content, side, align, sideOffset, size, children, ...rootProps }: TooltipProps): import("react/jsx-runtime").JSX.Element;
|
|
29
|
+
export declare const Tooltip: typeof TooltipShorthand & {
|
|
30
|
+
Provider: typeof TooltipProvider;
|
|
31
|
+
Root: typeof TooltipRoot;
|
|
32
|
+
Trigger: typeof TooltipTrigger;
|
|
33
|
+
Popup: typeof TooltipPopup;
|
|
34
|
+
};
|
|
35
|
+
export {};
|
|
36
|
+
//# sourceMappingURL=Tooltip.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tooltip.d.ts","sourceRoot":"","sources":["../src/Tooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,wBAAwB,CAAC;AAChE,OAAO,KAAK,EAAE,cAAc,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGrE,MAAM,MAAM,oBAAoB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,QAAQ,CAAC,CAAC;AAE/E,iBAAS,eAAe,CAAC,KAAK,EAAE,oBAAoB,2CAEnD;AAED,MAAM,MAAM,gBAAgB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,IAAI,CAAC,CAAC;AAEvE,iBAAS,WAAW,CAAC,KAAK,EAAE,gBAAgB,2CAE3C;AAED,MAAM,MAAM,mBAAmB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,OAAO,CAAC,CAAC;AAE7E,iBAAS,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAEjD;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,GAAG,IAAI,CAAC;AAEtC,KAAK,sBAAsB,GAAG,cAAc,CAAC,OAAO,WAAW,CAAC,UAAU,CAAC,CAAC;AAE5E,MAAM,WAAW,iBAAkB,SAAQ,cAAc,CAAC,OAAO,WAAW,CAAC,KAAK,CAAC;IACjF,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,IAAI,CAAC,EAAE,sBAAsB,CAAC,MAAM,CAAC,CAAC;IACtC,KAAK,CAAC,EAAE,sBAAsB,CAAC,OAAO,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,sBAAsB,CAAC,YAAY,CAAC,CAAC;CACnD;AAED,iBAAS,YAAY,CAAC,EACpB,IAAW,EACX,IAAY,EACZ,KAAgB,EAChB,UAAc,EACd,IAAgB,EAChB,SAAS,EACT,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,iBAAiB,2CAcnB;AAED,MAAM,WAAW,YAAa,SAAQ,IAAI,CAAC,gBAAgB,EAAE,UAAU,CAAC;IACtE,0CAA0C;IAC1C,OAAO,EAAE,SAAS,CAAC;IACnB,IAAI,CAAC,EAAE,iBAAiB,CAAC,MAAM,CAAC,CAAC;IACjC,KAAK,CAAC,EAAE,iBAAiB,CAAC,OAAO,CAAC,CAAC;IACnC,UAAU,CAAC,EAAE,iBAAiB,CAAC,YAAY,CAAC,CAAC;IAC7C,IAAI,CAAC,EAAE,WAAW,CAAC;IACnB,2GAA2G;IAC3G,QAAQ,EAAE,YAAY,CAAC;CACxB;AAED,iBAAS,gBAAgB,CAAC,EACxB,OAAO,EACP,IAAI,EACJ,KAAK,EACL,UAAU,EACV,IAAI,EACJ,QAAQ,EACR,GAAG,SAAS,EACb,EAAE,YAAY,2CASd;AAED,eAAO,MAAM,OAAO;;;;;CAKlB,CAAC"}
|
package/dist/admin.css
CHANGED
|
@@ -7,6 +7,7 @@
|
|
|
7
7
|
--font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
|
|
8
8
|
monospace;
|
|
9
9
|
--spacing: 0.25rem;
|
|
10
|
+
--container-xs: 20rem;
|
|
10
11
|
--text-xs: 0.75rem;
|
|
11
12
|
--text-xs--line-height: calc(1 / 0.75);
|
|
12
13
|
--text-sm: 0.875rem;
|
|
@@ -3218,6 +3219,102 @@
|
|
|
3218
3219
|
outline-color: var(--color-primary);
|
|
3219
3220
|
}
|
|
3220
3221
|
}
|
|
3222
|
+
@layer components {
|
|
3223
|
+
.tooltip {
|
|
3224
|
+
pointer-events: none;
|
|
3225
|
+
display: inline-block;
|
|
3226
|
+
max-width: var(--container-xs);
|
|
3227
|
+
border-radius: var(--radius-md);
|
|
3228
|
+
background-color: var(--color-text);
|
|
3229
|
+
padding-inline: calc(var(--spacing) * 2);
|
|
3230
|
+
padding-block: calc(var(--spacing) * 1);
|
|
3231
|
+
font-size: var(--text-xs);
|
|
3232
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
3233
|
+
--tw-leading: var(--leading-snug);
|
|
3234
|
+
line-height: var(--leading-snug);
|
|
3235
|
+
--tw-font-weight: var(--font-weight-medium);
|
|
3236
|
+
font-weight: var(--font-weight-medium);
|
|
3237
|
+
color: var(--color-surface);
|
|
3238
|
+
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
3239
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
3240
|
+
text-wrap: balance;
|
|
3241
|
+
}
|
|
3242
|
+
.tooltip-sm {
|
|
3243
|
+
padding-inline: calc(var(--spacing) * 1.5);
|
|
3244
|
+
padding-block: calc(var(--spacing) * 0.5);
|
|
3245
|
+
}
|
|
3246
|
+
.tooltip {
|
|
3247
|
+
transition: opacity 150ms ease-out, transform 150ms ease-out;
|
|
3248
|
+
}
|
|
3249
|
+
.tooltip[data-starting-style], .tooltip[data-ending-style] {
|
|
3250
|
+
opacity: 0;
|
|
3251
|
+
}
|
|
3252
|
+
.tooltip[data-side="top"][data-starting-style], .tooltip[data-side="top"][data-ending-style] {
|
|
3253
|
+
transform: translateY(0.25rem);
|
|
3254
|
+
}
|
|
3255
|
+
.tooltip[data-side="bottom"][data-starting-style], .tooltip[data-side="bottom"][data-ending-style] {
|
|
3256
|
+
transform: translateY(-0.25rem);
|
|
3257
|
+
}
|
|
3258
|
+
.tooltip[data-side="left"][data-starting-style], .tooltip[data-side="left"][data-ending-style] {
|
|
3259
|
+
transform: translateX(0.25rem);
|
|
3260
|
+
}
|
|
3261
|
+
.tooltip[data-side="right"][data-starting-style], .tooltip[data-side="right"][data-ending-style] {
|
|
3262
|
+
transform: translateX(-0.25rem);
|
|
3263
|
+
}
|
|
3264
|
+
.tooltip-wrap {
|
|
3265
|
+
position: relative;
|
|
3266
|
+
display: inline-flex;
|
|
3267
|
+
align-items: center;
|
|
3268
|
+
}
|
|
3269
|
+
.tooltip-wrap > .tooltip {
|
|
3270
|
+
visibility: hidden;
|
|
3271
|
+
position: absolute;
|
|
3272
|
+
opacity: 0%;
|
|
3273
|
+
left: 50%;
|
|
3274
|
+
bottom: 100%;
|
|
3275
|
+
margin-bottom: calc(var(--spacing) * 1.5);
|
|
3276
|
+
transform: translateX(-50%);
|
|
3277
|
+
transition: opacity 150ms ease-out 0ms, visibility 0s linear 150ms;
|
|
3278
|
+
}
|
|
3279
|
+
.tooltip-wrap-bottom > .tooltip {
|
|
3280
|
+
top: 100%;
|
|
3281
|
+
right: auto;
|
|
3282
|
+
bottom: auto;
|
|
3283
|
+
left: 50%;
|
|
3284
|
+
margin-top: calc(var(--spacing) * 1.5);
|
|
3285
|
+
margin-right: 0;
|
|
3286
|
+
margin-bottom: 0;
|
|
3287
|
+
margin-left: 0;
|
|
3288
|
+
transform: translateX(-50%);
|
|
3289
|
+
}
|
|
3290
|
+
.tooltip-wrap-left > .tooltip {
|
|
3291
|
+
top: 50%;
|
|
3292
|
+
right: 100%;
|
|
3293
|
+
bottom: auto;
|
|
3294
|
+
left: auto;
|
|
3295
|
+
margin-top: 0;
|
|
3296
|
+
margin-right: calc(var(--spacing) * 1.5);
|
|
3297
|
+
margin-bottom: 0;
|
|
3298
|
+
margin-left: 0;
|
|
3299
|
+
transform: translateY(-50%);
|
|
3300
|
+
}
|
|
3301
|
+
.tooltip-wrap-right > .tooltip {
|
|
3302
|
+
top: 50%;
|
|
3303
|
+
right: auto;
|
|
3304
|
+
bottom: auto;
|
|
3305
|
+
left: 100%;
|
|
3306
|
+
margin-top: 0;
|
|
3307
|
+
margin-right: 0;
|
|
3308
|
+
margin-bottom: 0;
|
|
3309
|
+
margin-left: calc(var(--spacing) * 1.5);
|
|
3310
|
+
transform: translateY(-50%);
|
|
3311
|
+
}
|
|
3312
|
+
.tooltip-wrap:hover > .tooltip, .tooltip-wrap:focus-within > .tooltip {
|
|
3313
|
+
visibility: visible;
|
|
3314
|
+
opacity: 100%;
|
|
3315
|
+
transition: opacity 150ms ease-out 200ms, visibility 0s linear 200ms;
|
|
3316
|
+
}
|
|
3317
|
+
}
|
|
3221
3318
|
@property --tw-shadow {
|
|
3222
3319
|
syntax: "*";
|
|
3223
3320
|
inherits: false;
|
package/dist/admin.scoped.css
CHANGED
|
@@ -177,12 +177,16 @@
|
|
|
177
177
|
inherits: false;
|
|
178
178
|
}
|
|
179
179
|
@scope (.admin-root) {
|
|
180
|
+
:scope, :scope * {
|
|
181
|
+
all: revert-layer;
|
|
182
|
+
}
|
|
180
183
|
@layer theme {
|
|
181
184
|
:scope, :host {
|
|
182
185
|
--font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
183
186
|
--font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono",
|
|
184
187
|
monospace;
|
|
185
188
|
--spacing: 0.25rem;
|
|
189
|
+
--container-xs: 20rem;
|
|
186
190
|
--text-xs: 0.75rem;
|
|
187
191
|
--text-xs--line-height: calc(1 / 0.75);
|
|
188
192
|
--text-sm: 0.875rem;
|
|
@@ -3346,6 +3350,102 @@
|
|
|
3346
3350
|
outline-color: var(--color-primary);
|
|
3347
3351
|
}
|
|
3348
3352
|
}
|
|
3353
|
+
@layer components {
|
|
3354
|
+
.tooltip {
|
|
3355
|
+
pointer-events: none;
|
|
3356
|
+
display: inline-block;
|
|
3357
|
+
max-width: var(--container-xs);
|
|
3358
|
+
border-radius: var(--radius-md);
|
|
3359
|
+
background-color: var(--color-text);
|
|
3360
|
+
padding-inline: calc(var(--spacing) * 2);
|
|
3361
|
+
padding-block: calc(var(--spacing) * 1);
|
|
3362
|
+
font-size: var(--text-xs);
|
|
3363
|
+
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
3364
|
+
--tw-leading: var(--leading-snug);
|
|
3365
|
+
line-height: var(--leading-snug);
|
|
3366
|
+
--tw-font-weight: var(--font-weight-medium);
|
|
3367
|
+
font-weight: var(--font-weight-medium);
|
|
3368
|
+
color: var(--color-surface);
|
|
3369
|
+
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
3370
|
+
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
3371
|
+
text-wrap: balance;
|
|
3372
|
+
}
|
|
3373
|
+
.tooltip-sm {
|
|
3374
|
+
padding-inline: calc(var(--spacing) * 1.5);
|
|
3375
|
+
padding-block: calc(var(--spacing) * 0.5);
|
|
3376
|
+
}
|
|
3377
|
+
.tooltip {
|
|
3378
|
+
transition: opacity 150ms ease-out, transform 150ms ease-out;
|
|
3379
|
+
}
|
|
3380
|
+
.tooltip[data-starting-style], .tooltip[data-ending-style] {
|
|
3381
|
+
opacity: 0;
|
|
3382
|
+
}
|
|
3383
|
+
.tooltip[data-side="top"][data-starting-style], .tooltip[data-side="top"][data-ending-style] {
|
|
3384
|
+
transform: translateY(0.25rem);
|
|
3385
|
+
}
|
|
3386
|
+
.tooltip[data-side="bottom"][data-starting-style], .tooltip[data-side="bottom"][data-ending-style] {
|
|
3387
|
+
transform: translateY(-0.25rem);
|
|
3388
|
+
}
|
|
3389
|
+
.tooltip[data-side="left"][data-starting-style], .tooltip[data-side="left"][data-ending-style] {
|
|
3390
|
+
transform: translateX(0.25rem);
|
|
3391
|
+
}
|
|
3392
|
+
.tooltip[data-side="right"][data-starting-style], .tooltip[data-side="right"][data-ending-style] {
|
|
3393
|
+
transform: translateX(-0.25rem);
|
|
3394
|
+
}
|
|
3395
|
+
.tooltip-wrap {
|
|
3396
|
+
position: relative;
|
|
3397
|
+
display: inline-flex;
|
|
3398
|
+
align-items: center;
|
|
3399
|
+
}
|
|
3400
|
+
.tooltip-wrap > .tooltip {
|
|
3401
|
+
visibility: hidden;
|
|
3402
|
+
position: absolute;
|
|
3403
|
+
opacity: 0%;
|
|
3404
|
+
left: 50%;
|
|
3405
|
+
bottom: 100%;
|
|
3406
|
+
margin-bottom: calc(var(--spacing) * 1.5);
|
|
3407
|
+
transform: translateX(-50%);
|
|
3408
|
+
transition: opacity 150ms ease-out 0ms, visibility 0s linear 150ms;
|
|
3409
|
+
}
|
|
3410
|
+
.tooltip-wrap-bottom > .tooltip {
|
|
3411
|
+
top: 100%;
|
|
3412
|
+
right: auto;
|
|
3413
|
+
bottom: auto;
|
|
3414
|
+
left: 50%;
|
|
3415
|
+
margin-top: calc(var(--spacing) * 1.5);
|
|
3416
|
+
margin-right: 0;
|
|
3417
|
+
margin-bottom: 0;
|
|
3418
|
+
margin-left: 0;
|
|
3419
|
+
transform: translateX(-50%);
|
|
3420
|
+
}
|
|
3421
|
+
.tooltip-wrap-left > .tooltip {
|
|
3422
|
+
top: 50%;
|
|
3423
|
+
right: 100%;
|
|
3424
|
+
bottom: auto;
|
|
3425
|
+
left: auto;
|
|
3426
|
+
margin-top: 0;
|
|
3427
|
+
margin-right: calc(var(--spacing) * 1.5);
|
|
3428
|
+
margin-bottom: 0;
|
|
3429
|
+
margin-left: 0;
|
|
3430
|
+
transform: translateY(-50%);
|
|
3431
|
+
}
|
|
3432
|
+
.tooltip-wrap-right > .tooltip {
|
|
3433
|
+
top: 50%;
|
|
3434
|
+
right: auto;
|
|
3435
|
+
bottom: auto;
|
|
3436
|
+
left: 100%;
|
|
3437
|
+
margin-top: 0;
|
|
3438
|
+
margin-right: 0;
|
|
3439
|
+
margin-bottom: 0;
|
|
3440
|
+
margin-left: calc(var(--spacing) * 1.5);
|
|
3441
|
+
transform: translateY(-50%);
|
|
3442
|
+
}
|
|
3443
|
+
.tooltip-wrap:hover > .tooltip, .tooltip-wrap:focus-within > .tooltip {
|
|
3444
|
+
visibility: visible;
|
|
3445
|
+
opacity: 100%;
|
|
3446
|
+
transition: opacity 150ms ease-out 200ms, visibility 0s linear 200ms;
|
|
3447
|
+
}
|
|
3448
|
+
}
|
|
3349
3449
|
@layer properties {
|
|
3350
3450
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
3351
3451
|
*, ::before, ::after, ::backdrop {
|
package/dist/index.cjs
CHANGED
|
@@ -11,6 +11,7 @@ let _base_ui_react_switch = require("@base-ui/react/switch");
|
|
|
11
11
|
let _base_ui_react_select = require("@base-ui/react/select");
|
|
12
12
|
let _base_ui_react_field = require("@base-ui/react/field");
|
|
13
13
|
let _base_ui_react_tabs = require("@base-ui/react/tabs");
|
|
14
|
+
let _base_ui_react_tooltip = require("@base-ui/react/tooltip");
|
|
14
15
|
let _base_ui_react_dialog = require("@base-ui/react/dialog");
|
|
15
16
|
//#region src/Accordion.tsx
|
|
16
17
|
function AccordionRoot({ className, ...rest }) {
|
|
@@ -1075,6 +1076,48 @@ var Tabs = Object.assign(TabsRoot, {
|
|
|
1075
1076
|
Indicator: TabsIndicator
|
|
1076
1077
|
});
|
|
1077
1078
|
//#endregion
|
|
1079
|
+
//#region src/Tooltip.tsx
|
|
1080
|
+
function TooltipProvider(props) {
|
|
1081
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Provider, { ...props });
|
|
1082
|
+
}
|
|
1083
|
+
function TooltipRoot(props) {
|
|
1084
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Root, { ...props });
|
|
1085
|
+
}
|
|
1086
|
+
function TooltipTrigger(props) {
|
|
1087
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Trigger, { ...props });
|
|
1088
|
+
}
|
|
1089
|
+
function TooltipPopup({ size = "md", side = "top", align = "center", sideOffset = 6, role = "tooltip", className, children, ...rest }) {
|
|
1090
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Portal, { children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Positioner, {
|
|
1091
|
+
sideOffset,
|
|
1092
|
+
side,
|
|
1093
|
+
align,
|
|
1094
|
+
children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Popup, {
|
|
1095
|
+
role,
|
|
1096
|
+
className: cn(["tooltip", size !== "md" && `tooltip-${size}`], className),
|
|
1097
|
+
...rest,
|
|
1098
|
+
children
|
|
1099
|
+
})
|
|
1100
|
+
}) });
|
|
1101
|
+
}
|
|
1102
|
+
function TooltipShorthand({ content, side, align, sideOffset, size, children, ...rootProps }) {
|
|
1103
|
+
return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(TooltipRoot, {
|
|
1104
|
+
...rootProps,
|
|
1105
|
+
children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Trigger, { render: children }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(TooltipPopup, {
|
|
1106
|
+
side,
|
|
1107
|
+
align,
|
|
1108
|
+
sideOffset,
|
|
1109
|
+
size,
|
|
1110
|
+
children: content
|
|
1111
|
+
})]
|
|
1112
|
+
});
|
|
1113
|
+
}
|
|
1114
|
+
var Tooltip = Object.assign(TooltipShorthand, {
|
|
1115
|
+
Provider: TooltipProvider,
|
|
1116
|
+
Root: TooltipRoot,
|
|
1117
|
+
Trigger: TooltipTrigger,
|
|
1118
|
+
Popup: TooltipPopup
|
|
1119
|
+
});
|
|
1120
|
+
//#endregion
|
|
1078
1121
|
//#region src/Table.tsx
|
|
1079
1122
|
function TableRoot({ striped, bordered, relaxed, sticky, className, ...rest }) {
|
|
1080
1123
|
return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("table", {
|
|
@@ -1324,6 +1367,7 @@ exports.Switch = Switch;
|
|
|
1324
1367
|
exports.Table = Table;
|
|
1325
1368
|
exports.Tabs = Tabs;
|
|
1326
1369
|
exports.Textarea = Textarea;
|
|
1370
|
+
exports.Tooltip = Tooltip;
|
|
1327
1371
|
exports.getPaginationItems = getPaginationItems;
|
|
1328
1372
|
exports.useAppShell = useAppShell;
|
|
1329
1373
|
|