@morscherlab/mint-sdk 1.2.0 → 1.2.2

package/src/components/LayoutResizeHandle.vue

@@ -0,0 +1,62 @@
+<script setup lang="ts">
+/** Accessible pointer and keyboard handle for resizable workbench panes. */
+interface Props {
+  modelValue: number
+  min: number
+  max: number
+  label: string
+  orientation: 'vertical' | 'horizontal'
+  edge?: 'left' | 'right'
+  step?: number
+  disabled?: boolean
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  edge: undefined,
+  step: 10,
+  disabled: false,
+})
+
+const emit = defineEmits<{
+  'update:modelValue': [value: number]
+  'resize-start': [event: PointerEvent]
+}>()
+
+function update(value: number): void {
+  emit('update:modelValue', Math.min(props.max, Math.max(props.min, value)))
+}
+
+function handleKeydown(event: KeyboardEvent): void {
+  if (props.disabled) return
+  const decrement = props.orientation === 'vertical' ? 'ArrowLeft' : 'ArrowUp'
+  const increment = props.orientation === 'vertical' ? 'ArrowRight' : 'ArrowDown'
+  if (event.key === decrement) update(props.modelValue - props.step)
+  else if (event.key === increment) update(props.modelValue + props.step)
+  else if (event.key === 'Home') update(props.min)
+  else if (event.key === 'End') update(props.max)
+  else return
+  event.preventDefault()
+}
+</script>
+
+<template>
+  <div
+    role="separator"
+    :tabindex="disabled ? -1 : 0"
+    :class="[
+      'mint-layout-resize-handle',
+      `mint-layout-resize-handle--${orientation}`,
+      edge ? `mint-layout-resize-handle--edge-${edge}` : '',
+    ]"
+    :aria-label="label"
+    :aria-orientation="orientation"
+    :aria-valuemin="min"
+    :aria-valuemax="max"
+    :aria-valuenow="modelValue"
+    :aria-disabled="disabled || undefined"
+    @pointerdown="!disabled && emit('resize-start', $event)"
+    @keydown="handleKeydown"
+  >
+    <span class="mint-layout-resize-handle__bar" aria-hidden="true" />
+  </div>
+</template>

package/src/components/NumberInput.story.vue

@@ -1,7 +1,20 @@
 <script setup lang="ts">
+import { ref } from 'vue'
 import NumberInput from './NumberInput.vue'
 
 const sizes = ['sm', 'md', 'lg'] as const
+
+const sizeValues = ref<Record<string, number | undefined>>({ sm: 42, md: 42, lg: 42 })
+const samples = ref<number | undefined>(96)
+const temperature = ref<number | undefined>(37)
+const volume = ref<number | undefined>(100)
+const overMax = ref<number | undefined>(999)
+const empty = ref<number | undefined>(undefined)
+const mass = ref<number | undefined>(12.5)
+const ph = ref<number | undefined>(7.4)
+const wells = ref<number | undefined>(96)
+const sliderPh = ref<number | undefined>(7.4)
+const percent = ref<number | undefined>(45)
 </script>
 
 <template>
@@ -39,6 +52,9 @@ const sizes = ['sm', 'md', 'lg'] as const
         <HstCheckbox v-model="state.disabled" title="Disabled" />
         <HstCheckbox v-model="state.error" title="Error" />
       </template>
+      <template #initState>
+        {{ { value: 42, min: 0, max: 100, step: 1, size: 'md', placeholder: '', disabled: false, error: false } }}
+      </template>
     </Variant>
 
     <Variant title="Sizes">
@@ -47,7 +63,7 @@ const sizes = ['sm', 'md', 'lg'] as const
           <p style="margin: 0 0 0.5rem; font-size: 0.75rem; color: var(--text-muted, #94a3b8); text-transform: uppercase; letter-spacing: 0.05em;">
             {{ size }}
           </p>
-          <NumberInput :model-value="42" :size="size" />
+          <NumberInput v-model="sizeValues[size]" :size="size" />
         </div>
       </div>
     </Variant>
@@ -56,22 +72,22 @@ const sizes = ['sm', 'md', 'lg'] as const
       <div style="padding: 2rem; max-width: 300px; margin: 0 auto; display: flex; flex-direction: column; gap: 1.5rem;">
         <div>
           <p style="margin: 0 0 0.5rem; font-size: 0.875rem; color: var(--text-primary, #e2e8f0);">Sample count (0-384)</p>
-          <NumberInput :model-value="96" :min="0" :max="384" :step="1" placeholder="Samples" />
+          <NumberInput v-model="samples" :min="0" :max="384" :step="1" placeholder="Samples" />
         </div>
         <div>
           <p style="margin: 0 0 0.5rem; font-size: 0.875rem; color: var(--text-primary, #e2e8f0);">Temperature (step 0.5)</p>
-          <NumberInput :model-value="37" :min="0" :max="100" :step="0.5" />
+          <NumberInput v-model="temperature" :min="0" :max="100" :step="0.5" />
         </div>
         <div>
           <p style="margin: 0 0 0.5rem; font-size: 0.875rem; color: var(--text-primary, #e2e8f0);">Volume in uL (step 10)</p>
-          <NumberInput :model-value="100" :min="0" :max="1000" :step="10" />
+          <NumberInput v-model="volume" :min="0" :max="1000" :step="10" />
         </div>
       </div>
     </Variant>
 
     <Variant title="Error State">
       <div style="padding: 2rem; max-width: 300px; margin: 0 auto;">
-        <NumberInput :model-value="999" :max="100" error />
+        <NumberInput v-model="overMax" :max="100" error />
       </div>
     </Variant>
 
@@ -83,16 +99,16 @@ const sizes = ['sm', 'md', 'lg'] as const
 
     <Variant title="Empty with Placeholder">
       <div style="padding: 2rem; max-width: 300px; margin: 0 auto;">
-        <NumberInput placeholder="Enter value..." />
+        <NumberInput v-model="empty" placeholder="Enter value..." />
       </div>
     </Variant>
 
-    <Variant title="Hover-Reveal Steppers (default)">
+    <Variant title="Steppers (always visible)">
       <template #default="{ state }">
         <div style="padding: 2rem; max-width: 320px; display: flex; flex-direction: column; gap: 1rem;">
           <NumberInput v-model="state.value" :step="0.5" />
           <p style="margin: 0; font-size: 0.8125rem; color: var(--text-muted);">
-            Hover or focus to reveal the ↑/↓ steppers. Rest = clean.
+            Two horizontal steppers, hairline-divided. Arrow keys, PageUp/PageDown also step.
           </p>
         </div>
       </template>
@@ -106,16 +122,19 @@ const sizes = ['sm', 'md', 'lg'] as const
 
     <Variant title="With unit suffix">
       <div style="padding: 2rem; max-width: 320px; display: flex; flex-direction: column; gap: 0.75rem;">
-        <NumberInput :model-value="12.5" unit="mg" :step="0.1" />
-        <NumberInput :model-value="7.4" unit="pH" :step="0.1" :min="0" :max="14" />
-        <NumberInput :model-value="96" unit="wells" :step="1" />
+        <NumberInput v-model="mass" unit="mg" :step="0.1" />
+        <NumberInput v-model="ph" unit="pH" :step="0.1" :min="0" :max="14" />
+        <NumberInput v-model="wells" unit="wells" :step="1" />
       </div>
     </Variant>
 
     <Variant title="Slider mode (min + max provided)">
       <div style="padding: 2rem; max-width: 320px; display: flex; flex-direction: column; gap: 1rem;">
-        <NumberInput :model-value="7.4" :min="0" :max="14" :step="0.1" unit="pH" />
-        <NumberInput :model-value="45" :min="0" :max="100" :step="1" unit="%" />
+        <NumberInput v-model="sliderPh" :min="0" :max="14" :step="0.1" unit="pH" />
+        <NumberInput v-model="percent" :min="0" :max="100" :step="1" unit="%" />
+        <p style="margin: 0; font-size: 0.8125rem; color: var(--text-muted);">
+          Drag the number left or right to adjust; click to type. Home/End on the slider jump to min/max.
+        </p>
       </div>
     </Variant>
   </Story>

package/src/components/NumberInput.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
-/** Numeric input with increment/decrement buttons, optional unit label, and slider progress track. */
-import { computed } from 'vue'
+/** Numeric input with always-visible steppers, optional unit label, and (with min+max) an in-field drag-to-scrub range fill. */
+import { computed, onBeforeUnmount } from 'vue'
 
 interface Props {
   modelValue?: number
@@ -33,7 +33,7 @@ const sliderPercent = computed(() => {
   if (min === undefined || max === undefined || props.modelValue === undefined) return 0
   const range = max - min
   if (range === 0) return 0
-  return ((props.modelValue - min) / range) * 100
+  return Math.min(100, Math.max(0, ((props.modelValue - min) / range) * 100))
 })
 
 const canDecrement = computed(() => {
@@ -55,6 +55,17 @@ function clamp(value: number): number {
   return result
 }
 
+/** Clamp and trim float noise (0.1 + 0.2 → 0.3) without losing real precision. */
+function settle(value: number): number {
+  return Number(clamp(value).toFixed(10))
+}
+
+/** Snap to the step grid anchored at `min`, for pointer scrubbing. */
+function snap(value: number): number {
+  const origin = props.min ?? 0
+  return settle(origin + Math.round((value - origin) / props.step) * props.step)
+}
+
 function handleInput(event: Event) {
   const target = event.target as HTMLInputElement
   const value = target.value === '' ? undefined : Number(target.value)
@@ -65,24 +76,98 @@ function handleInput(event: Event) {
   }
 }
 
-function handleSliderInput(event: Event) {
-  const target = event.target as HTMLInputElement
-  const value = Number(target.value)
-  if (!isNaN(value)) {
-    emit('update:modelValue', clamp(value))
-  }
+function nudge(delta: number) {
+  if (props.disabled) return
+  if (delta < 0 && !canDecrement.value) return
+  if (delta > 0 && !canIncrement.value) return
+  const current = props.modelValue ?? (delta < 0 ? props.max ?? 0 : props.min ?? 0)
+  emit('update:modelValue', settle(current + delta))
 }
 
 function decrement() {
-  if (props.disabled || !canDecrement.value) return
-  const current = props.modelValue ?? (props.max ?? 0)
-  emit('update:modelValue', clamp(current - props.step))
+  nudge(-props.step)
 }
 
 function increment() {
-  if (props.disabled || !canIncrement.value) return
-  const current = props.modelValue ?? (props.min ?? 0)
-  emit('update:modelValue', clamp(current + props.step))
+  nudge(props.step)
+}
+
+// Home/End only apply on the slider surface: inside the text input they must
+// keep moving the caret.
+function handleKeydown(event: KeyboardEvent, allowJump = false) {
+  if (props.disabled) return
+  switch (event.key) {
+    case 'ArrowUp': increment(); break
+    case 'ArrowDown': decrement(); break
+    case 'PageUp': nudge(props.step * 10); break
+    case 'PageDown': nudge(-props.step * 10); break
+    case 'Home':
+      if (!allowJump || props.min === undefined) return
+      emit('update:modelValue', props.min)
+      break
+    case 'End':
+      if (!allowJump || props.max === undefined) return
+      emit('update:modelValue', props.max)
+      break
+    default:
+      return
+  }
+  event.preventDefault()
+}
+
+// The surrounding range uses absolute position; dragging the number uses a
+// relative offset so grabbing it never jumps away from the current value.
+function scrubTo(clientX: number, area: HTMLElement) {
+  const rect = area.getBoundingClientRect()
+  if (rect.width === 0 || props.min === undefined || props.max === undefined) return
+  const ratio = Math.min(1, Math.max(0, (clientX - rect.left) / rect.width))
+  emit('update:modelValue', snap(props.min + ratio * (props.max - props.min)))
+}
+
+let stopScrubbing: (() => void) | undefined
+onBeforeUnmount(() => stopScrubbing?.())
+
+function handleScrubStart(event: PointerEvent) {
+  const target = event.target as HTMLElement
+  const onNumber = target.tagName === 'INPUT'
+  if (props.disabled || event.button !== 0 || (!onNumber && !isSliderMode.value)) return
+  stopScrubbing?.()
+  const area = event.currentTarget as HTMLElement
+  const startValue = props.modelValue ?? props.min ?? 0
+  const width = area.getBoundingClientRect().width
+  const unitsPerPixel = isSliderMode.value && width > 0
+    ? (props.max! - props.min!) / width
+    : props.step / 8
+  // Preserve ordinary clicks and double-clicks for caret placement and typing.
+  if (!onNumber) {
+    event.preventDefault()
+    scrubTo(event.clientX, area)
+  }
+  target.setPointerCapture?.(event.pointerId)
+  let dragging = false
+  const move = (e: PointerEvent) => {
+    if (e.pointerId !== event.pointerId) return
+    if (props.disabled) { stop(); return }
+    if (!onNumber) { scrubTo(e.clientX, area); return }
+    const delta = e.clientX - event.clientX
+    if (!dragging && Math.abs(delta) < 4) return
+    dragging = true
+    e.preventDefault()
+    emit('update:modelValue', settle(startValue + Math.round(delta * unitsPerPixel / props.step) * props.step))
+  }
+  const stop = () => {
+    area.removeEventListener('pointermove', move)
+    area.removeEventListener('pointerup', stop)
+    area.removeEventListener('pointercancel', stop)
+    area.removeEventListener('lostpointercapture', stop)
+    if (target.hasPointerCapture?.(event.pointerId)) target.releasePointerCapture(event.pointerId)
+    stopScrubbing = undefined
+  }
+  stopScrubbing = stop
+  area.addEventListener('pointermove', move)
+  area.addEventListener('pointerup', stop)
+  area.addEventListener('pointercancel', stop)
+  area.addEventListener('lostpointercapture', stop)
 }
 </script>
 
@@ -97,62 +182,66 @@ function increment() {
     ]"
   >
     <div class="mint-number-input__field">
-      <input
-        type="number"
-        :value="modelValue"
-        :min="min"
-        :max="max"
-        :step="step"
-        :disabled="disabled"
-        :placeholder="placeholder"
-        :class="[
-          'mint-number-input__input',
-          `mint-number-input__input--${size}`,
-        ]"
-        @input="handleInput"
-      />
-
-      <span v-if="unit" class="mint-number-input__unit">{{ unit }}</span>
+      <div
+        class="mint-number-input__scrub"
+        :style="isSliderMode ? { '--mint-number-input-fill': `${sliderPercent}%` } : undefined"
+        :role="isSliderMode ? 'slider' : undefined"
+        :tabindex="isSliderMode && !disabled ? 0 : undefined"
+        :aria-valuenow="isSliderMode ? modelValue : undefined"
+        :aria-valuemin="isSliderMode ? min : undefined"
+        :aria-valuemax="isSliderMode ? max : undefined"
+        :aria-orientation="isSliderMode ? 'horizontal' : undefined"
+        @pointerdown="handleScrubStart"
+        @keydown.self="isSliderMode && handleKeydown($event, true)"
+      >
+        <template v-if="isSliderMode">
+          <span class="mint-number-input__wash" aria-hidden="true" />
+          <span class="mint-number-input__rule" aria-hidden="true" />
+        </template>
+        <input
+          type="number"
+          :value="modelValue"
+          :min="min"
+          :max="max"
+          :step="step"
+          :disabled="disabled"
+          :placeholder="placeholder"
+          :class="[
+            'mint-number-input__input',
+            `mint-number-input__input--${size}`,
+          ]"
+          @input="handleInput"
+          @keydown="handleKeydown"
+        />
+        <span v-if="unit" class="mint-number-input__unit">{{ unit }}</span>
+      </div>
 
       <div class="mint-number-input__steppers" aria-hidden="true">
         <button
           type="button"
           tabindex="-1"
-          aria-label="Increase value"
-          :disabled="disabled || !canIncrement"
-          class="mint-number-input__stepper mint-number-input__stepper--up"
-          @click="increment"
+          aria-label="Decrease value"
+          :disabled="disabled || !canDecrement"
+          class="mint-number-input__stepper mint-number-input__stepper--down"
+          @click="decrement"
         >
-          <svg viewBox="0 0 10 6" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-            <path d="M1 5l4-4 4 4" />
+          <svg viewBox="0 0 10 10" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round">
+            <path d="M2 5h6" />
           </svg>
         </button>
         <button
           type="button"
           tabindex="-1"
-          aria-label="Decrease value"
-          :disabled="disabled || !canDecrement"
-          class="mint-number-input__stepper mint-number-input__stepper--down"
-          @click="decrement"
+          aria-label="Increase value"
+          :disabled="disabled || !canIncrement"
+          class="mint-number-input__stepper mint-number-input__stepper--up"
+          @click="increment"
         >
-          <svg viewBox="0 0 10 6" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round">
-            <path d="M1 1l4 4 4-4" />
+          <svg viewBox="0 0 10 10" fill="none" stroke="currentColor" stroke-width="1.6" stroke-linecap="round">
+            <path d="M5 2v6" /><path d="M2 5h6" />
           </svg>
         </button>
       </div>
     </div>
-
-    <input
-      v-if="isSliderMode"
-      type="range"
-      :value="modelValue ?? min"
-      :min="min"
-      :max="max"
-      :step="step"
-      :disabled="disabled"
-      :style="{ '--mint-slider-fill': `${sliderPercent}%` }"
-      class="mint-number-input__slider"
-      @input="handleSliderInput"
-    />
   </div>
 </template>

package/src/components/PlotlyChart.vue

@@ -16,7 +16,7 @@
  * ```
  */
 import type * as PlotlyType from 'plotly.js'
-import { nextTick, onBeforeUnmount, onMounted, ref, toRaw, watch } from 'vue'
+import { computed, nextTick, onBeforeUnmount, onMounted, ref, toRaw, watch } from 'vue'
 
 import ChartContainer from './ChartContainer.vue'
 
@@ -30,6 +30,16 @@ interface Props {
   empty?: boolean
   emptyMessage?: string
   ariaLabel?: string
+  /** Use a custom Plotly build instead of the SDK's lazy-loaded default bundle. */
+  plotly?: typeof PlotlyType
+  /** Pause rendering and resize work while a tab or panel is inactive. */
+  active?: boolean
+  /** Plot canvas height. Numbers are interpreted as pixels. */
+  height?: string | number
+  /** Forward Plotly point clicks through the `plotly-click` event. */
+  clickEvents?: boolean
+  /** Shared chart container chrome. `frame` fills a workbench panel. */
+  variant?: 'card' | 'frame'
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -39,11 +49,28 @@ const props = withDefaults(defineProps<Props>(), {
   empty: false,
   emptyMessage: 'No data available',
   ariaLabel: 'Interactive Plotly chart',
+  active: true,
+  clickEvents: false,
+  variant: 'card',
 })
 
+const emit = defineEmits<{
+  'plotly-click': [event: PlotlyType.PlotMouseEvent]
+}>()
+
+defineSlots<{
+  header?: () => unknown
+  toolbar?: () => unknown
+  subhead?: () => unknown
+  empty?: () => unknown
+  error?: () => unknown
+  legend?: () => unknown
+  footer?: () => unknown
+}>()
+
 const chartElement = ref<HTMLDivElement | null>(null)
 const failed = ref(false)
-let plotly: typeof PlotlyType | null = null
+let plotly: typeof PlotlyType | null = props.plotly ?? null
 let resizeObserver: ResizeObserver | null = null
 let themeObserver: MutationObserver | null = null
 let renderedElement: HTMLDivElement | null = null
@@ -52,10 +79,24 @@ let disposed = false
 let revision = 0
 
 async function loadPlotly(): Promise<typeof PlotlyType> {
+  if (props.plotly) return props.plotly
   const module = await import('plotly.js-dist-min')
   return ('default' in module ? module.default : module) as unknown as typeof PlotlyType
 }
 
+type PlotlyEventHost = HTMLDivElement & {
+  on?: (eventName: string, callback: (event: PlotlyType.PlotMouseEvent) => void) => void
+  removeAllListeners?: (eventName: string) => void
+}
+
+function bindEvents(element: HTMLDivElement): void {
+  const host = element as PlotlyEventHost
+  host.removeAllListeners?.('plotly_click')
+  if (props.clickEvents) {
+    host.on?.('plotly_click', event => emit('plotly-click', event))
+  }
+}
+
 function cssValue(name: string, fallback: string): string {
   const value = getComputedStyle(chartElement.value ?? document.documentElement).getPropertyValue(name).trim()
   return value || getComputedStyle(document.documentElement).getPropertyValue(name).trim() || fallback
@@ -98,17 +139,17 @@ function purgeChart(): void {
 
 async function renderChart(): Promise<void> {
   revision++
-  if (rendering || disposed || props.loading || props.empty) return
+  if (rendering || disposed || !props.active || props.loading || props.empty) return
   rendering = true
   try {
-    while (!disposed && !props.loading && !props.empty) {
+    while (!disposed && props.active && !props.loading && !props.empty) {
       const currentRevision = revision
       failed.value = false
       await nextTick()
-      if (disposed || props.loading || props.empty) break
+      if (disposed || !props.active || props.loading || props.empty) break
       try {
         plotly ??= await loadPlotly()
-        if (disposed || props.loading || props.empty) break
+        if (disposed || !props.active || props.loading || props.empty) break
         if (currentRevision !== revision) continue
         const element = chartElement.value
         if (!element) break
@@ -122,7 +163,8 @@ async function renderChart(): Promise<void> {
         )
         if (disposed || props.loading || props.empty || element !== chartElement.value) {
           purgeChart()
-        } else {
+        } else if (props.active) {
+          bindEvents(element)
           resizeObserver?.observe(element)
         }
       } catch {
@@ -140,7 +182,7 @@ async function renderChart(): Promise<void> {
 onMounted(() => {
   if (typeof ResizeObserver !== 'undefined') {
     resizeObserver = new ResizeObserver(() => {
-      if (rendering || !plotly || !renderedElement) return
+      if (rendering || !props.active || !plotly || !renderedElement) return
       // A tab can become hidden or unmount before Plotly's async resize finishes.
       void Promise.resolve(plotly.Plots.resize(renderedElement)).catch(() => {})
     })
@@ -157,16 +199,29 @@ onMounted(() => {
 })
 
 watch(
-  [() => props.data, () => props.layout, () => props.config, () => props.loading, () => props.empty],
+  [() => props.data, () => props.layout, () => props.config, () => props.loading, () => props.empty, () => props.active],
   () => {
-    if (props.loading || props.empty) {
+    if (props.loading || props.empty || !props.active) {
       resizeObserver?.disconnect()
-      if (!rendering) purgeChart()
+      if ((props.loading || props.empty) && !rendering) purgeChart()
     }
     void renderChart()
   },
 )
 
+watch(
+  () => props.clickEvents,
+  () => {
+    if (renderedElement) bindEvents(renderedElement)
+  },
+)
+
+const chartStyle = computed(() => {
+  if (props.height === undefined) return undefined
+  const height = typeof props.height === 'number' ? `${props.height}px` : props.height
+  return { height, minHeight: height }
+})
+
 onBeforeUnmount(() => {
   disposed = true
   resizeObserver?.disconnect()
@@ -183,10 +238,17 @@ onBeforeUnmount(() => {
     :loading="loading"
     :empty="empty"
     :empty-message="emptyMessage"
+    :variant="variant"
   >
+    <template v-if="$slots.header" #header>
+      <slot name="header" />
+    </template>
     <template v-if="$slots.toolbar" #toolbar>
       <slot name="toolbar" />
     </template>
+    <template v-if="$slots.subhead" #subhead>
+      <slot name="subhead" />
+    </template>
     <template v-if="$slots.empty" #empty>
       <slot name="empty" />
     </template>
@@ -204,11 +266,15 @@ onBeforeUnmount(() => {
       class="mint-plotly-chart__plot"
       role="group"
       :aria-label="ariaLabel"
+      :style="chartStyle"
     />
 
     <template v-if="$slots.legend" #legend>
       <slot name="legend" />
     </template>
+    <template v-if="$slots.footer" #footer>
+      <slot name="footer" />
+    </template>
   </ChartContainer>
 </template>
 

package/src/components/PluginWorkspaceView.props.ts

@@ -97,9 +97,9 @@ export interface PluginWorkspaceViewProps {
   sidebarSubtitle?: string
   /** Optional compact badge/count rendered in the sidebar header. */
   sidebarBadge?: string | number
-  /** AppSidebar visual preset. `analysis` matches the LEAF-style MINT analysis sidebar language. */
+  /** @deprecated No-op. AppSidebar has one look now; the former `analysis` preset is the default. */
   sidebarVariant?: PluginWorkspaceSidebarVariant
-  /** Sidebar CSS width. Defaults to AppSidebar's variant width. */
+  /** Sidebar CSS width. Defaults to AppSidebar's width. */
   sidebarWidth?: string
   /** Sidebar position in AppLayout. */
   sidebarPosition?: 'left' | 'right'
@@ -113,7 +113,7 @@ export interface PluginWorkspaceViewProps {
   sidebarContentId?: string
   /** Compact AppSidebar density. */
   dense?: boolean
-  /** Show a built-in collapse/expand button in the sidebar chrome. Defaults to AppSidebar's variant behavior. */
+  /** Show a built-in collapse/expand button in the sidebar chrome. Defaults to true. */
   sidebarCollapsible?: boolean
   /** Sidebar width when collapsed. */
   sidebarCollapsedWidth?: string