@dreamlake/dockit 0.2.17 → 0.2.19

package/THIRD_PARTY_NOTICES

@@ -0,0 +1,45 @@
+Lucide icons: https://lucide.dev
+
+ISC License
+
+Copyright (c) 2026 Lucide Icons and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF
+OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
+
+---
+
+The following Lucide icons are derived from the Feather project:
+
+airplay, alert-circle, alert-octagon, alert-triangle, aperture, arrow-down-circle, arrow-down-left, arrow-down-right, arrow-down, arrow-left-circle, arrow-left, arrow-right-circle, arrow-right, arrow-up-circle, arrow-up-left, arrow-up-right, arrow-up, at-sign, calendar, cast, check, chevron-down, chevron-left, chevron-right, chevron-up, chevrons-down, chevrons-left, chevrons-right, chevrons-up, circle, clipboard, clock, code, columns, command, compass, corner-down-left, corner-down-right, corner-left-down, corner-left-up, corner-right-down, corner-right-up, corner-up-left, corner-up-right, crosshair, database, divide-circle, divide-square, dollar-sign, download, external-link, feather, frown, hash, headphones, help-circle, info, italic, key, layout, life-buoy, link-2, link, loader, lock, log-in, log-out, maximize, meh, minimize, minimize-2, minus-circle, minus-square, minus, monitor, moon, more-horizontal, more-vertical, move, music, navigation-2, navigation, octagon, pause-circle, percent, plus-circle, plus-square, plus, power, radio, rss, search, server, share, shopping-bag, sidebar, smartphone, smile, square, table-2, tablet, target, terminal, trash-2, trash, triangle, tv, type, upload, x-circle, x-octagon, x-square, x, zoom-in, zoom-out
+
+The MIT License (MIT) (for the icons listed above)
+
+Copyright (c) 2013-present Cole Bemis
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/components/Table.js

@@ -1,4 +1,4 @@
-import { jsxs, jsx } from "react/jsx-runtime";
+import { jsxs, jsx, Fragment } from "react/jsx-runtime";
 import { useState, useId } from "react";
 function Table({
   children,
@@ -10,8 +10,9 @@ function Table({
   const [wrap, setWrap] = useState(true);
   const generatedId = useId();
   const tableId = id ?? generatedId;
+  const actionLabel = wrap ? "Unwrap" : "Wrap";
   return /* @__PURE__ */ jsxs("div", { className: "doc-table", "data-wrap": wrap ? "on" : "off", children: [
-    /* @__PURE__ */ jsx("div", { className: "doc-table-toolbar", children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx("div", { className: "doc-table-toolbar", children: /* @__PURE__ */ jsxs(
       "button",
       {
         type: "button",
@@ -19,23 +20,35 @@ function Table({
         "aria-label": "Wrap table text",
         "aria-pressed": wrap,
         "aria-controls": tableId,
-        title: wrap ? "Turn off text wrapping" : "Wrap table text",
+        "aria-describedby": `${generatedId}-wrap-hint`,
         onClick: () => setWrap((value) => !value),
-        children: /* @__PURE__ */ jsx(
-          "svg",
-          {
-            width: "12",
-            height: "12",
-            viewBox: "0 0 24 24",
-            fill: "none",
-            stroke: "currentColor",
-            strokeWidth: "1.5",
-            strokeLinecap: "round",
-            strokeLinejoin: "round",
-            "aria-hidden": "true",
-            children: /* @__PURE__ */ jsx("path", { d: "M3 6h18M3 12h14a3 3 0 0 1 0 6h-4m3-3-3 3 3 3M3 18h4" })
-          }
-        )
+        children: [
+          /* @__PURE__ */ jsx(
+            "svg",
+            {
+              width: "12",
+              height: "12",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "currentColor",
+              strokeWidth: "2",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              "aria-hidden": "true",
+              children: wrap ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("path", { d: "m16 16-3 3 3 3" }),
+                /* @__PURE__ */ jsx("path", { d: "M3 12h14.5a1 1 0 0 1 0 7H13" }),
+                /* @__PURE__ */ jsx("path", { d: "M3 19h6" }),
+                /* @__PURE__ */ jsx("path", { d: "M3 5h18" })
+              ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                /* @__PURE__ */ jsx("path", { d: "M21 5H3" }),
+                /* @__PURE__ */ jsx("path", { d: "M15 12H3" }),
+                /* @__PURE__ */ jsx("path", { d: "M17 19H3" })
+              ] })
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "doc-table-wrap-hint", id: `${generatedId}-wrap-hint`, children: actionLabel })
+        ]
       }
     ) }),
     /* @__PURE__ */ jsx(

package/dist/styles.css

@@ -115,7 +115,7 @@
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  width: 20px;
+  width: auto;
   height: 20px;
   padding: 4px;
   border: 0;
@@ -125,13 +125,37 @@
   font-family: var(--font-doc-template-mono);
   font-size: 10px;
   opacity: 0.65;
+  transition: color 120ms ease, opacity 120ms ease;
   cursor: pointer;
 }
 .doc-table-wrap[aria-pressed='true'] {
   opacity: 0.9;
 }
-.doc-table-wrap:hover { opacity: 1; }
-.doc-table-wrap:focus-visible, .doc-table-scroll:focus-visible {
+.doc-table-wrap:hover, .doc-table-wrap:focus-visible {
+  color: var(--color-doc-template-ink);
+  opacity: 1;
+  outline: none;
+}
+.doc-table-wrap-hint {
+  max-width: 0;
+  margin-left: 0;
+  overflow: hidden;
+  line-height: 14px;
+  white-space: nowrap;
+  opacity: 0;
+  visibility: hidden;
+  pointer-events: none;
+  transition: max-width 160ms ease, margin-left 160ms ease, opacity 120ms ease, visibility 120ms ease;
+}
+.doc-table-wrap > svg { flex-shrink: 0; }
+.doc-table-wrap:hover .doc-table-wrap-hint,
+.doc-table-wrap:focus-visible .doc-table-wrap-hint {
+  max-width: 6ch;
+  margin-left: 6px;
+  opacity: 1;
+  visibility: visible;
+}
+.doc-table-scroll:focus-visible {
   outline: 2px solid var(--color-doc-template-muted);
   outline-offset: 2px;
 }
@@ -144,7 +168,7 @@
   background-clip: padding-box;
 }
 /* Reserve room under the overlay, including headers with inline cell padding. */
-.doc-table-scroll > table > thead > tr > th:last-child { padding-right: 36px !important; }
+.doc-table-scroll > table > thead > tr > th:last-child { padding-right: 78px !important; }
 .doc-table[data-wrap='on'] > .doc-table-scroll > table { white-space: normal; overflow-wrap: anywhere; }
 .doc-table[data-wrap='off'] > .doc-table-scroll > table { white-space: nowrap; overflow-wrap: normal; }
 

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "@dreamlake/dockit",
-  "version": "0.2.17",
+  "version": "0.2.19",
   "description": "The DreamLake documentation shell — Vike + React + Tailwind v4 + MDX docs framework with sidebar, TOC, search, and theming",
   "license": "MIT",
   "type": "module",
   "files": [
     "dist",
-    "templates"
+    "templates",
+    "THIRD_PARTY_NOTICES"
   ],
   "sideEffects": [
     "*.css"