@cahyo-dimas/freeday 1.53.0 → 2.0.0

package/src/components/tabs.css

@@ -1,5 +1,5 @@
-/* Freeday — Tabs (WAI-ARIA APG) */
-/* position:relative — containing block for out-of-flow content in the tabs (see base.css). */
+/* Freeday. Tabs (WAI-ARIA APG) */
+/* position:relative, containing block for out-of-flow content in the tabs (see base.css). */
 .fdy-tabs__list{position:relative;display:flex;gap:var(--space-1);border-bottom:var(--bw) solid var(--color-border);overflow-x:auto;}
 .fdy-tabs__tab{appearance:none;border:0;background:transparent;cursor:pointer;white-space:nowrap;font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--weight-medium);color:var(--color-text-muted);padding:var(--space-3) var(--space-4);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color var(--dur-fast) var(--ease-standard),border-color var(--dur-fast) var(--ease-standard);}
 .fdy-tabs__tab:hover{color:var(--color-text);}
@@ -7,7 +7,7 @@
 .fdy-tabs__tab:disabled:hover,.fdy-tabs__tab[aria-disabled="true"]:hover{color:var(--color-text-muted);}
 /* `aria-current="page"` is honoured alongside `aria-selected="true"` so the tab look can be used for
    ROUTE-driven sub-navigation (/settings/profile · /settings/billing), where the tabs are real links.
-   A link cannot be `aria-selected` — that is invalid ARIA on an anchor; `aria-current` is the only
+   A link cannot be `aria-selected`, that is invalid ARIA on an anchor; `aria-current` is the only
    correct marker, and it is what a router sets. Use `.fdy-tabs` + `freeday-tabs.js` (roving tabindex,
    a panel per tab) for in-page tabs; use these classes on plain links for routed ones, and
    `.fdy-nav--horizontal` for an application's PRIMARY navigation. */

package/src/components/timeline.css

@@ -1,4 +1,4 @@
-/* Freeday — Timeline (vertical event feed: dot markers on a connector line). Pure CSS. */
+/* Freeday. Timeline (vertical event feed: dot markers on a connector line). Pure CSS. */
 .fdy-timeline{list-style:none;margin:0;padding:0;}
 .fdy-timeline__item{position:relative;padding:0 0 var(--space-5) var(--space-6);border-left:2px solid var(--color-border);}
 .fdy-timeline__item:last-child{border-left-color:transparent;padding-bottom:0;}

package/src/components/timepicker.css

@@ -1,4 +1,4 @@
-/* Freeday — Time picker (input-styled trigger + scrollable time-list popover).
+/* Freeday. Time picker (input-styled trigger + scrollable time-list popover).
  * Built by freeday-timepicker.js from an empty [data-fdy-timepicker] wrapper.
  * Trigger visual mirrors the date picker for a consistent control family. */
 .fdy-timepicker{position:relative;display:inline-block;width:100%;max-width:11rem;}

package/src/components/toast.css

@@ -1,11 +1,11 @@
-/* Freeday — Toast (transient notification) */
+/* Freeday. Toast (transient notification) */
 /* The region is a POPOVER, not merely a high z-index.
-   `.fdy-modal` is a native <dialog> opened with showModal(), which puts it in the TOP LAYER — a
+   `.fdy-modal` is a native <dialog> opened with showModal(), which puts it in the TOP LAYER, a
    layer above the whole z-index universe, so no number here could ever beat it. A toast raised by
    an action taken inside a modal was painted behind that modal's backdrop: dimmed, unreadable, and
    most of it under the dialog itself. `freeday-toast.js` calls showPopover() as each toast is
    added, which puts the region in the top layer too, and last-in wins there.
-   Everything after `pointer-events` is undoing the UA's [popover] defaults — it arrives with
+   Everything after `pointer-events` is undoing the UA's [popover] defaults, it arrives with
    inset:0, auto margins, a border, padding, a Canvas background and overflow:auto, none of which a
    toast stack wants. Where showPopover() is unavailable the element is still an ordinary fixed
    block at z-index 200, which is exactly what it was before. */

package/src/components/tooltip.css

@@ -1,4 +1,4 @@
-/* Freeday — Tooltip (CSS-only, hover/focus) */
+/* Freeday. Tooltip (CSS-only, hover/focus) */
 .fdy-tooltip-wrap{position:relative;display:inline-flex;}
 .fdy-tooltip{position:absolute;bottom:calc(100% + var(--space-2));left:50%;z-index:150;max-width:16rem;padding:var(--space-1) var(--space-2);border-radius:var(--radius-sm);font-size:var(--text-xs);font-weight:var(--weight-medium);line-height:var(--leading-snug);color:var(--color-inverse-text);background:var(--color-inverse-surface);box-shadow:var(--shadow-2);opacity:0;visibility:hidden;pointer-events:none;transform:translateX(-50%) translateY(4px);transition:opacity var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard);}
 .fdy-tooltip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:.3rem solid transparent;border-top-color:var(--color-inverse-surface);}

package/src/components/tree.css

@@ -1,4 +1,4 @@
-/* Freeday — Tree view (hierarchy via nested native <details>: keyboard-toggle, zero-JS).
+/* Freeday. Tree view (hierarchy via nested native <details>: keyboard-toggle, zero-JS).
  * Branches expand/collapse; leaves are plain rows. Chevron + optional folder/file icons. */
 .fdy-tree{list-style:none;margin:0;padding:0;font-size:var(--text-sm);}
 .fdy-tree ul{list-style:none;margin:0;padding-left:var(--space-4);}
@@ -15,7 +15,7 @@
 /* Disabled row (branch summary or leaf): dimmed, no hover, not interactive. */
 .fdy-tree__leaf[aria-disabled="true"],.fdy-tree__branch[aria-disabled="true"] > summary{opacity:.5;cursor:not-allowed;pointer-events:none;}
 
-/* Checkbox variant — a selectable tree (cascading parent/child via freeday-tree.js).
+/* Checkbox variant, a selectable tree (cascading parent/child via freeday-tree.js).
  * A native <input class="fdy-checkbox"> sits at the start of every row; a partially
  * selected branch shows the native :indeterminate dash. The checkbox stops click
  * propagation, so toggling selection never expands/collapses the branch. */

package/tokens/breakpoints.d.ts

@@ -1,8 +1,8 @@
-// Types for tokens/breakpoints.mjs — the JS-side breakpoint scale in px
+// Types for tokens/breakpoints.mjs: the JS-side breakpoint scale in px
 // (mirrors the sm/md/lg/xl utilities in src/components/breakpoints.css).
 export declare const breakpoints: {
   /** Width at which .fdy-app's sidebar turns from off-canvas drawer into a static column.
-   *  Not part of the sm/md/lg/xl ramp — it mirrors app-shell.css and nothing else. */
+   *  Not part of the sm/md/lg/xl ramp; it mirrors app-shell.css and nothing else. */
   nav: number;
   sm: number;
   md: number;

package/tokens/breakpoints.mjs

@@ -1,11 +1,11 @@
-// Freeday breakpoint scale in px — mirrors src/components/breakpoints.css utilities
+// Freeday breakpoint scale in px, mirrors src/components/breakpoints.css utilities
 // (sm/md/lg/xl). CSS @media can't read custom properties, so this is the JS-side
 // source of the scale for matchMedia / app @media alignment.
 //
 // `nav` is not part of the sm/md/lg/xl ramp: it is the width at which .fdy-app switches the
 // sidebar from an off-canvas drawer (below) to a static column (at and above), hard-wired in
-// src/components/app-shell.css. Anything that has to agree with the shell — a matchMedia guard
+// src/components/app-shell.css. Anything that has to agree with the shell, a matchMedia guard
 // deciding whether the nav toggle sets --nav-open or --nav-collapsed, a utility-framework
-// variant — must use THIS number, not md. Aligning such code to md (960) leaves 721–959px
+// variant, must use THIS number, not md. Aligning such code to md (960) leaves 721–959px
 // broken: the sidebar is already static while the script still thinks it is an overlay.
 export const breakpoints = { nav: 721, sm: 600, md: 960, lg: 1280, xl: 1920 };

package/tokens/tokens.json

@@ -118,7 +118,7 @@
     "tick": { "$value": "{slate.400}", "$dark": "{slate.600}" }
   },
 
-  "_comment_tone": "General categorical palette — the same 8 validated hues as chart, aliased under a chart-neutral name for avatars, chips, tags, legend swatches (theme-follows via chart's own $dark).",
+  "_comment_tone": "General categorical palette: the same 8 validated hues as chart, aliased under a chart-neutral name for avatars, chips, tags, legend swatches (theme-follows via chart's own $dark).",
   "tone": {
     "1": { "$value": "{chart.1}" },
     "2": { "$value": "{chart.2}" },