plass-ui 1.5.0 → 1.7.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/CHANGELOG.md +336 -0
- package/README.md +29 -7
- package/dist/components/accordion/PlAccordion.d.ts +13 -0
- package/dist/components/accordion/PlAccordion.js +1 -1
- package/dist/components/accordion/index.d.ts +1 -1
- package/dist/components/alert/PlAlert.js +1 -1
- package/dist/components/animate-counter/PlAnimateCounter.js +1 -1
- package/dist/components/animate-float/PlAnimateFloat.js +1 -1
- package/dist/components/animate-headline/PlAnimateHeadline.d.ts +10 -1
- package/dist/components/animate-marquee/PlAnimateMarquee.d.ts +11 -1
- package/dist/components/animate-marquee/PlAnimateMarquee.js +1 -1
- package/dist/components/animate-scramble/PlAnimateScramble.js +1 -1
- package/dist/components/animate-split/PlAnimateSplit.js +1 -1
- package/dist/components/animate-typing/PlAnimateTyping.js +1 -1
- package/dist/components/app-logo/PlAppLogo.js +1 -1
- package/dist/components/area-chart/PlAreaChart.d.ts +35 -6
- package/dist/components/area-chart/PlAreaChart.js +1 -1
- package/dist/components/aspect-ratio/PlAspectRatio.js +1 -1
- package/dist/components/avatar/PlAvatar.js +1 -1
- package/dist/components/back-top/PlBackTop.d.ts +6 -0
- package/dist/components/back-top/PlBackTop.js +1 -1
- package/dist/components/badge/PlBadge.js +1 -1
- package/dist/components/bar-chart/PlBarChart.d.ts +54 -2
- package/dist/components/bar-chart/PlBarChart.js +1 -1
- package/dist/components/blockquote/PlBlockquote.d.ts +2 -2
- package/dist/components/blockquote/PlBlockquote.js +1 -1
- package/dist/components/bottom-navigation/PlBottomNavigation.js +1 -1
- package/dist/components/breadcrumb/PlBreadcrumb.js +1 -1
- package/dist/components/button/PlButton.d.ts +7 -0
- package/dist/components/button/PlButton.js +1 -1
- package/dist/components/calendar/PlCalendar.js +1 -1
- package/dist/components/card/PlCard.d.ts +7 -4
- package/dist/components/carousel/PlCarousel.d.ts +14 -4
- package/dist/components/carousel/PlCarousel.js +1 -1
- package/dist/components/chat-bubble/PlChatBubble.js +1 -1
- package/dist/components/checkbox/PlCheckbox.js +1 -1
- package/dist/components/chip/PlChip.d.ts +2 -1
- package/dist/components/chip/PlChip.js +1 -1
- package/dist/components/collapsible/PlCollapsible.d.ts +11 -0
- package/dist/components/collapsible/PlCollapsible.js +1 -1
- package/dist/components/color-picker/PlColorPicker.d.ts +21 -2
- package/dist/components/color-picker/PlColorPicker.js +1 -1
- package/dist/components/combobox/PlCombobox.d.ts +18 -6
- package/dist/components/combobox/PlCombobox.js +1 -1
- package/dist/components/command-palette/PlCommandPalette.js +1 -1
- package/dist/components/confirm/PlConfirmProvider.js +1 -1
- package/dist/components/data-table/PlDataTable.d.ts +13 -2
- package/dist/components/data-table/PlDataTable.js +1 -1
- package/dist/components/date-picker/PlDatePicker.js +1 -1
- package/dist/components/date-range-picker/PlDateRangePicker.js +1 -1
- package/dist/components/drawer/PlDrawer.js +1 -1
- package/dist/components/empty/PlEmpty.js +1 -1
- package/dist/components/fieldset/PlFieldset.js +1 -1
- package/dist/components/file-picker/PlFilePicker.d.ts +20 -2
- package/dist/components/file-picker/PlFilePicker.js +1 -1
- package/dist/components/floating-action-button/PlFloatingActionButton.d.ts +5 -0
- package/dist/components/floating-action-button/PlFloatingActionButton.js +1 -1
- package/dist/components/floating-bottom-navigation/PlFloatingBottomNavigation.js +1 -1
- package/dist/components/footer/PlFooter.d.ts +3 -1
- package/dist/components/gallery/PlGallery.js +1 -1
- package/dist/components/gauge-chart/PlGaugeChart.js +1 -1
- package/dist/components/header/PlHeader.d.ts +4 -2
- package/dist/components/header/PlHeader.js +1 -1
- package/dist/components/heatmap-chart/PlHeatmapChart.js +1 -1
- package/dist/components/highlight/PlHighlight.d.ts +10 -3
- package/dist/components/hover-card/PlHoverCard.js +1 -1
- package/dist/components/how-to-steps/PlHowToSteps.js +1 -1
- package/dist/components/image/PlImage.js +1 -1
- package/dist/components/line-chart/PlLineChart.d.ts +32 -6
- package/dist/components/line-chart/PlLineChart.js +1 -1
- package/dist/components/list/PlList.js +1 -1
- package/dist/components/menu/PlMenu.js +1 -1
- package/dist/components/mockup/PlMockup.d.ts +5 -0
- package/dist/components/mockup/PlMockup.js +1 -1
- package/dist/components/modal/PlModal.js +1 -1
- package/dist/components/navigation-menu/PlNavigationMenu.d.ts +4 -3
- package/dist/components/navigation-menu/PlNavigationMenu.js +1 -1
- package/dist/components/number-field/PlNumberField.d.ts +14 -4
- package/dist/components/number-field/PlNumberField.js +1 -1
- package/dist/components/otp-field/PlOtpField.d.ts +9 -1
- package/dist/components/otp-field/PlOtpField.js +1 -1
- package/dist/components/overlay/PlOverlay.js +1 -1
- package/dist/components/page-layout/PlPageLayout.d.ts +14 -3
- package/dist/components/page-layout/PlPageLayout.js +1 -1
- package/dist/components/pagination/PlPagination.js +1 -1
- package/dist/components/panes/PlPanes.js +1 -1
- package/dist/components/pie-chart/PlPieChart.d.ts +26 -1
- package/dist/components/pie-chart/PlPieChart.js +1 -1
- package/dist/components/pill/PlPill.js +1 -1
- package/dist/components/popconfirm/PlPopconfirm.d.ts +8 -1
- package/dist/components/popconfirm/PlPopconfirm.js +1 -1
- package/dist/components/popover/PlPopover.js +1 -1
- package/dist/components/progress-box/PlProgressBox.js +1 -1
- package/dist/components/progress-circular/PlProgressCircular.js +1 -1
- package/dist/components/progress-linear/PlProgressLinear.js +1 -1
- package/dist/components/radio-group/PlRadioGroup.js +1 -1
- package/dist/components/rating/PlRating.js +1 -1
- package/dist/components/scatter-chart/PlScatterChart.js +1 -1
- package/dist/components/scroll-area/PlScrollArea.js +1 -1
- package/dist/components/segmented-button/PlSegmentedButton.js +1 -1
- package/dist/components/select/PlSelect.d.ts +11 -2
- package/dist/components/select/PlSelect.js +1 -1
- package/dist/components/sidebar/PlSidebar.js +1 -1
- package/dist/components/slider/PlSlider.js +1 -1
- package/dist/components/sparkline/PlSparkline.js +1 -1
- package/dist/components/stepper/PlStepper.js +1 -1
- package/dist/components/switch/PlSwitch.js +1 -1
- package/dist/components/table/PlTable.d.ts +11 -1
- package/dist/components/table/PlTable.js +1 -1
- package/dist/components/tabs/PlTabs.d.ts +18 -1
- package/dist/components/tabs/PlTabs.js +1 -1
- package/dist/components/text-field/PlTextField.d.ts +13 -5
- package/dist/components/text-field/PlTextField.js +1 -1
- package/dist/components/text-link/PlTextLink.js +1 -1
- package/dist/components/timeline/PlTimeline.js +1 -1
- package/dist/components/timeline-chart/PlTimelineChart.js +1 -1
- package/dist/components/toast/PlToast.js +1 -1
- package/dist/components/toggle/PlToggle.js +1 -1
- package/dist/components/tooltip/PlTooltip.d.ts +4 -0
- package/dist/components/tooltip/PlTooltip.js +1 -1
- package/dist/components/tour/PlTour.js +1 -1
- package/dist/components/transfer/PlTransfer.d.ts +5 -2
- package/dist/components/transfer/PlTransfer.js +1 -1
- package/dist/components/tree/PlTree.js +1 -1
- package/dist/components/tree-select/PlTreeSelect.js +1 -1
- package/dist/components/typography/PlTypography.js +1 -1
- package/dist/components/window-pane/PlWindowPane.d.ts +16 -6
- package/dist/components/window-pane/PlWindowPane.js +1 -1
- package/dist/internal/animate.d.ts +0 -25
- package/dist/internal/animate.js +1 -1
- package/dist/internal/bottom-bar.d.ts +29 -0
- package/dist/internal/bottom-bar.js +1 -0
- package/dist/internal/calendar.js +1 -1
- package/dist/internal/chart-frame.d.ts +90 -27
- package/dist/internal/chart-frame.js +1 -1
- package/dist/internal/chart-line.d.ts +11 -6
- package/dist/internal/chart-line.js +1 -1
- package/dist/internal/chart.d.ts +158 -1
- package/dist/internal/chart.js +1 -1
- package/dist/internal/defaults.d.ts +14 -1
- package/dist/internal/focusable.d.ts +10 -0
- package/dist/internal/focusable.js +1 -1
- package/dist/internal/form.d.ts +29 -0
- package/dist/internal/form.js +1 -1
- package/dist/internal/glow.d.ts +47 -1
- package/dist/internal/glow.js +1 -1
- package/dist/internal/icons.d.ts +24 -0
- package/dist/internal/icons.js +1 -1
- package/dist/internal/labels.d.ts +35 -0
- package/dist/internal/labels.js +1 -1
- package/dist/internal/loading.d.ts +13 -0
- package/dist/internal/loading.js +1 -0
- package/dist/internal/mockup.js +1 -1
- package/dist/internal/notch.d.ts +137 -0
- package/dist/internal/notch.js +1 -0
- package/dist/internal/picker.d.ts +15 -3
- package/dist/internal/picker.js +1 -1
- package/dist/internal/progress.d.ts +17 -6
- package/dist/internal/progress.js +1 -1
- package/dist/internal/sizer.d.ts +12 -11
- package/dist/internal/sizer.js +1 -1
- package/dist/internal/steps.d.ts +0 -15
- package/dist/internal/steps.js +1 -1
- package/dist/internal/styles.d.ts +135 -8
- package/dist/internal/styles.js +1 -1
- package/dist/internal/table-scroll.d.ts +42 -0
- package/dist/internal/table-scroll.js +1 -0
- package/dist/internal/table.js +1 -1
- package/dist/internal/text.d.ts +8 -5
- package/dist/internal/window.js +1 -1
- package/dist/locales/de.js +1 -1
- package/dist/locales/es.js +1 -1
- package/dist/locales/fr.js +1 -1
- package/dist/locales/ja.js +1 -1
- package/dist/locales/ko.js +1 -1
- package/dist/locales/zh-Hans.js +1 -1
- package/dist/provider/PlassProvider.d.ts +4 -3
- package/dist/provider/PlassProvider.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/tailwind.css +461 -46
- package/dist/tokens.css +461 -46
- package/dist/types.d.ts +270 -11
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{PlCheckbox as a}from"../checkbox/index.js";import{PlPagination as n}from"../pagination/index.js";import{PlSkeleton as l}from"../skeleton/index.js";import{PlTextField as s}from"../text-field/index.js";import{compareValues as o,keysBetween as i,nextSort as c,pageBounds as d}from"../../internal/data-table.js";import{useDefaults as u}from"../../internal/defaults.js";import{ChevronIcon as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as r from"react";import{PlCheckbox as a}from"../checkbox/index.js";import{PlPagination as n}from"../pagination/index.js";import{PlSkeleton as l}from"../skeleton/index.js";import{PlTextField as s}from"../text-field/index.js";import{compareValues as o,keysBetween as i,nextSort as c,pageBounds as d}from"../../internal/data-table.js";import{useDefaults as u}from"../../internal/defaults.js";import{ChevronIcon as m}from"../../internal/icons.js";import{useLabels as p}from"../../internal/labels.js";import{searchHaystack as h,searchText as g}from"../../internal/search.js";import{controlTextLeadingClasses as f,cx as v,focusRingInsetClasses as y,gapClasses as b,hasContent as x,metaTextClasses as w,paddingXValues as k,radiusClasses as C,sheetRestClasses as S,srOnlyClasses as N,surfaceSlots as j}from"../../internal/styles.js";import{PlassTableScroll as z}from"../../internal/table-scroll.js";import{cellPaddingYValues as M,clickableRowClasses as P,headRule as $,rowClasses as _,rowRule as A,tableStyle as R}from"../../internal/table.js";const B={xs:"2rem",sm:"2.25rem",md:"2.75rem",lg:"3rem",xl:"3.5rem"},T=/* @__PURE__ */v("inline-flex items-center gap-1 [outline:none]","font-semibold whitespace-nowrap text-inherit","[background:none] [border:0] [padding:0] [margin:0] cursor-pointer","hover:text-(--plass-fg) [transition:color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",y);function SortMark({direction:t}){return e("span",{"aria-hidden":"true",className:v("[&_svg]:size-[1em] [&_svg]:shrink-0","[transition:opacity_var(--plass-duration)_var(--plass-ease),rotate_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]",null===t?"opacity-30":"opacity-100","asc"===t?"rotate-180":""),children:e(m,{})})}export function PlDataTable({variant:m="glass",size:y,color:D,density:H,elevation:K=0,columns:I,rows:E,getRowKey:q,caption:F,label:G,empty:J,striped:L=!1,hoverable:O=!1,stickyHeader:Q=!0,maxHeight:U,onRowClick:V,sort:W,defaultSort:X=null,onSortChange:Y,searchable:Z=!1,search:ee,defaultSearch:te="",onSearchChange:re,searchPlaceholder:ae,selection:ne="none",selected:le,defaultSelected:se,onSelectedChange:oe,isRowSelectable:ie,paging:ce="scroll",pageSize:de=10,page:ue,defaultPage:me=1,onPageChange:pe,rowCount:he,manual:ge,loading:fe=!1,toolbar:ve,footer:ye,className:be,style:xe,...we}){const ke=u(),Ce=p(),Se=y??ke.size??"md",Ne=D??ke.color??"primary",je=H??ke.density??"default",ze=J??Ce.empty,[Me,Pe]=r.useState(X),[$e,_e]=r.useState(te),[Ae,Re]=r.useState(se??[]),[Be,Te]=r.useState(me),De=void 0===W?Me:W,He=ee??$e,Ke=le??Ae,Ie=!ge?.includes("sort"),Ee=!ge?.includes("search"),qe=!ge?.includes("pages"),Fe=r.useCallback((e,t)=>e.value?e.value(t):t[e.key],[]),Ge=r.useMemo(()=>E.map((e,t)=>({row:e,index:t})),[E]),Je=g(He),Le=r.useMemo(()=>{if(!Ee||""===Je)return Ge;const e=I.filter(e=>!e.unsearchable);return Ge.filter(({row:t})=>h(e.map(e=>Fe(e,t))).includes(Je))},[Ge,I,Je,Ee,Fe]),Oe=r.useMemo(()=>{if(!Ie||null===De)return Le;const e=I.find(e=>e.key===De.key);if(!e)return Le;const t="asc"===De.direction?1:-1;return[...Le].sort((r,a)=>e.compare?e.compare(r.row,a.row)*t:o(Fe(e,r.row),Fe(e,a.row),t))},[Le,I,De,Ie,Fe]),Qe=qe?Oe.length:he??Oe.length,Ue=Math.max(1,Math.ceil(Qe/de)),Ve=Math.min(Math.max(ue??Be,1),Ue),We=r.useMemo(()=>{if("pages"!==ce||!qe)return Oe;const[e,t]=d(Oe.length,Ve,de);return Oe.slice(e,t)},[Oe,ce,qe,Ve,de]),Xe="pages"!==ce||qe?0:(Ve-1)*de,Ye=r.useCallback((e,t)=>q?q(e,t):Xe+t,[q,Xe]),Ze=r.useMemo(()=>We.map(({row:e,index:t})=>Ye(e,t)),[We,Ye]),et=r.useRef(null);function goPage(e){void 0===ue&&Te(e),e!==Ve&&pe?.(e)}const selectable=(e,t)=>"none"!==ne&&(!ie||ie(e,t)),goSelected=e=>{void 0===le&&Re(e);const t=new Set(e);oe?.(e,E.filter((e,r)=>t.has(Ye(e,r))))},tt=Ze.filter(e=>Ke.includes(e)),rt=We.filter(({row:e,index:t})=>selectable(e,t)).map(({row:e,index:t})=>Ye(e,t)),at=rt.length>0&&tt.length===rt.length,nt=k[je][Se],lt=M[je][Se],st=Boolean(V),ot=O||st,it=void 0!==U,ct="none"!==ne,dt=I.length+(ct?1:0),ut={padding:`${lt} ${nt}`,border:0,background:"none"},mt={...ut,...Q?{boxShadow:"inset 0 -1px 0 var(--plass-border)",background:"linear-gradient(var(--plass-glass-press), var(--plass-glass-press)), linear-gradient(var(--plass-surface), var(--plass-surface))"}:{borderBottom:$}},bodyCellStyle=e=>({...ut,borderTop:0===e?0:A}),pt={padding:`${lt} ${nt}`,display:"flex",alignItems:"center",justifyContent:"space-between",gap:"0.75rem"},ht=Z||x(ve),gt="pages"===ce&&Ue>1||x(ye);return t("div",{className:v("overflow-hidden",C[Se],S[m],be),style:{...j(Ne,K),...xe},...we,children:[x(F)?e("div",{"aria-hidden":"true",className:v(w[Se],"font-semibold text-(--plass-muted-fg)"),style:{...ut,borderBottom:A,textAlign:"start"},children:F}):null,ht?t("div",{style:{...pt,borderBottom:A},children:[Z?e(s,{size:Se,color:Ne,density:je,value:He,onChange:e=>{return t=e.target.value,void 0===ee&&_e(t),goPage(1),void re?.(t);var t},placeholder:ae??Ce.search,"aria-label":Ce.search,className:"min-w-0 flex-1"}):e("span",{}),x(ve)?e("div",{className:v("flex items-center",b[Se]),children:ve}):null]}):null,t(z,{className:v("overflow-x-auto",it&&"overflow-y-auto overscroll-contain"),style:it?{maxHeight:U}:void 0,tableClassName:v("text-start",f[Se],"text-(--plass-fg)"),tableStyle:R,busy:fe,caption:x(F)?F:void 0,label:G,children:[t("colgroup",{children:[ct?e("col",{style:{width:B[Se]}}):null,I.map(t=>e("col",{style:void 0===t.width?void 0:{width:"number"==typeof t.width?`${t.width}px`:t.width}},t.key))]}),e("thead",{children:t("tr",{children:[ct?e("th",{scope:"col",className:v(Q&&"sticky top-0 z-10"),style:mt,children:"multiple"===ne?e(a,{size:Se,color:Ne,checked:at,indeterminate:tt.length>0&&!at,onCheckedChange:()=>{const e=Ke.filter(e=>!rt.includes(e));goSelected(at?e:[...e,...rt])},disabled:0===rt.length,"aria-label":Ce.selectAll}):e("span",{className:N,children:Ce.selectRow})}):null,I.map(r=>{const a=De?.key===r.key?De.direction:null;return e("th",{scope:"col",className:v("font-semibold whitespace-nowrap text-(--plass-muted-fg)",Q&&"sticky top-0 z-10"),style:{...mt,textAlign:r.align??"start"},"aria-sort":r.sortable?"asc"===a?"ascending":"desc"===a?"descending":"none":void 0,children:r.sortable?t("button",{type:"button",className:T,onClick:()=>(e=>{const t=c(De,e);void 0===W&&Pe(t),goPage(1),Y?.(t)})(r.key),children:[r.header??r.key,e(SortMark,{direction:a})]}):r.header??r.key},r.key)})]})}),e("tbody",{children:fe?Array.from({length:"pages"===ce?de:5},(t,r)=>e("tr",{className:_,children:Array.from({length:dt},(t,a)=>e("td",{style:bodyCellStyle(r),children:e(l,{size:Se,color:Ne})},a))},r)):0===We.length?e("tr",{className:_,children:e("td",{colSpan:dt,className:"text-(--plass-muted-fg)",style:{...ut,padding:`2rem ${nt}`,textAlign:"center"},children:ze})}):We.map(({row:r,index:n},l)=>{const s=Ye(r,n),o=Ke.includes(s),c=selectable(r,n);return t("tr",{"aria-selected":ct?o:void 0,className:v(_,L&&l%2==1&&"[--p-row:var(--plass-stripe)]",o&&"[--p-row:var(--p-soft)]",ot&&"hover:[--p-row:var(--p-soft)]",st&&P),style:{backgroundColor:"var(--p-row)"},tabIndex:st?0:void 0,onClick:V?()=>V(r,n):void 0,onKeyDown:V?e=>{e.target===e.currentTarget&&("Enter"!==e.key&&" "!==e.key||(e.preventDefault(),V(r,n)))}:void 0,children:[ct?e("td",{style:bodyCellStyle(l),children:e(a,{size:Se,color:Ne,checked:o,disabled:!c,onCheckedChange:(e,t)=>((e,t)=>{if("single"===ne)return goSelected(Ke.includes(e)?[]:[e]),void(et.current=e);if(t&&null!==et.current&&et.current!==e){const t=i(Ze,et.current,e).filter(e=>rt.includes(e));return void goSelected([...Ke.filter(e=>!t.includes(e)),...t])}et.current=e,goSelected(Ke.includes(e)?Ke.filter(t=>t!==e):[...Ke,e])})(s,Boolean(t.event.shiftKey)),onClick:e=>e.stopPropagation(),"aria-label":Ce.selectRow})}):null,I.map(t=>e("td",{style:{...bodyCellStyle(l),textAlign:t.align??"start"},children:t.render?t.render(r,n):r[t.key]},t.key))]},s)})})]}),gt?t("div",{style:{...pt,borderTop:A},children:[e("span",{className:v(w[Se],"text-(--plass-muted-fg)"),children:x(ye)?ye:`${We.length} / ${Qe}`}),"pages"===ce?e(n,{size:Se,color:Ne,density:je,count:Ue,page:Ve,onPageChange:goPage}):null]}):null]})}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as a from"react";import{useDefaults as o}from"../../internal/defaults.js";import{PlButton as n}from"../button/PlButton.js";import{Calendar as l,usePickerLabels as r}from"../../internal/calendar.js";import{CalendarIcon as s}from"../../internal/icons.js";import{PickerFooter as i,PickerShell as c}from"../../internal/picker.js";import{displaySamples as d,formatDate as m,isDayOutside as u,isMonthOutside as h,isValidDate as p,isYearOutside as f,localeWeekStart as y,mergeDateAndTime as b,startOfDay as g,startOfMonth as j,startOfYear as D,toISODate as O,toISOMonth as S,toISOYear as k,today as x,withPlaceholder as v}from"../../internal/date.js";import{cx as z}from"../../internal/styles.js";const C={day:{dateStyle:"medium"},month:{year:"numeric",month:"long"},year:{year:"numeric"}},w={day:O,month:S,year:k};export const PlDatePicker=/* @__PURE__ */a.forwardRef(function PlDatePicker({value:O,defaultValue:S,onValueChange:k,precision:P="day",open:M,defaultOpen:V,onOpenChange:B,defaultMonth:I,minDate:R,maxDate:E,shouldDisableDate:F,locale:N,weekStartsOn:T,format:Y,placeholder:q,clearable:A=!1,showTodayButton:G=!0,closeOnSelect:H=!0,labels:J,name:K,size:L,color:Q,density:U,readOnly:W=!1,disabled:X=!1,startIcon:Z,...$},_){const ee=o(),te=N??ee.locale,ae=L??ee.size??"md",oe=Q??ee.color??"primary",ne=U??ee.density??"default",le=r(J),re=T??ee.weekStartsOn??y(te),se=Y??C[P],[ie,ce]=a.useState(S??null),de=void 0!==O?O:ie,[me,ue]=a.useState(V??!1),he=M??me,[pe,fe]=a.useState(()=>j(p(de)?de:I??x()));a.useEffect(()=>{he&&fe(j(p(de)?de:I??x()))},[he]);const setOpen=e=>{e&&(W||X)||(void 0===M&&ue(e),B?.(e))},commit=e=>{void 0===O&&ce(e),k?.(e)},select=e=>{const t=p(de)?b(e,de):g(e);commit(t),fe(j(t)),H&&setOpen(!1)},ye=x(),be="day"===P?ye:"month"===P?j(ye):D(ye),ge="day"===P?le.today:"month"===P?le.thisMonth:le.thisYear,je="day"===P?u(ye,R,E)||(F?.(ye)??!1):"month"===P?h(ye,R,E):f(ye,R,E),De=G||A,Oe=a.useMemo(()=>v(d(te,se),q),[te,se,q]);return e(c,{...$,size:ae,color:oe,density:ne,readOnly:W,disabled:X,triggerRef:_,startIcon:Z??e(s,{}),display:p(de)?m(de,te,se):q??"",samples:Oe,empty:!p(de),clearable:A,onClear:()=>commit(null),open:he,onOpenChange:setOpen,labels:le,name:K,formValue:p(de)?w[P](de):"",children:t("div",{className:z("flex flex-col",De&&"gap-1.5"),children:[e(l,{size:ae,color:oe,locale:te,weekStartsOn:re,month:pe,onMonthChange:fe,precision:P,selected:[de],onSelect:select,minDate:R,maxDate:E,shouldDisableDate:F,labels:le,autoFocus:!0}),De?t(i,{size:ae,children:[A?e(n,{variant:"ghost",size:ae,color:oe,density:"compact",onClick:()=>{commit(null),setOpen(!1)},children:le.clear}):null,G?e(n,{variant:"ghost",size:ae,color:oe,density:"compact",disabled:je,onClick:()=>select(be),children:ge}):null]}):null]})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as n from"react";import{useDefaults as t}from"../../internal/defaults.js";import{PlButton as a}from"../button/PlButton.js";import{Calendar as s,usePickerLabels as r}from"../../internal/calendar.js";import{ArrowRightIcon as o,CalendarIcon as i}from"../../internal/icons.js";import{PickerFooter as c,PickerShell as u}from"../../internal/picker.js";import{WidthSizer as d}from"../../internal/sizer.js";import{addMonths as m,compareDay as p,displaySamples as f,formatDate as h,isValidDate as x,localeWeekStart as g,startOfDay as v,startOfMonth as y,toISODate as w,today as b,withPlaceholder as N}from"../../internal/date.js";import{cx as j,gapClasses as S,metaTextClasses as D}from"../../internal/styles.js";const C={start:null,end:null};export const PlDateRangePicker=/* @__PURE__ */n.forwardRef(function PlDateRangePicker({value:O,defaultValue:k,onValueChange:P,open:z,defaultOpen:M,onOpenChange:R,defaultMonth:B,minDate:V,maxDate:E,shouldDisableDate:I,locale:F,weekStartsOn:W,format:q={dateStyle:"medium"},monthCount:A=2,startPlaceholder:G,endPlaceholder:H,presets:J,clearable:K=!1,closeOnSelect:L=!0,labels:Q,name:T,size:U,color:X,density:Y,readOnly:Z=!1,disabled:$=!1,startIcon:_,...ee},le){const ne=t(),te=F??ne.locale,ae=U??ne.size??"md",se=X??ne.color??"primary",re=Y??ne.density??"default",oe=r(Q),ie=W??ne.weekStartsOn??g(te),[ce,ue]=n.useState(k??C),de=void 0!==O?O??C:ce,me=x(de.start)?de.start:null,pe=x(de.end)?de.end:null,[fe,he]=n.useState(M??!1),xe=z??fe,[ge,ve]=n.useState(null),[ye,we]=n.useState(null),[be,Ne]=n.useState(()=>y(me??B??b()));n.useEffect(()=>{xe?Ne(y(me??B??b())):(ve(null),we(null))},[xe]);const setOpen=e=>{e&&(Z||$)||(void 0===z&&he(e),R?.(e))},commit=e=>{void 0===O&&ue(e),P?.(e)},je=ge??me,Se=null!==ge?ye:pe,write=(l,n)=>x(l)?h(l,te,q):e("span",{className:"text-(--plass-muted-fg)",children:n??""}),De=m(be,1),Ce=2===A,Oe=ee.fullWidth??!1,ke=n.useMemo(()=>Oe?[]:f(te,q),[Oe,te,q]),Pe=null!==ge?oe.end:null===me?oe.start:null,ze={size:ae,color:se,locale:te,weekStartsOn:ie,selected:[me,pe,ge],rangeStart:je,rangeEnd:Se,onSelect:e=>{const l=v(e);if(null===ge)return ve(l),we(l),void commit({start:l,end:null});const[n,t]=p(l,ge)<0?[l,ge]:[ge,l];ve(null),we(null),commit({start:n,end:t}),L&&setOpen(!1)},onPreviewChange:e=>{null!==ge&&we(e??ge)},minDate:V,maxDate:E,shouldDisableDate:I,showOutsideDays:!1,labels:oe};return e(u,{...ee,size:ae,color:se,density:re,readOnly:Z,disabled:$,triggerRef:le,startIcon:_??e(i,{}),display:l("span",{className:"flex min-w-0 items-center gap-1.5",children:[l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(me,G)}),Oe?null:e(d,{samples:N(ke,G)})]}),e("span",{"aria-hidden":"true",className:"flex shrink-0 items-center text-(--plass-muted-fg) rtl:rotate-180",children:e(o,{})}),l("span",{className:"flex min-w-0 flex-col",children:[e("span",{className:"truncate",children:write(pe,H)}),Oe?null:e(d,{samples:N(ke,H)})]})]}),empty:null===me&&null===pe,clearable:K,onClear:()=>commit(C),open:xe,onOpenChange:setOpen,labels:oe,name:T,formValue:[me?w(me):"",pe?w(pe):""],children:l("div",{className:"flex flex-col gap-1.5",children:[l("div",{className:j("flex items-stretch",S[ae]),children:[J&&J.length>0?e("div",{className:j("flex max-h-[calc(var(--p-cell,2.5rem)*8)] flex-col overflow-y-auto border-e pe-1.5","[border-color:var(--plass-divider)]"),children:J.map((l,n)=>e(a,{variant:"ghost",size:ae,color:se,density:"compact",className:"justify-start whitespace-nowrap",onClick:()=>(e=>{const l="function"==typeof e.value?e.value():e.value;ve(null),we(null),commit(l),x(l.start)&&Ne(y(l.start)),L&&setOpen(!1)})(l),children:l.label},n))}):null,e(s,{...ze,month:be,onMonthChange:Ne,showNextButton:!Ce,autoFocus:!0}),Ce?e(s,{...ze,month:De,onMonthChange:e=>Ne(m(e,-1)),showPreviousButton:!1}):null]}),K||null!==Pe?l(c,{size:ae,children:[null!==Pe?e("span",{className:j("me-auto text-(--plass-muted-fg)",D[ae]),children:Pe}):null,K?e(a,{variant:"ghost",size:ae,color:se,density:"compact",onClick:()=>{ve(null),we(null),commit(C),setOpen(!1)},children:oe.clear}):null]}):null]})})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as s,jsxs as l,Fragment as e}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{Dialog as
|
|
1
|
+
"use client";import{jsx as s,jsxs as l,Fragment as e}from"react/jsx-runtime";import*as r from"react";import{useDefaults as a}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{Dialog as i}from"@base-ui/react/dialog";import{CloseIcon as d}from"../../internal/icons.js";import{cx as t,focusRingClasses as n,glassClasses as u,hasContent as p,metaTextClasses as m,sheetBodyClasses as c,sheetHeaderGapClasses as f,sheetLineClasses as x,sheetPaddingXClasses as g,sheetPaddingYClasses as h,sheetSectionGapClasses as b,sheetTitleClasses as v,surfaceSlots as y,targetClasses as w}from"../../internal/styles.js";const j={xs:"w-56",sm:"w-64",md:"w-80",lg:"w-96",xl:"w-[28rem]"},N={left:{xs:"rounded-r-(--plass-radius-xs)",sm:"rounded-r-(--plass-radius-sm)",md:"rounded-r-(--plass-radius-md)",lg:"rounded-r-(--plass-radius-lg)",xl:"rounded-r-(--plass-radius-xl)"},right:{xs:"rounded-l-(--plass-radius-xs)",sm:"rounded-l-(--plass-radius-sm)",md:"rounded-l-(--plass-radius-md)",lg:"rounded-l-(--plass-radius-lg)",xl:"rounded-l-(--plass-radius-xl)"},top:{xs:"rounded-b-(--plass-radius-xs)",sm:"rounded-b-(--plass-radius-sm)",md:"rounded-b-(--plass-radius-md)",lg:"rounded-b-(--plass-radius-lg)",xl:"rounded-b-(--plass-radius-xl)"},bottom:{xs:"rounded-t-(--plass-radius-xs)",sm:"rounded-t-(--plass-radius-sm)",md:"rounded-t-(--plass-radius-md)",lg:"rounded-t-(--plass-radius-lg)",xl:"rounded-t-(--plass-radius-xl)"}},k={left:"border-r",right:"border-l",top:"border-b",bottom:"border-t"},z={left:"flex-row justify-start",right:"flex-row justify-end",top:"flex-col justify-start",bottom:"flex-col justify-end"},_=/* @__PURE__ */[u,"relative flex flex-col overflow-hidden","text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[outline:none]"].join(" "),C=/* @__PURE__ */["[transition:opacity_var(--plass-duration-slow)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),$=/* @__PURE__ */["fixed inset-0 z-(--plass-z-portal) bg-(--plass-scrim)","[backdrop-filter:blur(2px)] [-webkit-backdrop-filter:blur(2px)]",C].join(" "),D=/* @__PURE__ */[w,"flex size-[1.6em] shrink-0 cursor-pointer items-center justify-center","rounded-full text-(--plass-muted-fg)","[&_svg]:size-[1.1em] [&_svg]:shrink-0","[transition:background-color_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","hover:bg-(--p-soft) hover:text-(--plass-fg)",n].join(" ");export const PlDrawerClose=i.Close;export function PlDrawer({side:n="left",mode:u="overlay",size:w,color:P,density:O,open:T,defaultOpen:B,onOpenChange:F,trigger:L,title:R,description:S,actions:V,dividers:q=!1,showClose:A,closeLabel:E,extent:G,rounded:H=!0,modal:I=!0,dismissible:J=!0,className:K,classNames:M,style:Q,children:U,...W}){const X=a(),Y=o(),Z=E??Y.close,ss=w??X.size??"md",ls=P??X.color??"primary",es=O??X.density??"default",rs="overlay"===u,as="left"===n||"right"===n,os=A??rs,[is,ds]=r.useState(B??!0),ts=g[es][ss],ns=h[es][ss],us=q?`${ts} ${ns}`:ts,ps=p(R)||p(S),ms=p(V),cs=void 0===G?null:{[as?"width":"height"]:"number"==typeof G?`${G}px`:G},fs=t(_,c[ss],k[n],H?N[n][ss]:"",rs?"[box-shadow:var(--plass-shadow-4),var(--plass-gloss-glass)]":"[box-shadow:var(--plass-gloss-glass)]",rs?C:"",as?`h-full max-w-full ${void 0===G?j[ss]:""}`:"w-full "+(void 0===G?"max-h-[85%]":""),q?"":`${ns} ${b[ss]}`,K),xs=rs?i.Title:"h2",gs=rs?i.Description:"p",hs=l(e,{children:[ps||os?l("div",{className:t("flex shrink-0 items-start gap-3",us),children:[l("div",{className:t("flex min-w-0 flex-1 flex-col",f[ss]),children:[p(R)?s(xs,{className:t("m-0 font-semibold",v[ss]),children:R}):null,p(S)?s(gs,{className:t("m-0 text-(--plass-muted-fg)",m[ss]),children:S}):null]}),os?rs?s(i.Close,{"aria-label":Z,className:D,children:s(d,{})}):s("button",{type:"button","aria-label":Z,className:D,onClick:()=>{void 0===T&&ds(!1),F?.(!1)},children:s(d,{})}):null]}):null,p(U)?s("div",{className:t("min-h-0 flex-1 overflow-y-auto overscroll-contain",us,q&&(ps||os)?x:"",q?"":"-my-1 py-1"),children:U}):null,ms?s("div",{className:t("flex shrink-0 flex-wrap items-center justify-end gap-2",us,q?x:""),children:V}):null]});return rs?l(i.Root,{open:T,defaultOpen:B,modal:I,disablePointerDismissal:!J,onOpenChange:(s,l)=>{J||s||"escape-key"!==l.reason?F?.(s):l.cancel()},children:[L?s(i.Trigger,{render:L}):null,l(i.Portal,{children:[s(i.Backdrop,{className:t("plass-portal",$,M?.backdrop)}),s(i.Viewport,{className:t("plass-portal fixed inset-0 z-(--plass-z-portal) flex",z[n]),children:s(i.Popup,{className:fs,style:{...y(ls,3),...cs,...Q},...W,children:hs})})]})]}):T??is?s("div",{className:fs,style:{...y(ls,0),...cs,...Q},...W,children:hs}):null}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as s from"react";import{useDefaults as l}from"../../internal/defaults.js";import{controlSlots as r,cx as n,hasContent as i,metaTextClasses as c,sheetPaddingYClasses as a,sheetTitleClasses as m,stackGapClasses as o}from"../../internal/styles.js";const x={xs:"text-2xl",sm:"text-3xl",md:"text-4xl",lg:"text-5xl",xl:"text-6xl"};export const PlEmpty=/* @__PURE__ */s.forwardRef(function PlEmpty({icon:s,title:d,description:f,actions:p,size:u,color:y,density:h,className:j,style:g,children:N,...v},w){const z=l(),E=u??z.size??"md",P=y??z.color??"secondary",b=h??z.density??"default";return t("div",{ref:w,className:n("flex flex-col items-center justify-center text-center",o[E],a[b][E],j),style:{...r(P,0,"ghost"),...g},...v,children:[i(s)?e("span",{"aria-hidden":"true",className:n("flex items-center justify-center text-(--p-accent) [&_svg]:size-[1em]",x[E]),children:s}):null,i(d)?e("p",{className:n("font-semibold text-(--plass-fg)",m[E]),children:d}):null,i(f)?e("p",{className:n("max-w-prose text-(--plass-muted-fg)",c[E]),children:f}):null,N,i(p)?e("div",{className:n("flex flex-wrap items-center justify-center gap-2"),children:p}):null]})});
|
|
1
|
+
"use client";import{jsx as e,jsxs as t}from"react/jsx-runtime";import*as s from"react";import{useDefaults as l}from"../../internal/defaults.js";import{controlSlots as r,cx as n,hasContent as i,metaTextClasses as c,sheetPaddingYClasses as a,sheetTitleClasses as m,stackGapClasses as o}from"../../internal/styles.js";const x={xs:"text-2xl",sm:"text-3xl",md:"text-4xl",lg:"text-5xl",xl:"text-6xl"};export const PlEmpty=/* @__PURE__ */s.forwardRef(function PlEmpty({icon:s,title:d,description:f,actions:p,size:u,color:y,density:h,className:j,style:g,children:N,...v},w){const z=l(),E=u??z.size??"md",P=y??z.color??"secondary",b=h??z.density??"default";return t("div",{ref:w,className:n("flex flex-col items-center justify-center text-center",o[E],a[b][E],j),style:{...r(P,0,"ghost"),...g},...v,children:[i(s)?e("span",{"aria-hidden":"true",className:n("flex items-center justify-center text-(--p-accent) [&_svg]:size-[1em]",x[E]),children:s}):null,i(d)?e("p",{className:n("m-0 font-semibold text-(--plass-fg)",m[E]),children:d}):null,i(f)?e("p",{className:n("m-0 max-w-prose text-(--plass-muted-fg)",c[E]),children:f}):null,N,i(p)?e("div",{className:n("flex flex-wrap items-center justify-center gap-2"),children:p}):null]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as s from"react";import{Fieldset as r}from"@base-ui/react/fieldset";import{FieldsetDisabledContext as i,useDisabled as n}from"../../internal/form.js";import{cx as t,hasContent as a,metaTextClasses as o,sheetHeaderGapClasses as d,sheetSectionGapClasses as m,sheetTitleClasses as c}from"../../internal/styles.js";export const PlFieldset=/* @__PURE__ */s.forwardRef(function PlFieldset({legend:s,description:f,disabled:p=!1,size:u="md",className:x,children:h,...b},j){const N=a(s)||a(f),g=n(p);return l(r.Root,{ref:j,disabled:p,className:t("m-0 flex min-w-0 flex-col border-0 p-0",m[u],x),...b,children:[N?l(r.Legend,{className:t("flex min-w-0 flex-col p-0",d[u]),children:[a(s)?e("span",{className:t("font-semibold",c[u]),children:s}):null,a(f)?e("span",{className:t("text-(--plass-muted-fg)",o[u]),children:f}):null]}):null,e(i.Provider,{value:g,children:h})]})});
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
-
import type { PlassElevation, PlassStyleProps } from '../../types.js';
|
|
2
|
+
import type { PlassElevation, PlassFieldLabelPlacement, PlassStyleProps } from '../../types.js';
|
|
3
3
|
/** Why a file was turned away. One reason per file, in the order they are checked. */
|
|
4
4
|
export type PlFileRejectionReason = 'type' | 'size' | 'count';
|
|
5
5
|
export interface PlFileRejection {
|
|
@@ -38,8 +38,16 @@ export interface PlFilePickerProps extends PlassStyleProps, Omit<React.Component
|
|
|
38
38
|
* file disappears silently, which is the single worst thing a dropzone does.
|
|
39
39
|
*/
|
|
40
40
|
onReject?: (rejections: PlFileRejection[]) => void;
|
|
41
|
-
/**
|
|
41
|
+
/** The name of what the box collects. */
|
|
42
42
|
label?: React.ReactNode;
|
|
43
|
+
/**
|
|
44
|
+
* Where the `label` goes — above the box, or in its top edge. `float` puts it
|
|
45
|
+
* in the edge as well: the box always has words of its own where a floating
|
|
46
|
+
* label would rest.
|
|
47
|
+
* Falls back to the nearest `PlassProvider`, then to `top`.
|
|
48
|
+
* @default 'top'
|
|
49
|
+
*/
|
|
50
|
+
labelPlacement?: PlassFieldLabelPlacement;
|
|
43
51
|
/** Helper text below the box. */
|
|
44
52
|
description?: React.ReactNode;
|
|
45
53
|
/** Error message below. Its presence also turns the picker invalid. */
|
|
@@ -60,6 +68,16 @@ export interface PlFilePickerProps extends PlassStyleProps, Omit<React.Component
|
|
|
60
68
|
* @default true
|
|
61
69
|
*/
|
|
62
70
|
showList?: boolean;
|
|
71
|
+
/**
|
|
72
|
+
* Says under the box why files were turned away, one line per reason.
|
|
73
|
+
*
|
|
74
|
+
* On, because a dropzone that swallows a file without a word is the single
|
|
75
|
+
* worst thing a dropzone does, and `onReject` alone leaves that to a caller
|
|
76
|
+
* who has to remember. Turn it off when the app shows the same thing
|
|
77
|
+
* somewhere of its own — `onReject` still fires either way.
|
|
78
|
+
* @default true
|
|
79
|
+
*/
|
|
80
|
+
showRejections?: boolean;
|
|
63
81
|
/**
|
|
64
82
|
* Accessible name of a file's remove button. Receives the file's name.
|
|
65
83
|
* @default `Remove {name}`, from the label pack
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as s from"react";import{Field as
|
|
1
|
+
"use client";import{jsx as e,jsxs as r}from"react/jsx-runtime";import*as s from"react";import{Field as o}from"@base-ui/react/field";import{useDefaults as l}from"../../internal/defaults.js";import{FormControl as a,leaveFormControl as t,useFormReport as n,useDisabled as i}from"../../internal/form.js";import{glowPointerMove as d}from"../../internal/glow.js";import{CloseIcon as c}from"../../internal/icons.js";import{useLabels as p}from"../../internal/labels.js";import{FieldNotch as f,notchShellStyle as u,resolveNotch as m}from"../../internal/notch.js";import{controlTextLeadingClasses as h,disabledClasses as b,fieldSlots as v,focusRingClasses as g,gapClasses as x,glassClasses as y,hasContent as j,iconClasses as $,metaTextClasses as k,radiusClasses as w,readOnlyFilterClasses as N,sheetTitleClasses as z,stackGapClasses as _,targetClasses as C,transitionClasses as I}from"../../internal/styles.js";const B={default:{xs:"p-4",sm:"p-5",md:"p-6",lg:"p-8",xl:"p-10"},compact:{xs:"p-2",sm:"p-3",md:"p-4",lg:"p-5",xl:"p-6"}},R={solid:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--plass-glass)","[border-color:var(--plass-border)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:"border-2 border-dashed text-(--plass-fg) bg-transparent [border-color:var(--plass-border)]"},L={solid:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",glass:"hover:bg-(--plass-glass-hover) hover:[border-color:var(--p-line-hover)]",ghost:"hover:bg-(--p-soft) hover:[border-color:var(--p-line-hover)]"},T=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)]","group-hover/field:[border-color:var(--p-line-hover)]","group-has-[:focus-visible]/field:[border-color:var(--p-ring)]"].join(" "),D=/* @__PURE__ */["border-2 border-dashed [border-color:var(--plass-border)] opacity-50","forced-colors:[border-color:GrayText]"].join(" "),M={solid:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),glass:/* @__PURE__ */[y,"border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass),0_0_0_4px_var(--p-soft)]"].join(" "),ghost:/* @__PURE__ */["border-2 border-dashed text-(--plass-fg) bg-(--p-soft-hover)","[border-color:var(--p-ring)]","[box-shadow:0_0_0_4px_var(--p-soft)]"].join(" ")};function UploadIcon(){return r("svg",{viewBox:"0 0 16 16",fill:"none","aria-hidden":"true",children:[e("path",{d:"M8 10.5V2.75m0 0L5.25 5.5M8 2.75 10.75 5.5",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round",strokeLinejoin:"round"}),e("path",{d:"M2.75 9.75v1.75a1.75 1.75 0 0 0 1.75 1.75h7a1.75 1.75 0 0 0 1.75-1.75V9.75",stroke:"currentColor",strokeWidth:"1.5",strokeLinecap:"round"})]})}export function formatFileSize(e){if(e<1e3)return`${e} B`;const r=["kB","MB","GB","TB"];let s=e/1e3,o=0;for(;s>=1e3&&o<r.length-1;)s/=1e3,o+=1;return`${s<10?s.toFixed(1):Math.round(s)} ${r[o]}`}function matchesAccept(e,r){const s=e.name.toLowerCase(),o=e.type.toLowerCase();return r.split(",").map(e=>e.trim().toLowerCase()).filter(Boolean).some(e=>e.startsWith(".")?s.endsWith(e):e.endsWith("/*")?o.startsWith(e.slice(0,-1)):o===e)}export const PlFilePicker=/* @__PURE__ */s.forwardRef(function PlFilePicker({variant:y="glass",size:P,color:F,density:S,elevation:W=0,accept:E,multiple:V=!1,maxSize:A,maxFiles:O,value:q,defaultValue:G,onFilesChange:U,onReject:H,label:Y,labelPlacement:J,description:K,error:Q,invalid:X,title:Z,hint:ee,icon:re,showList:se=!0,showRejections:oe=!0,removeLabel:le,fullWidth:ae=!0,disabled:te=!1,readOnly:ne=!1,required:ie=!1,name:de,id:ce,className:pe,style:fe,...ue},me){const he=l(),be=i(te),ve=p(),ge=le??ve.removeItem,xe=P??he.size??"md",ye=F??he.color??"primary",je=S??he.density??"default",$e=J??he.labelPlacement??"top",{notched:ke}=m($e,Y,!0),we=s.useRef(null),Ne=s.useRef(null),ze=s.useRef(null);s.useImperativeHandle(me,()=>we.current);const[_e,Ce]=s.useState(()=>[...G??[]]),Ie=s.useMemo(()=>q?[...q]:_e,[q,_e]),Be=s.useRef(0),[Re,Le]=s.useState(!1),[Te,De]=s.useState({type:0,size:0,count:0}),Me=j(Q),Pe=X??Me,Fe=Pe?"danger":ye,Se=be||ne,We=s.useId(),Ee=`${We}-error`,Ve=`${We}-label`,Ae=ce??`${We}-zone`,Oe=s.useCallback(e=>{const r=we.current;if(!r||"undefined"==typeof DataTransfer)return;const s=new DataTransfer;for(const r of e)s.items.add(r);r.files=s.files},[]);s.useEffect(()=>{Oe(Ie)},[Ie,Oe]),n(de,()=>[...Ie],!be);const qe=s.useCallback(e=>{q||Ce(e),U?.(e)},[U,q]),Ge=s.useCallback(e=>{const r=[],s=[],o=V?O??Number.POSITIVE_INFINITY:1,l=V?Ie.length:0;for(const a of e)E&&!matchesAccept(a,E)?s.push({file:a,reason:"type"}):void 0!==A&&a.size>A?s.push({file:a,reason:"size"}):l+r.length>=o?s.push({file:a,reason:"count"}):r.push(a);return{kept:r,rejections:s}},[E,Ie.length,O,A,V]),Ue=s.useCallback(e=>{const{kept:r,rejections:s}=Ge(e),o={type:0,size:0,count:0};for(const e of s)o[e.reason]+=1;De(o),s.length>0&&H?.(s),r.length>0&&qe(V?[...Ie,...r]:r)},[Ge,qe,Ie,V,H]),He=s.useCallback(()=>{De(e=>e.type||e.size||e.count?{type:0,size:0,count:0}:e)},[]),Ye=[["type",ve.filesRejectedType],["size",ve.filesRejectedSize],["count",ve.filesRejectedCount]].filter(([e])=>Te[e]>0),browse=()=>{Se||(He(),we.current?.click())},Je=["relative flex w-full flex-col items-center justify-center text-center","cursor-pointer select-none",B[je][xe],w[xe],x[xe],I,$,ke?"":g,be?`${b[y]} border-2 border-dashed`:ne?`${R[y]} ${N} cursor-default`:Re?M[y]:R[y],Se||Re?"":L[y],Se?"":"plass-glow"].filter(Boolean).join(" "),Ke=e("span",{id:Ve,className:[k[xe],"font-semibold",be?"text-(--plass-muted-fg)":"text-(--plass-fg)"].join(" "),children:Y});return r(o.Root,{name:de,disabled:be,invalid:Pe,className:["flex-col align-top",_[xe],ae?"flex w-full":"inline-flex",pe??""].filter(Boolean).join(" "),style:{...v(Fe,W),...fe},...ue,children:[j(Y)&&!ke?Ke:null,r("div",{className:`flex w-full flex-col ${_[xe]}`,onDragEnter:e=>{Se||(e.preventDefault(),Be.current+=1,Le(!0))},onDragOver:e=>{Se||(e.preventDefault(),e.dataTransfer.dropEffect="copy")},onDragLeave:()=>{Se||(Be.current=Math.max(0,Be.current-1),0===Be.current&&Le(!1))},onDrop:e=>{Se||(e.preventDefault(),Be.current=0,Le(!1),Ue(Array.from(e.dataTransfer.files)))},children:[e(o.Validity,{children:({validity:s})=>{const o=!1===s.valid,l=!Me&&o&&!be&&!0!==X,a=[j(K)||Me?We:null,l?Ee:null].filter(Boolean).join(" ")||void 0;return e(f,{notched:ke,size:xe,density:je,variant:y,disabled:be,readOnly:ne,label:Ke,edgeClassName:be?D:Se?"border-2 border-dashed [border-color:var(--plass-border)]":Re?"border-2 border-dashed [border-color:var(--p-ring)]":T,children:r("button",{ref:Ne,type:"button",id:Ae,"aria-labelledby":j(Y)?`${Ve} ${Ae}`:void 0,disabled:be,"aria-describedby":a,"aria-invalid":Pe||o||void 0,className:Je,style:ke?u:void 0,onPointerMove:d(!Se),onClick:browse,onBlur:()=>t(ze.current),children:[void 0===re?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:e(UploadIcon,{})}):j(re)?e("span",{className:"flex items-center text-(--p-accent) [&_svg]:size-[1.8em]",children:re}):null,e("span",{className:`font-semibold ${z[xe]}`,children:Z??ve.filePickerTitle}),j(ee)?e("span",{className:`text-(--plass-muted-fg) ${k[xe]}`,children:ee}):null]})})}}),e("input",{ref:we,type:"file",name:de,accept:E,multiple:V,disabled:Se,tabIndex:-1,"aria-hidden":"true",className:"absolute size-px overflow-hidden opacity-0 [clip-path:inset(50%)]",onChange:e=>{Ue(Array.from(e.target.files??[])),Oe(Ie)}}),se&&Ie.length>0?e("ul",{role:"list",className:`flex w-full flex-col ${_[xe]} m-0 list-none p-0`,children:Ie.map((s,o)=>r("li",{className:["flex w-full items-center gap-2 px-2 py-1.5",w.xs,h[xe],"bg-(--p-soft) text-(--plass-fg)"].join(" "),children:[e("span",{className:"min-w-0 flex-1 truncate",children:s.name}),e("span",{className:`shrink-0 text-(--plass-muted-fg) tabular-nums ${k[xe]}`,children:formatFileSize(s.size)}),Se?null:e("button",{type:"button","aria-label":ge(s.name),className:[C,"inline-flex shrink-0 cursor-pointer items-center justify-center rounded-full","size-[1.3em] text-(--plass-muted-fg) opacity-70","[transition:opacity_var(--plass-duration)_var(--plass-ease),color_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","[&_svg]:size-[0.9em]","hover:text-(--plass-fg) hover:opacity-100 focus-visible:opacity-100",g].join(" "),onClick:()=>{He(),qe(Ie.filter((e,r)=>r!==o))},children:e(c,{})})]},`${s.name}-${s.size}-${s.lastModified}-${o}`))}):null]}),oe&&Ye.length>0?e("div",{role:"status",className:`flex w-full flex-col ${k[xe]} text-(--plass-danger-accent)`,children:Ye.map(([r,s])=>e("span",{children:s(Te[r])},r))}):null,j(K)&&!Me?e("span",{id:We,className:`${k[xe]} text-(--plass-muted-fg)`,children:K}):null,Me?e("span",{id:We,className:`${k[xe]} text-(--p-accent)`,children:Q}):e(o.Error,{id:Ee,className:`${k[xe]} text-(--p-accent)`}),e(a,{ref:ze,value:Ie.map(e=>e.name),required:ie&&!ne,disabled:be,standIn:()=>Ne.current})]})});
|
|
@@ -28,6 +28,11 @@ export interface PlFloatingActionButtonProps extends Omit<PlButtonProps, 'childr
|
|
|
28
28
|
corner?: PlassCorner;
|
|
29
29
|
/**
|
|
30
30
|
* How far it stands off the two edges it is against. A number is pixels.
|
|
31
|
+
*
|
|
32
|
+
* The device's safe area on those two edges is added on top, so the button
|
|
33
|
+
* clears the home indicator, the navigation bar or a camera cutout of an
|
|
34
|
+
* edge-to-edge screen rather than sitting under it. On a screen with no such
|
|
35
|
+
* edge the safe area is `0`, and this is the whole distance.
|
|
31
36
|
* @default '1.5rem'
|
|
32
37
|
*/
|
|
33
38
|
offset?: number | string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t}from"react/jsx-runtime";import*as
|
|
1
|
+
"use client";import{jsx as t}from"react/jsx-runtime";import*as n from"react";import{PlButton as o}from"../button/PlButton.js";import{PlIconButton as e}from"../icon-button/PlIconButton.js";import{useDefaults as a}from"../../internal/defaults.js";import{cx as r,safeInlineClasses as i,toLength as s}from"../../internal/styles.js";const l={"top-start":["Start","Start"],"top-end":["Start","End"],"bottom-start":["End","Start"],"bottom-end":["End","End"]},c={Start:"env(safe-area-inset-top, 0px)",End:"env(safe-area-inset-bottom, 0px)"};export const PlFloatingActionButton=/* @__PURE__ */n.forwardRef(function PlFloatingActionButton({icon:n,label:m,extended:f=!1,corner:d="bottom-end",offset:p,floating:u=!0,variant:b="solid",size:x,elevation:v=3,className:j,style:B,...E},S){const $=a(),g=x??$.size??"lg",[z,P]=l[d],y=s(p)??"1.5rem",I=u?{position:"fixed",[`insetBlock${z}`]:`calc(${y} + ${c[z]})`,[`insetInline${P}`]:`calc(${y} + var(--p-safe-inline, 0px))`}:{},A={ref:S,variant:b,size:g,elevation:v,className:r(u&&"z-30",u&&i[P],j),style:{...I,...B},...E};return f?t(o,{...A,startIcon:n,children:m}):t(e,{...A,icon:n,label:m})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as t,Fragment as a}from"react/jsx-runtime";import*as s from"react";import{useDefaults as r}from"../../internal/defaults.js";import{useRender as i}from"@base-ui/react/use-render";import{controlHeightClasses as l,controlSlots as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as a}from"react/jsx-runtime";import*as s from"react";import{useDefaults as r}from"../../internal/defaults.js";import{useRender as i}from"@base-ui/react/use-render";import{useBottomBarHeight as o}from"../../internal/bottom-bar.js";import{controlHeightClasses as l,controlSlots as n,controlSquareClasses as d,cx as c,focusRingClasses as p,glassClasses as u,hasContent as f,iconSizeClasses as m,srOnlyClasses as g,transitionClasses as b}from"../../internal/styles.js";const v=/* @__PURE__ */s.createContext({value:null,change:()=>{},size:"md",disabled:!1}),h={xs:"pb-2",sm:"pb-3",md:"pb-4",lg:"pb-5",xl:"pb-6"},x={xs:"pb-[calc(env(safe-area-inset-bottom)+0.5rem)]",sm:"pb-[calc(env(safe-area-inset-bottom)+0.75rem)]",md:"pb-[calc(env(safe-area-inset-bottom)+1rem)]",lg:"pb-[calc(env(safe-area-inset-bottom)+1.25rem)]",xl:"pb-[calc(env(safe-area-inset-bottom)+1.5rem)]"},y={default:{xs:"p-1",sm:"p-1",md:"p-1.5",lg:"p-2",xl:"p-2.5"},compact:{xs:"p-0.5",sm:"p-0.5",md:"p-1",lg:"p-1",xl:"p-1.5"}},w={default:{xs:"gap-1",sm:"gap-1",md:"gap-1.5",lg:"gap-2",xl:"gap-2.5"},compact:{xs:"gap-0.5",sm:"gap-0.5",md:"gap-1",lg:"gap-1",xl:"gap-1.5"}},N={static:"",sticky:"sticky bottom-0 z-20",fixed:"fixed inset-x-0 bottom-0 z-30"},j={solid:/* @__PURE__ */[u,"bg-(--plass-glass-press)","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),glass:/* @__PURE__ */[u,"border bg-(--plass-glass)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--p-elev),var(--plass-gloss-glass)]"].join(" "),ghost:""},z=/* @__PURE__ */["pointer-events-none absolute rounded-full","top-(--p-disc-y) left-(--p-disc-x) h-(--p-disc-h) w-(--p-disc-w)","[background-image:var(--p-fill)]","[box-shadow:var(--plass-shadow-1),var(--p-lift)]","forced-colors:border-2 forced-colors:[border-color:Highlight]","data-[quiet]:opacity-50 data-[quiet]:saturate-[0.35]","[transition-property:left,top,width,height,opacity,filter]","[transition-timing-function:var(--plass-ease)]","[transition-duration:0ms] motion-safe:data-[ready]:[transition-duration:var(--plass-duration)]"].join(" ");export const PlFloatingBottomNavigation=/* @__PURE__ */s.forwardRef(function PlFloatingBottomNavigation({variant:a="glass",size:l,color:d,density:p,elevation:u=2,value:f,defaultValue:m=null,onValueChange:g,position:k="fixed",safeArea:P=!0,disabled:C=!1,label:A,render:R,className:F,style:q,children:B,...$},E){const H=r(),I=l??H.size??"md",L=d??H.color??"primary",O=p??H.density??"default",[S,V]=s.useState(m),W=void 0!==f,D=W?f:S,M=s.useRef(null),T=s.useRef(null),G=s.useCallback(e=>{const t=M.current,a=T.current;if(!t||!a)return;const s=t.querySelector("[data-disc][data-current]");if(!s)return a.hidden=!0,void a.removeAttribute("data-ready");a.hidden=!1;const r=!e||!a.hasAttribute("data-ready");r&&a.removeAttribute("data-ready"),a.style.setProperty("--p-disc-x",`${s.offsetLeft}px`),a.style.setProperty("--p-disc-y",`${s.offsetTop}px`),a.style.setProperty("--p-disc-w",`${s.offsetWidth}px`),a.style.setProperty("--p-disc-h",`${s.offsetHeight}px`),a.toggleAttribute("data-quiet",s.hasAttribute("data-disabled")),r&&a.offsetWidth,a.setAttribute("data-ready","")},[]);s.useLayoutEffect(()=>{G(!0)},[G,D,a,I,O,C,B]),s.useEffect(()=>{const e=M.current;if(!e||"undefined"==typeof ResizeObserver)return;const t=new ResizeObserver(()=>G(!1));return t.observe(e),()=>t.disconnect()},[G]);const J=s.useCallback(e=>{W||V(e),g?.(e)},[W,g]),K=s.useMemo(()=>({value:D??null,change:J,size:I,disabled:C}),[D,J,I,C]),Q=s.useRef(null);o(Q,"fixed"===k);const U=c("flex w-full justify-center px-4","static"===k?"":"pointer-events-none",P?x[I]:h[I],N[k],F);return i({render:R??e("nav",{}),ref:[E,Q],props:{"aria-label":A,className:U,style:{...n(L,u,"solid"),...q},children:e(v.Provider,{value:K,children:t("div",{ref:M,className:c("pointer-events-auto relative inline-flex items-center rounded-full",j[a],y[O][I],w[O][I],b),children:[null!=D?e("span",{ref:T,"aria-hidden":"true",className:z}):null,B]})}),...$}})});export const PlFloatingBottomNavigationItem=/* @__PURE__ */s.forwardRef(function PlFloatingBottomNavigationItem({value:r,icon:i,href:o,disabled:n=!1,className:u,children:h,onClick:x,...y},w){const N=s.useContext(v),j=n||N.disabled,z=null!==N.value&&N.value===r,k=c("relative z-10 inline-flex shrink-0 items-center justify-center rounded-full",l[N.size],d[N.size],"[-webkit-tap-highlight-color:transparent] [touch-action:manipulation]",b,p,j?"cursor-not-allowed opacity-50 saturate-[0.35] text-(--plass-muted-fg)":z?"cursor-pointer text-(--p-on-solid)":"cursor-pointer text-(--plass-muted-fg) hover:text-(--plass-fg) hover:bg-(--plass-glass-hover)",u),P=t(a,{children:[f(i)?e("span",{className:c("flex shrink-0 items-center justify-center",m[N.size]),children:i}):null,f(h)?e("span",{className:g,children:h}):null]}),C={"data-disc":"","data-current":z?"":void 0,"data-disabled":j?"":void 0},press=e=>{j?e.preventDefault():(N.change(r),x?.(e))};return o?e("a",{ref:w,href:j?void 0:o,"aria-current":z?"page":void 0,"aria-disabled":j||void 0,...C,className:k,onClick:press,...y,children:P}):e("button",{ref:w,type:"button",disabled:j,"aria-current":z?"page":void 0,...C,className:k,onClick:press,...y,children:P})});
|
|
@@ -12,7 +12,9 @@ export interface PlFooterProps extends Omit<React.ComponentPropsWithoutRef<'foot
|
|
|
12
12
|
* is: the thing at the end of the document, reached by scrolling to it.
|
|
13
13
|
* `sticky` and `fixed` are for the bar that has to stay in reach — a form's
|
|
14
14
|
* save row, a cookie notice — and a `PlPageLayout` reserves the height a
|
|
15
|
-
* `fixed` one takes out of the flow.
|
|
15
|
+
* `fixed` one takes out of the flow. A `fixed` one spans the window, so the
|
|
16
|
+
* layout ends the sidebars above it whatever `footerSpan` says, and a footer
|
|
17
|
+
* meant to sit between the sidebars is `sticky`.
|
|
16
18
|
* @default 'static'
|
|
17
19
|
*/
|
|
18
20
|
position?: PlassPosition;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as t,Fragment as i}from"react/jsx-runtime";import*as r from"react";import{useDefaults as l}from"../../internal/defaults.js";import{useLabels as o}from"../../internal/labels.js";import{isTurned as a,masonryRows as s,ratioOf as n,shownRatio as d}from"../../internal/gallery.js";import{responsiveSlots as m,withBaseline as p}from"../../internal/responsive.js";import{usePlBreakpointValue as u}from"../../hooks/usePlBreakpoint.js";import{cx as c,focusRingClasses as g,hasContent as f,metaTextClasses as h,radiusClasses as v,surfaceSlots as x,toLength as y,transitionClasses as b}from"../../internal/styles.js";import{PlImage as w}from"../image/PlImage.js";const j=/* @__PURE__ */r.lazy(()=>import("./PlGalleryViewer.js").then(e=>({default:e.PlGalleryViewer}))),_={xs:2,sm:3,lg:4},$={xs:"0.25rem",sm:"0.375rem",md:"0.5rem",lg:"0.75rem",xl:"1rem"},z={none:"",lift:"group-hover/tile:[box-shadow:var(--plass-shadow-2)] group-focus-visible/tile:[box-shadow:var(--plass-shadow-2)]",dim:"",zoom:""},N={none:"",lift:"",dim:"group-hover/tile:[&_img]:[filter:brightness(0.82)] group-focus-visible/tile:[&_img]:[filter:brightness(0.82)]",zoom:"group-hover/tile:[&_img]:[transform:scale(1.06)] group-focus-visible/tile:[&_img]:[transform:scale(1.06)]"};export const PlGallery=/* @__PURE__ */r.forwardRef(function PlGallery({items:R,layout:k="grid",columns:M,gap:q="md",ratio:P=1,rowHeight:S=220,rounded:C=!0,fit:G="cover",letterbox:I,loading:T="lazy",caption:B="none",hover:F="lift",preview:A=!1,onItemSelect:L,label:V,itemLabel:H,empty:W,size:D,color:E,className:J,classNames:K,style:O,...Q},U){const X=l(),Y=D??X.size??"md",Z=E??X.color??"primary",ee=o(),te=V??ee.gallery,ie=H??ee.galleryItem,re=r.useId(),[le,oe]=r.useState(null),ae=p(M??_,2),se=Math.max(1,u(ae)??2),ne="string"==typeof q&&q in $?$[q]:y(q)??$.md,de=C?v[Y]:"",me=n(P,1),tile=(r,l,o,s)=>{const m=f(r.title)||f(r.description),p="none"!==B&&m,u="overlay"===B||"hover"===B,v=`${re}-${l}-title`,x=`${re}-${l}-description`,y=p?[f(r.title)?v:null,f(r.description)?x:null].filter(Boolean).join(" "):void 0,j=e(w,{src:r.src,alt:r.alt,ratio:"grid"===k?P:"quilted"===k?"auto":a(r.rotate)?d(n(r.ratio,me),r.rotate):r.ratio??P,fit:G,letterbox:I,loading:T,rotate:r.rotate,flip:r.flip,position:r.position,placeholder:r.placeholder,rounded:!1,size:Y,color:Z,className:c("size-full",K?.image)}),_=p?t("div",{style:void 0===s||u?void 0:{gridRow:String(s)},className:c("min-w-0",u?c("pointer-events-none absolute inset-x-0 bottom-0 flex flex-col gap-0.5 p-2.5 text-white","[background:linear-gradient(to_top,color-mix(in_oklab,#000_72%,transparent),transparent)]","hover"===B?c("opacity-0 group-hover/tile:opacity-100 group-focus-visible/tile:opacity-100","[transition:opacity_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]"):""):"flex flex-col gap-0.5 pt-1.5",K?.caption),children:[f(r.title)?e("span",{id:v,className:c("truncate font-medium",h[Y],u?"":"text-(--plass-fg)",K?.title),children:r.title}):null,f(r.description)?e("span",{id:x,className:c("truncate",h[Y],u?"text-white/80":"text-(--plass-muted-fg)",K?.description),children:r.description}):null]}):null,$=t("span",{style:void 0===s?void 0:{gridRow:`1 / span ${"below"===B?s-1:s}`},className:c("relative block overflow-hidden",de,"quilted"===k||"justified"===k?"size-full":"","[transition:box-shadow_var(--plass-duration)_var(--plass-ease)]",z[F],N[F],"[&_img]:[transition:opacity_var(--plass-duration)_var(--plass-ease),filter_var(--plass-duration)_var(--plass-ease),transform_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms] motion-reduce:[&_img]:[transition-duration:0ms]"),children:[j,u?_:null]}),M=u||!p?$:t(i,{children:[$,_]});return e("li",{className:c("group/tile relative m-0 min-w-0 list-none","justified"===k?"flex flex-col":void 0===s?"":"grid",K?.item),style:o,children:A||L?e("button",{type:"button","aria-label":`${r.alt} — ${ie(l+1,R.length)}`,"aria-describedby":y,className:c(void 0===s?"block":"grid","w-full bg-transparent p-0 text-start",A?"cursor-zoom-in":"cursor-pointer",g,b,de,"justified"===k?"flex-1":""),style:void 0===s?void 0:{gridRow:`1 / span ${s}`,gridTemplateRows:"subgrid"},onClick:()=>(e=>{L?.(R[e],e),A&&oe(e)})(l),children:M}):M},r.id??r.src)};let pe,ue;if("masonry"===k){const e=R.map(e=>d(n(e.ratio,me),e.rotate)),{tracks:t,tiles:i}=s(e,se,"below"===B);ue=t.map(e=>"caption"===e?"auto":"gap"===e?ne:`${Number((100*e).toFixed(2))}fr`).join(" "),pe=R.map((e,t)=>{const{column:r,start:l,end:o}=i[t];return tile(e,t,{gridColumn:String(r),gridRow:`${l} / ${o}`,gridTemplateRows:"subgrid"},o-l)})}else pe="justified"===k?R.map((e,t)=>{const i=d(n(e.ratio,me),e.rotate);return tile(e,t,{flexGrow:i,flexBasis:i*S+"px",maxWidth:"100%"})}):R.map((e,t)=>tile(e,t,"quilted"===k?{gridColumn:`span ${Math.max(1,Math.round(e.cols??1))}`,gridRow:`span ${Math.max(1,Math.round(e.rows??1))}`}:{}));return 0===R.length&&f(W)?e(i,{children:W}):t(i,{children:[e("ul",{ref:U,role:"list","aria-label":te,className:c("plass-gallery m-0 list-none p-0","justified"===k?"plass-gallery-justified flex flex-wrap":"","masonry"===k?"grid":"","grid"===k?"plass-gallery-grid grid":"","quilted"===k?"plass-gallery-quilted grid":"",J),style:{gap:"masonry"===k?`0 ${ne}`:ne,...x(Z,0),...m("cols",ae,e=>String(Math.max(1,Math.round(e)))),..."masonry"===k?{gridTemplateColumns:`repeat(${se}, minmax(0, 1fr))`,gridTemplateRows:ue}:null,..."quilted"===k?{gridAutoRows:`${S}px`,gridAutoFlow:"dense"}:null,...O},...Q,children:pe}),A?e(r.Suspense,{fallback:null,children:e(j,{items:R,index:le,onIndexChange:oe,size:Y,color:Z,label:te,itemLabel:ie})}):null]})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as t,jsxs as a,Fragment as e}from"react/jsx-runtime";import*as s from"react";import{ChartSurface as l,useMeasuredWidth as
|
|
1
|
+
"use client";import{jsx as t,jsxs as a,Fragment as e}from"react/jsx-runtime";import*as s from"react";import{ChartSurface as l,useMeasuredWidth as n}from"../../internal/chart-frame.js";import{arcPath as r,chartFontSizes as i,compactNumber as o,plotHeights as m,ringPath as h,textWidth as d,truncate as c}from"../../internal/chart.js";import{useDefaults as u}from"../../internal/defaults.js";import{numberFormatter as f}from"../../internal/format.js";import{useLabels as p}from"../../internal/labels.js";import{cx as x,hasContent as M,metaTextClasses as v}from"../../internal/styles.js";import{bandColor as g}from"../../internal/threshold.js";function pointAt(t,a,e,s){const l=(s-90)*Math.PI/180;return[t+e*Math.cos(l),a+e*Math.sin(l)]}export function PlGaugeChart({value:y,min:b=0,max:k=100,sweep:j=180,thickness:N=.22,thresholds:$,ticks:w=!1,showRange:A=!0,center:z,caption:I,height:_,format:P,locale:S,label:W,empty:q,size:C,variant:D="ghost",color:L,padded:R=!1,className:B,...F}){const G=u(),T=C??G.size??"md",Y=L??G.color??"primary",E=S??G.locale,H=s.useRef(null),J=n(H),K=p(),O=s.useId(),Q=s.useId(),U=s.useId(),V=s.useCallback(t=>P?f(E,P).format(t):o(t,E),[P,E]),X=Math.max(1,Math.min(360,j)),Z=X/2,tt=-Z,at=Z,et=k-b,st=null===y||Number.isNaN(y)||0===et?null:Math.min(1,Math.max(0,(y-b)/et)),lt=null===y?Y:g(y,Y,$),nt="number"==typeof _?_:m[T],rt=i[T],it=Math.min(.9,Math.max(.05,N)),ot=Z*Math.PI/180,mt=X>=360?1:Math.max(0,-Math.cos(ot)),ht=X>=180?1:Math.sin(ot),dt=Math.sin(ot),ct=-Math.cos(ot),ut=A&&X<330?[b,k].map(t=>c(V(t),Math.max(0,.28*J),rt)):[],ft=ut.reduce((t,a)=>Math.max(t,d(a,rt)),0),pt=.35*rt,xt=!1===w?0:.85*rt,Mt=ct<=.25,vt=Mt?0:.5*rt,gt=Mt?rt:rt*(.35+.55*ct),yt=ut.length>0?ct*vt+gt+.25*rt:0,bt=Math.max(pt,xt),kt=Math.max(pt,xt),jt=Math.max(pt,xt,yt),Nt=[(J/2-bt)/Math.max(.05,ht),(nt-kt-jt)/(1+mt)];if(ft>0&&dt>.05){const t=Mt?ft/2:ft;Nt.push(Math.max(0,J/2-pt-t)/dt-vt)}const $t=Math.max(0,Math.min(...Nt)),wt=$t*(1-it),At=J/2,zt=kt+$t*(1+mt)+jt,It=kt+$t+Math.max(0,(nt-zt)/2),_t=0===et,Pt=M(I)?1.85*rt:0,St=It-wt*(1-Math.min(1,mt))/2,Wt=Math.min(wt,Math.abs(It-St)),qt=Math.min(wt,Math.abs(It-St-Pt/2)),Ct=2*Math.sqrt(Math.max(0,wt*wt-qt*qt)),Dt=z??(null===y?"—":V(y)),Lt="string"==typeof Dt?d(Dt,1):0,Rt=Lt>0?Math.max(rt,Math.min(2*rt,function fitType(t,a,e,s,l){const n=t*t/(4*l*l)+s*s,r=2*a*s,i=a*a-e*e;return n<=0||i>=0?0:(Math.sqrt(r*r-4*n*i)-r)/(2*n)}(Lt,Wt,wt,.42,.86))):2*rt,Bt=!1===w?0:Math.max(2,Math.floor(w)),Ft=!_t&&J>0&&$t>0,Gt=[_t?O:null,Ft&&M(z)?Q:null,Ft&&I?U:null].filter(t=>null!==t);return t(l,{...F,variant:D,color:Y,size:T,padded:R,legendSide:"bottom",className:B,legend:null,table:null,children:t("div",{ref:H,className:"relative w-full",style:{height:nt},role:void 0===W?void 0:"img","aria-label":void 0===W?void 0:null===y||_t?W:`${W}: ${V(y)} / ${V(k)}`,"aria-describedby":void 0===W||0===Gt.length?void 0:Gt.join(" "),children:_t?t("div",{id:O,className:x("flex h-full items-center justify-center text-(--plass-muted-fg)",v[T]),children:q??K.empty}):J>0&&$t>0?a(e,{children:[a("svg",{width:J,height:nt,viewBox:`0 0 ${J} ${nt}`,"aria-hidden":"true",className:"block",children:[t("path",{d:r(At,It,$t,wt,tt,at),fill:`var(--plass-${Y}-soft)`}),null!==st?t("path",{d:h(At,It,($t+wt)/2,tt,at),fill:"none",stroke:`var(--plass-${lt}-fill)`,strokeWidth:$t-wt,pathLength:"1",strokeDasharray:"1",strokeDashoffset:1-st,className:x("[transition:stroke-dashoffset_var(--plass-duration-slow)_var(--plass-ease),stroke_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]")}):null,Bt>0?Array.from({length:Bt},(a,e)=>{const s=tt+X*e/(Bt-1),[l,n]=pointAt(At,It,$t+.25*rt,s),[r,i]=pointAt(At,It,$t+.6*rt,s);return t("line",{x1:l,y1:n,x2:r,y2:i,stroke:"var(--plass-chart-grid)",strokeWidth:1,strokeLinecap:"round"},e)}):null,ut.length>0?[[ut[0],tt,"start"],[ut[1],at,"end"]].map(([a,e,s])=>{const[l,n]=pointAt(At,It,$t+vt,e);return t("text",{x:l,y:n+gt,textAnchor:Mt?"middle":"start"===s?"end":"start",fontSize:rt,fill:"var(--plass-muted-fg)",children:a},s)}):null]}),a("div",{className:"pointer-events-none absolute inset-x-0 mx-auto flex flex-col items-center gap-0.5 text-center",style:{top:St+Pt/2,maxWidth:Ct,transform:"translateY(-50%)"},children:[t("span",{id:M(z)?Q:void 0,className:"font-semibold text-(--plass-fg) tabular-nums",style:{fontSize:Rt},children:Dt}),I?t("span",{id:U,className:x("text-(--plass-muted-fg)",v[T]),children:I}):null]})]}):null})})}
|
|
@@ -37,8 +37,10 @@ export interface PlHeaderProps extends Omit<React.ComponentPropsWithoutRef<'head
|
|
|
37
37
|
*
|
|
38
38
|
* `sticky` — the default — holds it against the top of the window once the
|
|
39
39
|
* page has scrolled to it, while leaving it in the flow so nothing has to be
|
|
40
|
-
* padded out of its way. `fixed` takes it out of the flow entirely
|
|
41
|
-
* `PlPageLayout` answers by reserving its height
|
|
40
|
+
* padded out of its way. `fixed` takes it out of the flow entirely and
|
|
41
|
+
* spans the window, which a `PlPageLayout` answers by reserving its height
|
|
42
|
+
* and starting the sidebars below it whatever `headerSpan` says, so a header
|
|
43
|
+
* meant to sit between the sidebars is `sticky`. `static` lets it scroll
|
|
42
44
|
* away.
|
|
43
45
|
* @default 'sticky'
|
|
44
46
|
*/
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as r from"react";import{useDefaults as
|
|
1
|
+
"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import*as r from"react";import{useDefaults as t}from"../../internal/defaults.js";import{useRender as i}from"@base-ui/react/use-render";import{PlPageLayoutContext as n}from"../../internal/page-layout.js";import{measureSlots as a}from"../../internal/responsive.js";import{cx as l,hasContent as m,sheetPaddingXClasses as d,sheetRestClasses as c,sheetSectionGapClasses as o,surfaceSlots as f,transitionClasses as p}from"../../internal/styles.js";const u={xs:"min-h-10",sm:"min-h-12",md:"min-h-16",lg:"min-h-20",xl:"min-h-24"},x={xs:"py-2",sm:"py-2",md:"py-3",lg:"py-4",xl:"py-5"},y={xs:"gap-3",sm:"gap-4",md:"gap-6",lg:"gap-7",xl:"gap-8"},h=c,v={static:"",sticky:"sticky top-0 z-20",fixed:"fixed inset-x-0 top-0 z-30"},g={start:"shrink-0",center:"flex-1 basis-0",end:"shrink-0"},j={start:"ms-auto shrink-0",center:"flex-1 basis-0",end:"ms-auto shrink-0"},b={start:"flex min-w-0 flex-1 items-center justify-start",center:"flex min-w-0 shrink items-center justify-center",end:"flex min-w-0 flex-1 items-center justify-end"};export const PlHeader=/* @__PURE__ */r.forwardRef(function PlHeader({brand:c,actions:k,align:w="start",position:N="sticky",variant:z="glass",size:C,color:H,density:P,elevation:R=0,divider:W=!0,maxWidth:q,padded:A=!0,label:B,render:D,className:E,style:F,children:G,...I},J){const K=a(q),L=t(),M=C??L.size??"md",O=H??L.color??"primary",Q=P??L.density??"default",{register:S}=r.useContext(n),T=r.useCallback(e=>{S("header",e),"function"==typeof J?J(e):J&&(J.current=e)},[S,J]),U=l("w-full min-w-0",h[z],W?"border-b [border-color:var(--plass-divider)]":"",v[N],p,E);return i({render:D??e("header",{}),ref:T,props:{"aria-label":B,className:U,style:{...f(O,R),...F},children:s("div",{style:K.style,className:l("flex w-full items-center",u[M],x[M],y[M],A?d[Q][M]:"",K.className,void 0===q?"":"mx-auto"),children:[m(c)?e("div",{className:l("flex min-w-0 items-center",g[w],o[M]),children:c}):"center"===w?e("div",{"aria-hidden":"true",className:g[w]}):null,m(G)?e("div",{className:l(b[w],o[M]),children:G}):null,m(k)?e("div",{className:l("flex min-w-0 items-center justify-end",j[w],o[M]),children:k}):"center"===w?e("div",{"aria-hidden":"true",className:g[w]}):null]}),...I}})});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{ChartScaleLegend as n,ChartStatus as i,ChartSurface as r,ChartTooltipPanel as a,markTransitionClasses as o,useMeasuredWidth as d}from"../../internal/chart-frame.js";import{categoryAt as h,chartFontSizes as s,compactNumber as c,formatCategory as m,markGap as u,plotHeights as x,rampFill as f,rampInk as p,rampStep as g,rampSteps as w,squarify as v,textWidth as y,tickStride as b,toValues as M,truncate as
|
|
1
|
+
"use client";import{jsx as e,jsxs as l}from"react/jsx-runtime";import*as t from"react";import{ChartScaleLegend as n,ChartStatus as i,ChartSurface as r,ChartTooltipPanel as a,markTransitionClasses as o,useMeasuredWidth as d}from"../../internal/chart-frame.js";import{categoryAt as h,chartFontSizes as s,compactNumber as c,formatCategory as m,markGap as u,plotHeights as x,rampFill as f,rampInk as p,rampStep as g,rampSteps as w,squarify as v,textWidth as y,tickStride as b,toValues as M,truncate as $}from"../../internal/chart.js";import{numberFormatter as k}from"../../internal/format.js";import{cx as A,metaTextClasses as N,srOnlyClasses as j}from"../../internal/styles.js";import{useLabels as z}from"../../internal/labels.js";import{useDefaults as E}from"../../internal/defaults.js";export function PlHeatmapChart({series:I,categories:S,shape:C="grid",scale:D="sequential",midpoint:B=0,min:P,max:L,valueLabels:R="none",height:U,format:_,locale:q,label:F,legend:H,tooltip:K,empty:W,size:G,variant:J="ghost",padded:O=!1,className:Q,...T}){const V=E(),X=G??V.size??"md",Y=q??V.locale,Z=t.useRef(null),ee=d(Z),le=z(),te=t.useId(),ne=t.useId(),ie=t.useId(),[re,ae]=t.useState(null),oe=t.useCallback(e=>_?k(Y,_).format(e):c(e,Y),[_,Y]),de=t.useMemo(()=>M(I),[I]),he=de.reduce((e,l)=>Math.max(e,l.length),0),se=t.useMemo(()=>Array.from({length:he},(e,l)=>h(l,S,de)),[he,S,de]),ce=t.useMemo(()=>I.map((e,l)=>e.name??`${l+1}`),[I]),me=t.useMemo(()=>de.map((e,l)=>{const t=e.map(e=>e.value).filter(e=>null!==e);return{name:ce[l],low:0===t.length?null:Math.min(...t),high:0===t.length?null:Math.max(...t)}}),[de,ce]),ue=t.useMemo(()=>{let e=1/0,l=-1/0,t=!1;for(const n of de)for(const i of n)null!==i.value&&(t=!0,e=Math.min(e,i.value),l=Math.max(l,i.value));return t?{min:e,max:l}:null},[de]),xe=P??ue?.min??0,fe=L??ue?.max??1,pe=t.useCallback(e=>g(e,xe,fe,D,B),[xe,fe,D,B]),ge="number"==typeof U?U:x[X]??220,we=s[X],ve=!0===H||void 0===H||!1===H?{}:H,ye=!1!==H,be=ve.side??"bottom",Me=!1===K?{mode:"none"}:!0===K||void 0===K?{}:K,$e="none"===Me.mode,ke=null===ue||0===he||0===I.length,Ae=t.useMemo(()=>{if("treemap"===C||ee<=0)return{texts:[],band:0};const e=Math.min(150,.25*ee),l=ce.map(l=>$(l,e,we));return{texts:l,band:l.reduce((e,l)=>Math.max(e,y(l,we)),0)+10}},[C,ce,ee,we]),Ne="treemap"===C?0:we+8,je={left:Ae.band,width:Math.max(0,ee-Ae.band),height:Math.max(0,ge-Ne)},ze=t.useMemo(()=>{if("treemap"===C)return{texts:[],widest:0};const e=se.map(e=>m(e,Y));return{texts:e,widest:e.reduce((e,l)=>Math.max(e,y(l,we)),0)}},[C,se,Y,we]),Ee=b(he,je.width,ze.widest+8),Ie=t.useMemo(()=>{if(je.width<=0||je.height<=0)return[];if("treemap"===C){const e=[];return de.forEach((l,t)=>l.forEach((l,n)=>{null!==l.value&&e.push({row:t,index:n,cell:l})})),v(e.map(e=>Math.max(0,e.cell.value??0)),je.width,je.height).map(l=>({row:e[l.index].row,index:e[l.index].index,cell:e[l.index].cell,x:je.left+l.x,y:l.y,width:l.width,height:l.height}))}const e=je.height/Math.max(1,I.length),l=je.width/Math.max(1,he),t=[];return de.forEach((n,i)=>n.forEach((n,r)=>{null!==n.value&&t.push({row:i,index:r,cell:n,x:je.left+r*l,y:i*e,width:l,height:e})})),t},[C,de,I.length,he,je.left,je.width,je.height]),Se=t.useCallback((e,l)=>m(e.x??S?.[l]??se[l]??l,Y),[S,se,Y]),Ce=t.useCallback(e=>Se(e.cell,e.index),[Se]),De=null===re?null:Ie.find(e=>e.row===re.row&&e.index===re.index)??null;null!==re&&null===De&&ae(null);const Be=null===De?[]:[{seriesIndex:De.row,color:De.cell.color??f(pe(De.cell.value??0),D),value:De.cell.value,formatted:oe(De.cell.value??0),label:De.cell.label}],Pe=Array.from({length:w},(e,l)=>f(l,D));return l(r,{...T,size:X,variant:J,padded:O,className:Q,legendSide:be,legend:ye&&!ke?e(n,{steps:Pe,from:oe("diverging"===D?-reach(xe,fe,B)+B:xe),to:oe("diverging"===D?reach(xe,fe,B)+B:fe),middle:"diverging"===D?oe(B):void 0,align:ve.align??"center",vertical:"left"===be||"right"===be,size:X}):null,table:ke?null:l("table","treemap"===C?{id:te,className:j,children:[F?e("caption",{children:F}):null,de.map((t,n)=>l("tbody",{children:[e("tr",{children:e("th",{scope:"rowgroup",colSpan:2,children:ce[n]})}),t.map((t,n)=>null===t.value?null:l("tr",{children:[e("th",{scope:"row",children:Se(t,n)}),e("td",{children:void 0!==t.label?t.label:oe(t.value)})]},n))]},n))]}:{id:te,className:j,children:[F?e("caption",{children:F}):null,e("thead",{children:l("tr",{children:[e("th",{scope:"col"}),se.map((l,t)=>e("th",{scope:"col",children:m(l,Y)},t))]})}),e("tbody",{children:de.map((t,n)=>l("tr",{children:[e("th",{scope:"row",children:ce[n]}),se.map((l,n)=>{const i=t[n];return e("td",{children:void 0!==i?.label?i.label:null==i?.value?"":oe(i.value)},n)})]},n))})]}),children:[l("div",{ref:Z,role:"img",tabIndex:ke?void 0:0,"aria-label":F??le.chart,"aria-describedby":ke?ie:ne,onPointerLeave:()=>ae(null),onBlur:()=>ae(null),onKeyDown:e=>{if($e||0===Ie.length)return;const l=null===re?-1:Ie.findIndex(e=>e.row===re.row&&e.index===re.index);if("grid"!==C||-1===l||"ArrowDown"!==e.key&&"ArrowUp"!==e.key)if("ArrowRight"===e.key||"ArrowDown"===e.key){const e=Ie[Math.min(Ie.length-1,l+1)];ae({row:e.row,index:e.index})}else if("ArrowLeft"===e.key||"ArrowUp"===e.key){const e=Ie[Math.max(0,(-1===l?Ie.length:l)-1)];ae({row:e.row,index:e.index})}else{if("Escape"!==e.key||null===re)return;ae(null),e.stopPropagation()}else{const t="ArrowDown"===e.key?1:-1;let n=l+t;for(;n>=0&&n<Ie.length&&Ie[n].index!==Ie[l].index;)n+=t;n>=0&&n<Ie.length&&ae({row:Ie[n].row,index:Ie[n].index})}e.preventDefault()},className:A("relative w-full rounded-(--plass-radius-xs)","focus-visible:[outline:2px_solid_var(--p-ring)] focus-visible:outline-offset-2"),style:{height:ge},children:[ke?e("div",{id:ie,className:A("flex h-full items-center justify-center text-(--plass-muted-fg)",N[X]),children:W??le.empty}):ee>0?l("svg",{width:ee,height:ge,viewBox:`0 0 ${ee} ${ge}`,"aria-hidden":"true",className:"block",children:[Ie.map(t=>{const n=pe(t.cell.value??0),i=re?.row===t.row&&re?.index===t.index,r=Math.max(0,t.width-u),a=Math.max(0,t.height-u);if(r<=0||a<=0)return null;const d=oe(t.cell.value??0),h="treemap"===C?"all"===R?[Ce(t),d]:[Ce(t)]:"all"===R?[d]:[],s=h.filter(e=>function fits(e,l,t,n){return t>=1.8*n&&l>=Math.min(y(e,n),2.5*n)+8}(e,r,a/h.length,we)),c=t.cell.color?"var(--plass-surface)":p(n,D);return l("g",{children:[e("rect",{x:t.x+u/2,y:t.y+u/2,width:r,height:a,rx:Math.min(3,r/2,a/2),fill:t.cell.color??f(n,D),opacity:i?1:.94,onPointerEnter:$e?void 0:()=>ae({row:t.row,index:t.index}),className:o}),s.map((l,n)=>e("text",{x:t.x+t.width/2,y:t.y+t.height/2+(n-(s.length-1)/2)*(we+2),textAnchor:"middle",dominantBaseline:"central",fontSize:we,fontWeight:0===n?500:400,fill:c,opacity:0===n?1:.85,pointerEvents:"none",className:0===n&&"treemap"===C?void 0:"tabular-nums",children:$(l,t.width-8,we)},n))]},`${t.row}-${t.index}`)}),"grid"===C?Ae.texts.map((l,t)=>e("text",{x:je.left-8,y:(t+.5)*je.height/Math.max(1,I.length),textAnchor:"end",dominantBaseline:"central",fontSize:we,fill:"var(--plass-muted-fg)",children:l},`row-${t}`)):null,"grid"===C?ze.texts.map((l,t)=>{const n=je.width/Math.max(1,he);return t%Ee!==0?null:e("text",{x:je.left+(t+.5)*n,y:je.height+we,textAnchor:"middle",fontSize:we,fill:"var(--plass-muted-fg)",children:l},`col-${t}`)}):null]}):null,De&&!$e?Me.render?e("div",{className:"pointer-events-none absolute z-10",style:{left:De.x+De.width/2,top:De.y},children:Me.render({index:De.index,category:De.cell.x??se[De.index]??De.index,items:Be})}):e(a,{heading:`${ce[De.row]} · ${Ce(De)}`,items:Be,x:De.x+De.width/2,y:De.y,flip:De.x+De.width/2>.6*ee,size:X}):null]}),ke?null:e("span",{id:ne,className:j,children:me.map((e,n)=>l(t.Fragment,{children:[n>0?", ":null,null===e.low?e.name:e.low===e.high?`${e.name} ${oe(e.low)}`:`${e.name} ${oe(e.low)}–${oe(e.high)}`]},n))}),$e?null:e(i,{heading:De?`${ce[De.row]} · ${Ce(De)}`:void 0,items:Be})]})}function reach(e,l,t){return Math.max(Math.abs(l-t),Math.abs(t-e))}
|
|
@@ -7,9 +7,16 @@ export interface PlHighlightProps extends Omit<React.ComponentPropsWithoutRef<'s
|
|
|
7
7
|
*
|
|
8
8
|
* A string is one term, an array is several — the longest is tried first, so
|
|
9
9
|
* `['data', 'database']` marks the whole word rather than the first four
|
|
10
|
-
* letters of it.
|
|
11
|
-
*
|
|
12
|
-
*
|
|
10
|
+
* letters of it. Every term in an array is taken as literal text, so a search
|
|
11
|
+
* box can be wired straight to it and a reader typing `1 + 1` looks for
|
|
12
|
+
* `1 + 1`. A pattern goes in on its own: `/error|\d+/` is what an array of
|
|
13
|
+
* expressions would have been, written the way a regular expression is read.
|
|
14
|
+
*
|
|
15
|
+
* A `RegExp` is used as written, with the global flag forced on, and
|
|
16
|
+
* `caseSensitive` is ignored for one because the expression carries its own
|
|
17
|
+
* flags. `wholeWord` still applies — it is tested against the text around
|
|
18
|
+
* each match rather than built into the expression, so it holds however the
|
|
19
|
+
* match was found.
|
|
13
20
|
*/
|
|
14
21
|
query: string | string[] | RegExp;
|
|
15
22
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{PreviewCard as l}from"@base-ui/react/preview-card";import{useDefaults as a}from"../../internal/defaults.js";import{PopupArrow as
|
|
1
|
+
"use client";import{jsx as e,jsxs as s}from"react/jsx-runtime";import{PreviewCard as l}from"@base-ui/react/preview-card";import{useDefaults as a}from"../../internal/defaults.js";import{PopupArrow as i}from"../../internal/picker.js";import{cx as r,glassClasses as n,hasContent as t,metaTextClasses as o,radiusClasses as d,sheetBodyClasses as m,sheetHeaderGapClasses as c,sheetPaddingXClasses as p,sheetPaddingYClasses as f,sheetSectionGapClasses as u,sheetTitleClasses as g,surfaceSlots as x}from"../../internal/styles.js";const y={xs:"max-w-64",sm:"max-w-72",md:"max-w-sm",lg:"max-w-md",xl:"max-w-lg"},h=/* @__PURE__ */[n,"relative flex flex-col","border text-(--plass-fg) bg-(--plass-glass-press)","[border-color:var(--plass-glass-line)]","[box-shadow:var(--plass-shadow-3),var(--plass-gloss-glass)]","[outline:none]","[transition:opacity_var(--plass-duration)_var(--plass-ease)]","motion-reduce:[transition-duration:0ms]","data-[starting-style]:opacity-0 data-[ending-style]:opacity-0"].join(" "),v={xs:8,sm:9,md:10,lg:11,xl:12};export function PlHoverCard({size:n,color:w,density:b,trigger:O,title:j,description:N,children:z,side:P="bottom",align:C="center",sideOffset:D=8,alignOffset:_=0,delay:k=600,closeDelay:A=300,arrow:H=!1,open:R,defaultOpen:T,onOpenChange:W,width:$,className:q,style:B,...E}){const F=a(),G=n??F.size??"md",I=w??F.color??"primary",J=b??F.density??"default",K=v[G],L=t(j)||t(N);return s(l.Root,{open:R,defaultOpen:T,onOpenChange:e=>W?.(e),children:[e(l.Trigger,{delay:k,closeDelay:A,render:O}),e(l.Portal,{children:e(l.Positioner,{className:"plass-portal z-(--plass-z-portal) [outline:none]",side:P,align:C,sideOffset:D,alignOffset:_,children:s(l.Popup,{className:r(h,d[G],m[G],u[G],p[J][G],f[J][G],void 0===$?y[G]:"",q),style:{...x(I,3),...void 0===$?null:{maxWidth:"number"==typeof $?`${$}px`:$},...B},...E,children:[H?e(i,{as:l.Arrow,size:K}):null,L?s("div",{className:r("flex min-w-0 flex-col",c[G]),children:[t(j)?e("div",{className:r("m-0 font-semibold",g[G]),children:j}):null,t(N)?e("div",{className:r("m-0 text-(--plass-muted-fg)",o[G]),children:N}):null]}):null,t(z)?e("div",{className:"min-w-0",children:z}):null]})})})]})}
|