@aiquants/daily-report 0.3.2 → 0.4.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.
Files changed (11) hide show
  1. package/README.md +24 -1
  2. package/dist/client.js +4 -4
  3. package/dist/client.js.map +1 -1
  4. package/dist/client.mjs +4 -4
  5. package/dist/client.mjs.map +1 -1
  6. package/dist/styles/daily-report.standalone.css +3 -0
  7. package/package.json +17 -9
  8. package/src/client/components/daily-report-comment-item.tsx +4 -1
  9. package/src/client/components/daily-report-detail-list.tsx +6 -5
  10. package/src/client/components/daily-report-list.tsx +16 -11
  11. package/src/styles/standalone.entry.css +51 -0
package/dist/styles/daily-report.standalone.css ADDED
@@ -0,0 +1,3 @@
1
+ /*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
2
+ /*! @aiquants/daily-report standalone CSS — 非 Tailwind ホスト専用。ホストの Tailwind ビルドと混在させないこと */
3
+ @layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-pan-x:initial;--tw-pan-y:initial;--tw-pinch-zoom:initial;--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-outline-style:solid;--tw-duration:initial;--tw-ease:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0}}}@layer theme{:root,:host{--color-red-50:oklch(97.1% .013 17.38);--color-red-200:oklch(88.5% .062 18.334);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-red-900:oklch(39.6% .141 25.723);--color-orange-500:oklch(70.5% .213 47.604);--color-amber-100:oklch(96.2% .059 95.617);--color-amber-500:oklch(76.9% .188 70.08);--color-amber-700:oklch(55.5% .163 48.998);--color-yellow-400:oklch(85.2% .199 91.936);--color-yellow-600:oklch(68.1% .162 75.834);--color-green-600:oklch(62.7% .194 149.214);--color-blue-50:oklch(97% .014 254.604);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-300:oklch(80.9% .105 251.813);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-slate-50:oklch(98.4% .003 247.858);--color-slate-100:oklch(96.8% .007 247.896);--color-slate-200:oklch(92.9% .013 255.508);--color-slate-300:oklch(86.9% .022 252.894);--color-slate-400:oklch(70.4% .04 256.788);--color-slate-500:oklch(55.4% .046 257.417);--color-slate-600:oklch(44.6% .043 257.281);--color-slate-700:oklch(37.2% .044 257.287);--color-slate-800:oklch(27.9% .041 260.031);--color-slate-900:oklch(20.8% .042 265.755);--color-gray-700:oklch(37.3% .034 259.733);--color-white:#fff;--spacing:.25rem;--container-6xl:72rem;--text-xs:.75rem;--text-xs--line-height:calc(1 / .75);--text-sm:.875rem;--text-sm--line-height:calc(1.25 / .875);--text-base:1rem;--text-base--line-height:calc(1.5 / 1);--text-lg:1.125rem;--text-lg--line-height:calc(1.75 / 1.125);--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-wide:.025em;--leading-relaxed:1.625;--radius-sm:calc(var(--radius,.5rem) - 4px);--radius-md:calc(var(--radius,.5rem) - 2px);--radius-lg:var(--radius,.5rem);--radius-xl:.75rem;--radius-2xl:1rem;--ease-out:cubic-bezier(0, 0, .2, 1);--animate-pulse:pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4, 0, .2, 1);--color-input:hsl(var(--input));--color-ring:hsl(var(--ring));--color-background:hsl(var(--background));--color-foreground:hsl(var(--foreground));--color-primary:hsl(var(--primary));--color-primary-foreground:hsl(var(--primary-foreground));--color-secondary:hsl(var(--secondary));--color-secondary-foreground:hsl(var(--secondary-foreground));--color-destructive:hsl(var(--destructive));--color-destructive-foreground:hsl(var(--destructive-foreground));--color-muted:hsl(var(--muted));--color-muted-foreground:hsl(var(--muted-foreground));--color-accent:hsl(var(--accent));--color-accent-foreground:hsl(var(--accent-foreground))}}@layer base,components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.invisible{visibility:hidden}.visible{visibility:visible}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing) * 0)}.top-0{top:calc(var(--spacing) * 0)}.top-full{top:100%}.right-0{right:calc(var(--spacing) * 0)}.right-2{right:calc(var(--spacing) * 2)}.z-0{z-index:0}.z-10{z-index:10}.z-20{z-index:20}.z-50{z-index:50}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.mx-auto{margin-inline:auto}.mt-0{margin-top:calc(var(--spacing) * 0)}.mt-1{margin-top:calc(var(--spacing) * 1)}.mt-2{margin-top:calc(var(--spacing) * 2)}.mt-auto{margin-top:auto}.mb-1{margin-bottom:calc(var(--spacing) * 1)}.mb-2{margin-bottom:calc(var(--spacing) * 2)}.mb-3{margin-bottom:calc(var(--spacing) * 3)}.mb-4{margin-bottom:calc(var(--spacing) * 4)}.ml-auto{margin-left:auto}.line-clamp-1{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.inline-flex{display:inline-flex}.table{display:table}.h-3{height:calc(var(--spacing) * 3)}.h-3\.5{height:calc(var(--spacing) * 3.5)}.h-4{height:calc(var(--spacing) * 4)}.h-5{height:calc(var(--spacing) * 5)}.h-6{height:calc(var(--spacing) * 6)}.h-9{height:calc(var(--spacing) * 9)}.h-10{height:calc(var(--spacing) * 10)}.h-11{height:calc(var(--spacing) * 11)}.h-16{height:calc(var(--spacing) * 16)}.h-24{height:calc(var(--spacing) * 24)}.h-full{height:100%}.min-h-0{min-height:calc(var(--spacing) * 0)}.min-h-4{min-height:calc(var(--spacing) * 4)}.min-h-15{min-height:calc(var(--spacing) * 15)}.min-h-22{min-height:calc(var(--spacing) * 22)}.min-h-50{min-height:calc(var(--spacing) * 50)}.w-1\/2{width:50%}.w-1\/3{width:33.3333%}.w-3\.5{width:calc(var(--spacing) * 3.5)}.w-3\/4{width:75%}.w-4{width:calc(var(--spacing) * 4)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing) * 5)}.w-5\/6{width:83.3333%}.w-6{width:calc(var(--spacing) * 6)}.w-10{width:calc(var(--spacing) * 10)}.w-11{width:calc(var(--spacing) * 11)}.w-11\/12{width:91.6667%}.w-16{width:calc(var(--spacing) * 16)}.w-20{width:calc(var(--spacing) * 20)}.w-24{width:calc(var(--spacing) * 24)}.w-28{width:calc(var(--spacing) * 28)}.w-32{width:calc(var(--spacing) * 32)}.w-40{width:calc(var(--spacing) * 40)}.w-56{width:calc(var(--spacing) * 56)}.w-full{width:100%}.max-w-6xl{max-width:var(--container-6xl)}.max-w-full{max-width:100%}.min-w-0{min-width:calc(var(--spacing) * 0)}.min-w-24{min-width:calc(var(--spacing) * 24)}.flex-1{flex:1}.shrink-0{flex-shrink:0}.scale-75{--tw-scale-x:75%;--tw-scale-y:75%;--tw-scale-z:75%;scale:var(--tw-scale-x) var(--tw-scale-y)}.transform{transform:var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,)}.animate-pulse{animation:var(--animate-pulse)}.cursor-pointer{cursor:pointer}.touch-pan-x{--tw-pan-x:pan-x;touch-action:var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,)}.touch-pan-y{--tw-pan-y:pan-y;touch-action:var(--tw-pan-x,) var(--tw-pan-y,) var(--tw-pinch-zoom,)}.touch-manipulation{touch-action:manipulation}.touch-none{touch-action:none}.resize{resize:both}.scrollbar-none{scrollbar-width:none}.scrollbar-thin{scrollbar-width:thin}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.flex-wrap{flex-wrap:wrap}.items-baseline{align-items:baseline}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-1{gap:calc(var(--spacing) * 1)}.gap-1\.5{gap:calc(var(--spacing) * 1.5)}.gap-2{gap:calc(var(--spacing) * 2)}.gap-3{gap:calc(var(--spacing) * 3)}.gap-4{gap:calc(var(--spacing) * 4)}.gap-6{gap:calc(var(--spacing) * 6)}:where(.space-y-1>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 1) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 2) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 3) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-4>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-1>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing) * 1) * var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing) * 1) * calc(1 - var(--tw-space-x-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.overflow-y-hidden{overflow-y:hidden}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-l-4{border-left-style:var(--tw-border-style);border-left-width:4px}.border-dashed{--tw-border-style:dashed;border-style:dashed}.border-blue-200{border-color:var(--color-blue-200)}.border-blue-300{border-color:var(--color-blue-300)}.border-input{border-color:var(--color-input)}.border-red-200{border-color:var(--color-red-200)}.border-slate-100{border-color:var(--color-slate-100)}.border-slate-200{border-color:var(--color-slate-200)}.border-slate-300{border-color:var(--color-slate-300)}.border-transparent{border-color:#0000}.border-l-blue-500{border-left-color:var(--color-blue-500)}.bg-amber-100{background-color:var(--color-amber-100)}.bg-background{background-color:var(--color-background)}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-destructive{background-color:var(--color-destructive)}.bg-muted{background-color:var(--color-muted)}.bg-primary{background-color:var(--color-primary)}.bg-red-50{background-color:var(--color-red-50)}.bg-red-600{background-color:var(--color-red-600)}.bg-secondary{background-color:var(--color-secondary)}.bg-slate-50{background-color:var(--color-slate-50)}.bg-slate-100{background-color:var(--color-slate-100)}.bg-slate-200{background-color:var(--color-slate-200)}.bg-slate-900\/50{background-color:#0f172b80}@supports (color:color-mix(in lab, red, red)){.bg-slate-900\/50{background-color:color-mix(in oklab, var(--color-slate-900) 50%, transparent)}}.bg-transparent{background-color:#0000}.bg-white{background-color:var(--color-white)}.fill-yellow-400{fill:var(--color-yellow-400)}.p-0{padding:calc(var(--spacing) * 0)}.p-1{padding:calc(var(--spacing) * 1)}.p-2{padding:calc(var(--spacing) * 2)}.p-3{padding:calc(var(--spacing) * 3)}.p-4{padding:calc(var(--spacing) * 4)}.p-6{padding:calc(var(--spacing) * 6)}.px-2{padding-inline:calc(var(--spacing) * 2)}.px-3{padding-inline:calc(var(--spacing) * 3)}.px-4{padding-inline:calc(var(--spacing) * 4)}.px-8{padding-inline:calc(var(--spacing) * 8)}.py-1{padding-block:calc(var(--spacing) * 1)}.py-1\.5{padding-block:calc(var(--spacing) * 1.5)}.py-2{padding-block:calc(var(--spacing) * 2)}.py-8{padding-block:calc(var(--spacing) * 8)}.pt-3{padding-top:calc(var(--spacing) * 3)}.pt-4{padding-top:calc(var(--spacing) * 4)}.pr-20{padding-right:calc(var(--spacing) * 20)}.pb-3{padding-bottom:calc(var(--spacing) * 3)}.text-center{text-align:center}.text-left{text-align:left}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]{font-size:10px}.leading-1{--tw-leading:calc(var(--spacing) * 1);line-height:calc(var(--spacing) * 1)}.leading-none{--tw-leading:1;line-height:1}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-nowrap{text-wrap:nowrap}.wrap-break-word{overflow-wrap:break-word}.whitespace-nowrap{white-space:nowrap}.whitespace-pre-wrap{white-space:pre-wrap}.text-amber-500{color:var(--color-amber-500)}.text-amber-700{color:var(--color-amber-700)}.text-blue-500{color:var(--color-blue-500)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-destructive-foreground{color:var(--color-destructive-foreground)}.text-gray-700{color:var(--color-gray-700)}.text-green-600{color:var(--color-green-600)}.text-muted-foreground{color:var(--color-muted-foreground)}.text-orange-500{color:var(--color-orange-500)}.text-primary{color:var(--color-primary)}.text-primary-foreground{color:var(--color-primary-foreground)}.text-red-500{color:var(--color-red-500)}.text-red-600{color:var(--color-red-600)}.text-red-700{color:var(--color-red-700)}.text-secondary-foreground{color:var(--color-secondary-foreground)}.text-slate-300{color:var(--color-slate-300)}.text-slate-400{color:var(--color-slate-400)}.text-slate-500{color:var(--color-slate-500)}.text-slate-600{color:var(--color-slate-600)}.text-slate-700{color:var(--color-slate-700)}.text-slate-800{color:var(--color-slate-800)}.text-slate-900{color:var(--color-slate-900)}.text-white{color:var(--color-white)}.text-yellow-400{color:var(--color-yellow-400)}.text-yellow-600{color:var(--color-yellow-600)}.uppercase{text-transform:uppercase}.underline-offset-4{text-underline-offset:4px}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a), 0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-0{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.ring-2{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.shadow-slate-400\/30{--tw-shadow-color:#90a1b94d}@supports (color:color-mix(in lab, red, red)){.shadow-slate-400\/30{--tw-shadow-color:color-mix(in oklab, color-mix(in oklab, var(--color-slate-400) 30%, transparent) var(--tw-shadow-alpha), transparent)}}.ring-blue-200{--tw-ring-color:var(--color-blue-200)}.ring-offset-background{--tw-ring-offset-color:var(--color-background)}.outline{outline-style:var(--tw-outline-style);outline-width:1px}.transition-\[color\,box-shadow\]{transition-property:color,box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-\[visibility\]{transition-property:visibility;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-500{--tw-duration:.5s;transition-duration:.5s}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.animate-in{--tw-enter-opacity:initial;--tw-enter-scale:initial;--tw-enter-rotate:initial;--tw-enter-translate-x:initial;--tw-enter-translate-y:initial;animation-name:enter;animation-duration:.15s}.outline-none{--tw-outline-style:none;outline-style:none}.select-none{-webkit-user-select:none;user-select:none}.duration-200{animation-duration:.2s}.duration-500{animation-duration:.5s}.ease-out{animation-timing-function:cubic-bezier(0,0,.2,1)}.fade-in{--tw-enter-opacity:0}.running{animation-play-state:running}.zoom-in-95{--tw-enter-scale:.95}.group-data-\[disabled\=true\]\:pointer-events-none:is(:where(.group)[data-disabled=true] *){pointer-events:none}.group-data-\[disabled\=true\]\:opacity-50:is(:where(.group)[data-disabled=true] *){opacity:.5}.peer-disabled\:cursor-not-allowed:is(:where(.peer):disabled~*){cursor:not-allowed}.peer-disabled\:opacity-50:is(:where(.peer):disabled~*){opacity:.5}.selection\:bg-primary ::selection{background-color:var(--color-primary)}.selection\:bg-primary::selection{background-color:var(--color-primary)}.selection\:text-primary-foreground ::selection{color:var(--color-primary-foreground)}.selection\:text-primary-foreground::selection{color:var(--color-primary-foreground)}.file\:inline-flex::file-selector-button{display:inline-flex}.file\:h-7::file-selector-button{height:calc(var(--spacing) * 7)}.file\:border-0::file-selector-button{border-style:var(--tw-border-style);border-width:0}.file\:bg-transparent::file-selector-button{background-color:#0000}.file\:text-sm::file-selector-button{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.file\:font-medium::file-selector-button{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.file\:text-foreground::file-selector-button{color:var(--color-foreground)}.placeholder\:text-muted-foreground::placeholder{color:var(--color-muted-foreground)}@media (hover:hover){.hover\:z-10:hover{z-index:10}.hover\:-translate-y-0\.5:hover{--tw-translate-y:calc(var(--spacing) * -.5);translate:var(--tw-translate-x) var(--tw-translate-y)}.hover\:border-blue-300:hover{border-color:var(--color-blue-300)}.hover\:bg-accent:hover{background-color:var(--color-accent)}.hover\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\:bg-destructive\/90:hover{background-color:color-mix(in srgb, hsl(var(--destructive)) 90%, transparent)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-destructive\/90:hover{background-color:color-mix(in oklab, var(--color-destructive) 90%, transparent)}}.hover\:bg-primary\/90:hover{background-color:color-mix(in srgb, hsl(var(--primary)) 90%, transparent)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-primary\/90:hover{background-color:color-mix(in oklab, var(--color-primary) 90%, transparent)}}.hover\:bg-red-700:hover{background-color:var(--color-red-700)}.hover\:bg-secondary\/80:hover{background-color:color-mix(in srgb, hsl(var(--secondary)) 80%, transparent)}@supports (color:color-mix(in lab, red, red)){.hover\:bg-secondary\/80:hover{background-color:color-mix(in oklab, var(--color-secondary) 80%, transparent)}}.hover\:bg-slate-100:hover{background-color:var(--color-slate-100)}.hover\:bg-slate-200:hover{background-color:var(--color-slate-200)}.hover\:text-accent-foreground:hover{color:var(--color-accent-foreground)}.hover\:text-blue-500:hover{color:var(--color-blue-500)}.hover\:text-blue-600:hover{color:var(--color-blue-600)}.hover\:text-red-500:hover{color:var(--color-red-500)}.hover\:text-yellow-400:hover{color:var(--color-yellow-400)}.hover\:underline:hover{text-decoration-line:underline}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a), 0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}}.focus\:border-blue-500:focus{border-color:var(--color-blue-500)}.focus\:bg-white:focus{background-color:var(--color-white)}.focus\:outline-none:focus{--tw-outline-style:none;outline-style:none}.focus-visible\:border-ring:focus-visible{border-color:var(--color-ring)}.focus-visible\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-\[3px\]:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.focus-visible\:ring-ring:focus-visible{--tw-ring-color:var(--color-ring)}.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:color-mix(in srgb, hsl(var(--ring)) 50%, transparent)}@supports (color:color-mix(in lab, red, red)){.focus-visible\:ring-ring\/50:focus-visible{--tw-ring-color:color-mix(in oklab, var(--color-ring) 50%, transparent)}}.focus-visible\:ring-offset-2:focus-visible{--tw-ring-offset-width:2px;--tw-ring-offset-shadow:var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)}.focus-visible\:ring-offset-background:focus-visible{--tw-ring-offset-color:var(--color-background)}.focus-visible\:outline-hidden:focus-visible{--tw-outline-style:none;outline-style:none}@media (forced-colors:active){.focus-visible\:outline-hidden:focus-visible{outline-offset:2px;outline:2px solid #0000}}.active\:scale-95:active{--tw-scale-x:95%;--tw-scale-y:95%;--tw-scale-z:95%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-110:active{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x) var(--tw-scale-y)}.active\:scale-125:active{--tw-scale-x:125%;--tw-scale-y:125%;--tw-scale-z:125%;scale:var(--tw-scale-x) var(--tw-scale-y)}.disabled\:pointer-events-none:disabled{pointer-events:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}:where([data-scrolling]) .in-\[\[data-scrolling\]\]\:transform-none{transform:none}:where([data-scrolling]) .in-\[\[data-scrolling\]\]\:border-slate-200{border-color:var(--color-slate-200)}:where([data-scrolling]) .in-\[\[data-scrolling\]\]\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}:where([data-scrolling]) .in-\[\[data-scrolling\]\]\:transition-none{transition-property:none}.aria-invalid\:border-destructive[aria-invalid=true]{border-color:var(--color-destructive)}.aria-invalid\:ring-destructive\/20[aria-invalid=true]{--tw-ring-color:color-mix(in srgb, hsl(var(--destructive)) 20%, transparent)}@supports (color:color-mix(in lab, red, red)){.aria-invalid\:ring-destructive\/20[aria-invalid=true]{--tw-ring-color:color-mix(in oklab, var(--color-destructive) 20%, transparent)}}.data-\[state\=active\]\:bg-background[data-state=active]{background-color:var(--color-background)}.data-\[state\=active\]\:bg-white[data-state=active]{background-color:var(--color-white)}.data-\[state\=active\]\:text-foreground[data-state=active]{color:var(--color-foreground)}.data-\[state\=active\]\:text-slate-900[data-state=active]{color:var(--color-slate-900)}.data-\[state\=active\]\:shadow-2xs[data-state=active]{--tw-shadow:0 1px var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=active\]\:shadow-sm[data-state=active]{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a), 0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}.data-\[state\=checked\]\:translate-x-5[data-state=checked]{--tw-translate-x:calc(var(--spacing) * 5);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=checked\]\:bg-primary[data-state=checked]{background-color:var(--color-primary)}.data-\[state\=inactive\]\:hidden[data-state=inactive]{display:none}.data-\[state\=unchecked\]\:translate-x-0[data-state=unchecked]{--tw-translate-x:calc(var(--spacing) * 0);translate:var(--tw-translate-x) var(--tw-translate-y)}.data-\[state\=unchecked\]\:bg-input[data-state=unchecked]{background-color:var(--color-input)}@media (min-width:640px){.sm\:block{display:block}.sm\:flex{display:flex}.sm\:hidden{display:none}.sm\:w-90{width:calc(var(--spacing) * 90)}.sm\:min-w-36{min-width:calc(var(--spacing) * 36)}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}@media (min-width:768px){.md\:grid-cols-\[minmax\(0\,1fr\)_220px\]{grid-template-columns:minmax(0,1fr) 220px}.md\:grid-cols-\[minmax\(0\,1fr\)_240px\]{grid-template-columns:minmax(0,1fr) 240px}.md\:text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}}.dark\:border-blue-500\/70:where(.dark,.dark *){border-color:#3080ffb3}@supports (color:color-mix(in lab, red, red)){.dark\:border-blue-500\/70:where(.dark,.dark *){border-color:color-mix(in oklab, var(--color-blue-500) 70%, transparent)}}.dark\:border-red-900:where(.dark,.dark *){border-color:var(--color-red-900)}.dark\:border-slate-600:where(.dark,.dark *){border-color:var(--color-slate-600)}.dark\:border-slate-700:where(.dark,.dark *){border-color:var(--color-slate-700)}.dark\:border-slate-800:where(.dark,.dark *){border-color:var(--color-slate-800)}.dark\:bg-input\/30:where(.dark,.dark *){background-color:color-mix(in srgb, hsl(var(--input)) 30%, transparent)}@supports (color:color-mix(in lab, red, red)){.dark\:bg-input\/30:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-input) 30%, transparent)}}.dark\:bg-slate-500:where(.dark,.dark *){background-color:var(--color-slate-500)}.dark\:bg-slate-700:where(.dark,.dark *){background-color:var(--color-slate-700)}.dark\:bg-slate-800:where(.dark,.dark *){background-color:var(--color-slate-800)}.dark\:bg-slate-800\/40:where(.dark,.dark *){background-color:#1d293d66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-800\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-800) 40%, transparent)}}.dark\:bg-slate-900\/40:where(.dark,.dark *){background-color:#0f172b66}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-900\/40:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-900) 40%, transparent)}}.dark\:bg-slate-900\/70:where(.dark,.dark *){background-color:#0f172bb3}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-900\/70:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-900) 70%, transparent)}}.dark\:bg-slate-900\/90:where(.dark,.dark *){background-color:#0f172be6}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-900\/90:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-900) 90%, transparent)}}.dark\:bg-slate-900\/95:where(.dark,.dark *){background-color:#0f172bf2}@supports (color:color-mix(in lab, red, red)){.dark\:bg-slate-900\/95:where(.dark,.dark *){background-color:color-mix(in oklab, var(--color-slate-900) 95%, transparent)}}.dark\:text-slate-100:where(.dark,.dark *){color:var(--color-slate-100)}.dark\:text-slate-200:where(.dark,.dark *){color:var(--color-slate-200)}.dark\:text-slate-300:where(.dark,.dark *){color:var(--color-slate-300)}.dark\:text-slate-400:where(.dark,.dark *){color:var(--color-slate-400)}.dark\:text-slate-500:where(.dark,.dark *){color:var(--color-slate-500)}.dark\:ring-blue-500\/40:where(.dark,.dark *){--tw-ring-color:#3080ff66}@supports (color:color-mix(in lab, red, red)){.dark\:ring-blue-500\/40:where(.dark,.dark *){--tw-ring-color:color-mix(in oklab, var(--color-blue-500) 40%, transparent)}}@media (hover:hover){.dark\:hover\:bg-slate-700:where(.dark,.dark *):hover{background-color:var(--color-slate-700)}.dark\:hover\:bg-slate-800:where(.dark,.dark *):hover{background-color:var(--color-slate-800)}}.dark\:aria-invalid\:ring-destructive\/40:where(.dark,.dark *)[aria-invalid=true]{--tw-ring-color:color-mix(in srgb, hsl(var(--destructive)) 40%, transparent)}@supports (color:color-mix(in lab, red, red)){.dark\:aria-invalid\:ring-destructive\/40:where(.dark,.dark *)[aria-invalid=true]{--tw-ring-color:color-mix(in oklab, var(--color-destructive) 40%, transparent)}}.dark\:data-\[state\=active\]\:bg-slate-800:where(.dark,.dark *)[data-state=active]{background-color:var(--color-slate-800)}.dark\:data-\[state\=active\]\:bg-slate-900\/70:where(.dark,.dark *)[data-state=active]{background-color:#0f172bb3}@supports (color:color-mix(in lab, red, red)){.dark\:data-\[state\=active\]\:bg-slate-900\/70:where(.dark,.dark *)[data-state=active]{background-color:color-mix(in oklab, var(--color-slate-900) 70%, transparent)}}.dark\:data-\[state\=active\]\:text-slate-100:where(.dark,.dark *)[data-state=active]{color:var(--color-slate-100)}.\[\&_svg\]\:pointer-events-none svg{pointer-events:none}.\[\&_svg\]\:size-4 svg{width:calc(var(--spacing) * 4);height:calc(var(--spacing) * 4)}.\[\&_svg\]\:shrink-0 svg{flex-shrink:0}}@keyframes enter{0%{opacity:var(--tw-enter-opacity,1);transform:translate3d(var(--tw-enter-translate-x,0), var(--tw-enter-translate-y,0), 0) scale3d(var(--tw-enter-scale,1), var(--tw-enter-scale,1), var(--tw-enter-scale,1)) rotate(var(--tw-enter-rotate,0))}}@keyframes exit{to{opacity:var(--tw-exit-opacity,1);transform:translate3d(var(--tw-exit-translate-x,0), var(--tw-exit-translate-y,0), 0) scale3d(var(--tw-exit-scale,1), var(--tw-exit-scale,1), var(--tw-exit-scale,1)) rotate(var(--tw-exit-rotate,0))}}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@property --tw-rotate-x{syntax:"*";inherits:false}@property --tw-rotate-y{syntax:"*";inherits:false}@property --tw-rotate-z{syntax:"*";inherits:false}@property --tw-skew-x{syntax:"*";inherits:false}@property --tw-skew-y{syntax:"*";inherits:false}@property --tw-pan-x{syntax:"*";inherits:false}@property --tw-pan-y{syntax:"*";inherits:false}@property --tw-pinch-zoom{syntax:"*";inherits:false}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-outline-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@keyframes pulse{50%{opacity:.5}}
package/package.json CHANGED
@@ -1,8 +1,10 @@
1
1
  {
2
2
  "name": "@aiquants/daily-report",
3
- "version": "0.3.2",
3
+ "version": "0.4.0",
4
4
  "description": "Reusable daily-report feature package: shared types/schemas, React (Router v7) UI with virtual scrolling + optimistic updates + SSE sync, and a drizzle (mssql) server layer with DI ports (auth, user resolution, redis, external sources).",
5
- "sideEffects": false,
5
+ "sideEffects": [
6
+ "**/*.css"
7
+ ],
6
8
  "main": "dist/index.js",
7
9
  "module": "dist/index.mjs",
8
10
  "types": "dist/index.d.ts",
@@ -21,7 +23,8 @@
21
23
  "types": "./dist/server.d.ts",
22
24
  "import": "./dist/server.mjs",
23
25
  "require": "./dist/server.js"
24
- }
26
+ },
27
+ "./styles/daily-report.standalone.css": "./dist/styles/daily-report.standalone.css"
25
28
  },
26
29
  "files": [
27
30
  "dist",
@@ -52,6 +55,7 @@
52
55
  "tailwind-merge": "^3.5.0"
53
56
  },
54
57
  "devDependencies": {
58
+ "@tailwindcss/cli": "^4.1.18",
55
59
  "@testing-library/jest-dom": "^6.9.1",
56
60
  "@testing-library/react": "^16.3.2",
57
61
  "@types/node": "^25.9.1",
@@ -62,12 +66,14 @@
62
66
  "react-dom": "^19.2.7",
63
67
  "react-router": "^7.13.0",
64
68
  "rimraf": "^6.1.2",
69
+ "tailwindcss": "^4.1.18",
70
+ "tailwindcss-animate": "^1.0.7",
65
71
  "tsup": "^8.5.1",
66
72
  "typescript": "^5.9.3",
67
73
  "vitest": "^4.1.8",
68
74
  "zod": "^3.25.76",
69
75
  "@aiquants/swipe-overlay": "1.2.4",
70
- "@aiquants/virtualscroll": "1.18.5"
76
+ "@aiquants/virtualscroll": "1.19.0"
71
77
  },
72
78
  "peerDependencies": {
73
79
  "drizzle-orm": ">=1.0.0-beta.4 <2.0.0",
@@ -75,8 +81,8 @@
75
81
  "react-dom": ">=18",
76
82
  "react-router": "^7.0.0",
77
83
  "zod": ">=3.25.0 <5.0.0",
78
- "@aiquants/swipe-overlay": "^1.2.4",
79
- "@aiquants/virtualscroll": "^1.18.5"
84
+ "@aiquants/virtualscroll": "^1.19.0",
85
+ "@aiquants/swipe-overlay": "^1.2.4"
80
86
  },
81
87
  "peerDependenciesMeta": {
82
88
  "drizzle-orm": {
@@ -91,9 +97,11 @@
91
97
  "access": "public"
92
98
  },
93
99
  "scripts": {
94
- "build": "tsup",
95
- "build:watch": "tsup --watch",
96
- "dev": "tsup --watch",
100
+ "build": "tsup && pnpm build:css",
101
+ "build:css": "tailwindcss -i src/styles/standalone.entry.css -o dist/styles/daily-report.standalone.css --minify",
102
+ "watch:css": "tailwindcss -i src/styles/standalone.entry.css -o dist/styles/daily-report.standalone.css --minify --watch",
103
+ "build:watch": "tsup --watch --onSuccess \"pnpm build:css\"",
104
+ "dev": "tsup --watch --onSuccess \"pnpm build:css\"",
97
105
  "typecheck": "tsc --noEmit",
98
106
  "clean": "rimraf dist",
99
107
  "publish:patch": "pnpm run typecheck && pnpm run --if-present test && pnpm version patch --no-git-tag-version --no-git-checks && pnpm publish --no-git-checks",
package/src/client/components/daily-report-comment-item.tsx CHANGED
@@ -51,7 +51,10 @@ export const DailyReportCommentItem = ({ comment, reportHubId: _reportHubId, bus
51
51
  }
52
52
 
53
53
  return (
54
- <li data-comment-id={comment.id} className={cn("group relative rounded-xl border border-slate-200 bg-white p-3", comment.isMine && "border-blue-200 bg-blue-50", isDeleted && "hidden", isPendingDelete ? "z-50" : "z-0 hover:z-10")}>
54
+ <li
55
+ data-comment-id={comment.id}
56
+ data-deleted={isDeleted ? "true" : undefined}
57
+ className={cn("group relative rounded-xl border border-slate-200 bg-white p-3", comment.isMine && "border-blue-200 bg-blue-50", isDeleted && "hidden", isPendingDelete ? "z-50" : "z-0 hover:z-10")}>
55
58
  <div className="mb-1 flex items-center justify-between">
56
59
  <div className={cn("font-semibold text-xs", resolveCommentColorClass(comment.color))}>{fallbackText(comment.authorName)}</div>
57
60
  <div className="flex items-center gap-2">
package/src/client/components/daily-report-detail-list.tsx CHANGED
@@ -119,7 +119,7 @@ export const DailyReportDetailList = ({ dailyReportItems, userId, selectedItemId
119
119
 
120
120
  useEffect(() => {
121
121
  if (virtualScrollRef.current) {
122
- const el = document.querySelector(".test-daily-report-detail-list")
122
+ const el = document.querySelector('[data-testid="daily-report-detail-list"]')
123
123
  if (el) {
124
124
  const handle = virtualScrollRef.current
125
125
  const extendedHandle: DailyReportVirtualScrollHandle = Object.assign({}, handle, {
@@ -184,8 +184,8 @@ export const DailyReportDetailList = ({ dailyReportItems, userId, selectedItemId
184
184
  const container = scrollContainerRef.current
185
185
  if (!container) return
186
186
 
187
- if (!container.classList.contains("is-scrolling")) {
188
- container.classList.add("is-scrolling")
187
+ if (container.dataset.scrolling !== "true") {
188
+ container.dataset.scrolling = "true"
189
189
  }
190
190
 
191
191
  if (scrollEndTimerRef.current) {
@@ -194,7 +194,7 @@ export const DailyReportDetailList = ({ dailyReportItems, userId, selectedItemId
194
194
 
195
195
  scrollEndTimerRef.current = setTimeout(() => {
196
196
  if (container) {
197
- container.classList.remove("is-scrolling")
197
+ delete container.dataset.scrolling
198
198
  }
199
199
  scrollEndTimerRef.current = null
200
200
  }, 150)
@@ -305,7 +305,8 @@ export const DailyReportDetailList = ({ dailyReportItems, userId, selectedItemId
305
305
  }}
306
306
  onRangeChange={handleRangeChange}
307
307
  onScroll={handleScroll}
308
- className="t-detail-list test-daily-report-detail-list relative w-full">
308
+ testId="daily-report-detail-list"
309
+ className="relative w-full">
309
310
  {renderItem}
310
311
  </VirtualScroll>
311
312
  </div>
package/src/client/components/daily-report-list.tsx CHANGED
@@ -352,7 +352,7 @@ export const DailyReportList = ({ dailyReportItems, initialSelectedBusinessDate
352
352
 
353
353
  useEffect(() => {
354
354
  if (virtualScrollRef.current) {
355
- const el = document.querySelector(".test-daily-report-list") as (Element & { __virtualScroll?: TestableVirtualScrollHandle }) | null
355
+ const el = document.querySelector('[data-testid="daily-report-list"]') as (Element & { __virtualScroll?: TestableVirtualScrollHandle }) | null
356
356
  if (el) {
357
357
  el.__virtualScroll = {
358
358
  ...virtualScrollRef.current,
@@ -402,8 +402,8 @@ export const DailyReportList = ({ dailyReportItems, initialSelectedBusinessDate
402
402
  const container = scrollContainerRef.current
403
403
  if (!container) return
404
404
 
405
- if (!container.classList.contains("is-scrolling")) {
406
- container.classList.add("is-scrolling")
405
+ if (container.dataset.scrolling !== "true") {
406
+ container.dataset.scrolling = "true"
407
407
  }
408
408
 
409
409
  if (scrollEndTimerRef.current) {
@@ -412,7 +412,7 @@ export const DailyReportList = ({ dailyReportItems, initialSelectedBusinessDate
412
412
 
413
413
  scrollEndTimerRef.current = setTimeout(() => {
414
414
  if (container) {
415
- container.classList.remove("is-scrolling")
415
+ delete container.dataset.scrolling
416
416
  }
417
417
  scrollEndTimerRef.current = null
418
418
  }, 150)
@@ -444,7 +444,8 @@ export const DailyReportList = ({ dailyReportItems, initialSelectedBusinessDate
444
444
  onScroll={handleScroll}
445
445
  onItemFocus={handleItemFocus}
446
446
  contentInsets={{ top: ITEM_VERTICAL_PADDING, bottom: ITEM_VERTICAL_PADDING }}
447
- className="test-daily-report-list relative w-full">
447
+ testId="daily-report-list"
448
+ className="relative w-full">
448
449
  {(item) => <ListReportItem key={item.reportHubId} item={item} isActive={item.reportHubId === selectedReportHubId} onSelect={handleItemSelect} />}
449
450
  </VirtualScroll>
450
451
  </div>
@@ -466,7 +467,7 @@ export const DailyReportList = ({ dailyReportItems, initialSelectedBusinessDate
466
467
  */
467
468
  const ListSkeletonItem = () => (
468
469
  <div className="px-2 pb-3" style={{ height: ITEM_CONTAINER_HEIGHT }}>
469
- <div className="flex h-full animate-pulse flex-col justify-between rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-700 dark:bg-slate-900/70">
470
+ <div data-skeleton className="flex h-full animate-pulse flex-col justify-between rounded-2xl border border-slate-200 bg-white p-4 shadow-sm dark:border-slate-700 dark:bg-slate-900/70">
470
471
  <div className="mb-3 flex flex-wrap items-center gap-3">
471
472
  <div className="h-4 w-24 rounded bg-slate-200"></div>
472
473
  <div className="h-4 w-24 rounded bg-slate-200"></div>
@@ -569,7 +570,7 @@ const DailyReportSidePane = ({
569
570
  <div className="text-slate-900 text-sm dark:text-slate-100">{headerDate}</div>
570
571
  <div className="flex min-h-4 items-center gap-1 text-slate-500 text-xs dark:text-slate-300">
571
572
  <span>{fieldLabels.author}:</span>
572
- {showHeaderSkeleton ? <div className="h-3 w-24 animate-pulse rounded bg-slate-200 dark:bg-slate-700" /> : <span>{headerCreator}</span>}
573
+ {showHeaderSkeleton ? <div data-skeleton className="h-3 w-24 animate-pulse rounded bg-slate-200 dark:bg-slate-700" /> : <span>{headerCreator}</span>}
573
574
  </div>
574
575
  </div>
575
576
  <Tabs value={activeTab} onValueChange={(v) => setActiveTab(v as DailyReportSidePaneTab)} className="flex min-h-0 flex-1 flex-col">
@@ -616,14 +617,18 @@ const DailyReportSidePane = ({
616
617
  // If rendered as a standalone pane (desktop)
617
618
  if (dailyReportItems) {
618
619
  return (
619
- <aside data-report-id={selectedItem?.reportHubId} className="test-daily-report-side-pane hidden min-h-0 min-w-0 flex-1 flex-col gap-3 rounded-2xl border border-slate-200 bg-white p-4 shadow-sm sm:flex dark:border-slate-700 dark:bg-slate-900/70" style={heightStyle}>
620
+ <aside
621
+ data-testid="daily-report-side-pane"
622
+ data-report-id={selectedItem?.reportHubId}
623
+ className="hidden min-h-0 min-w-0 flex-1 flex-col gap-3 rounded-2xl border border-slate-200 bg-white p-4 shadow-sm sm:flex dark:border-slate-700 dark:bg-slate-900/70"
624
+ style={heightStyle}>
620
625
  {content}
621
626
  </aside>
622
627
  )
623
628
  }
624
629
  // If rendered inside mobile overlay
625
630
  return (
626
- <div data-report-id={selectedItem?.reportHubId} className="test-daily-report-side-pane flex min-h-0 flex-1 flex-col gap-3 overflow-hidden">
631
+ <div data-testid="daily-report-side-pane" data-report-id={selectedItem?.reportHubId} className="flex min-h-0 flex-1 flex-col gap-3 overflow-hidden">
627
632
  {content}
628
633
  </div>
629
634
  )
@@ -722,7 +727,7 @@ const DailyReportDisplayPane = ({
722
727
  const isMine = !!(userId && report?.userId === userId)
723
728
  const hasComments = uiComments.length > 0
724
729
 
725
- const SkeletonText = ({ className = "w-32" }: { className?: string }) => <div className={`h-4 animate-pulse rounded bg-slate-200 dark:bg-slate-700 ${className}`} />
730
+ const SkeletonText = ({ className = "w-32" }: { className?: string }) => <div data-skeleton className={`h-4 animate-pulse rounded bg-slate-200 dark:bg-slate-700 ${className}`} />
726
731
 
727
732
  return (
728
733
  // biome-ignore lint/a11y/noStaticElementInteractions: Double click to edit feature
@@ -973,7 +978,7 @@ const ListReportItem = ({ item, isActive, onSelect }: { item: DailyReportItem; i
973
978
  {/* biome-ignore lint/a11y/useSemanticElements: Card contains nested interactive elements (Star/Read buttons) */}
974
979
  <div
975
980
  data-daily-report-button={item.reportHubId}
976
- className={`flex h-full w-full in-[.is-scrolling]:transform-none cursor-pointer select-none flex-col rounded-2xl border in-[.is-scrolling]:border-slate-200 bg-white p-4 text-left in-[.is-scrolling]:shadow-sm shadow-sm in-[.is-scrolling]:transition-none transition-all duration-200 hover:-translate-y-0.5 hover:border-blue-300 hover:shadow-lg dark:bg-slate-900/70 ${
981
+ className={`flex h-full w-full in-[[data-scrolling]]:transform-none cursor-pointer select-none flex-col rounded-2xl border in-[[data-scrolling]]:border-slate-200 bg-white p-4 text-left in-[[data-scrolling]]:shadow-sm shadow-sm in-[[data-scrolling]]:transition-none transition-all duration-200 hover:-translate-y-0.5 hover:border-blue-300 hover:shadow-lg dark:bg-slate-900/70 ${
977
982
  isActive ? "border-blue-300 shadow-md ring-2 ring-blue-200 dark:border-blue-500/70 dark:ring-blue-500/40" : "border-slate-200 dark:border-slate-700"
978
983
  }`}
979
984
  style={{ touchAction: "manipulation" }}
package/src/styles/standalone.entry.css ADDED
@@ -0,0 +1,51 @@
1
+ /*! @aiquants/daily-report standalone CSS — 非 Tailwind ホスト専用。ホストの Tailwind ビルドと混在させないこと */
2
+ @layer theme, base, components, utilities;
3
+ @import "tailwindcss/theme.css" layer(theme);
4
+ /* source(none): 自動ソース検出を無効化し、src 外のクラス混入を防ぐ */
5
+ @import "tailwindcss/utilities.css" layer(utilities) source(none);
6
+ /*
7
+ * virtualscroll の CSS は同梱しない: ホスト側で import 済みの新しいコピーを、
8
+ * ここに焼き込んだ古いコピーが後勝ちで上書きする事故 (stale-copy-wins) を防ぐため。
9
+ * ホストアプリは @aiquants/virtualscroll/styles/virtualscroll.css を自前で import すること。
10
+ */
11
+ @source "../**/*.{ts,tsx}";
12
+
13
+ /* JSX は .dark クラス切替の dark: バリアントを使うため、ホストアプリと同じ定義が必要 */
14
+ @plugin "tailwindcss-animate";
15
+ @custom-variant dark (&:where(.dark, .dark *));
16
+
17
+ /*
18
+ * ホストアプリ (quants-react-router) の @theme と同じトークン定義を複製する。
19
+ * bg-background / text-muted-foreground などのセマンティックトークンは
20
+ * Tailwind 既定テーマに存在しないため、定義しないとユーティリティ自体が生成されない。
21
+ * 値はホストの CSS 変数 (--background 等) を参照し、実行時にホスト側で解決される。
22
+ */
23
+ @theme {
24
+ --color-border: hsl(var(--border));
25
+ --color-input: hsl(var(--input));
26
+ --color-ring: hsl(var(--ring));
27
+ --color-background: hsl(var(--background));
28
+ --color-foreground: hsl(var(--foreground));
29
+ --color-primary: hsl(var(--primary));
30
+ --color-primary-foreground: hsl(var(--primary-foreground));
31
+ --color-secondary: hsl(var(--secondary));
32
+ --color-secondary-foreground: hsl(var(--secondary-foreground));
33
+ --color-destructive: hsl(var(--destructive));
34
+ --color-destructive-foreground: hsl(var(--destructive-foreground));
35
+ --color-muted: hsl(var(--muted));
36
+ --color-muted-foreground: hsl(var(--muted-foreground));
37
+ --color-accent: hsl(var(--accent));
38
+ --color-accent-foreground: hsl(var(--accent-foreground));
39
+ --color-popover: hsl(var(--popover));
40
+ --color-popover-foreground: hsl(var(--popover-foreground));
41
+ --color-card: hsl(var(--card));
42
+ --color-card-foreground: hsl(var(--card-foreground));
43
+ --breakpoint-sm: 640px;
44
+ --breakpoint-md: 768px;
45
+ --breakpoint-lg: 1024px;
46
+ --breakpoint-xl: 1280px;
47
+ --breakpoint-2xl: 1536px;
48
+ --radius-lg: var(--radius, 0.5rem);
49
+ --radius-md: calc(var(--radius, 0.5rem) - 2px);
50
+ --radius-sm: calc(var(--radius, 0.5rem) - 4px);
51
+ }