@mhmo91/schmancy 0.10.41 → 0.10.43

package/custom-elements.json

@@ -214,37 +214,25 @@
       "attributes": [
         {
           "name": "color",
-          "description": "The color variant of the badge",
+          "description": "The semantic color of the badge.",
           "type": "BadgeColor",
           "default": "\"primary\""
         },
         {
           "name": "size",
-          "description": "The size of the badge",
+          "description": "The size of the badge.",
           "type": "BadgeSize",
           "default": "\"md\""
         },
         {
           "name": "shape",
-          "description": "The shape of the badge",
+          "description": "The corner shape of the badge.",
           "type": "BadgeShape",
           "default": "\"pill\""
         },
         {
           "name": "outlined",
-          "description": "Whether the badge has an outlined style",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "icon",
-          "description": "Custom icon name to display (if no icon slot is provided)",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "pulse",
-          "description": "Whether to make the badge pulse to draw attention",
+          "description": "Outlined style: transparent fill, the color's strong tone for text and border.",
           "type": "boolean",
           "default": "false"
         }
@@ -258,42 +246,28 @@
         {
           "name": "color",
           "attribute": "color",
-          "description": "The color variant of the badge",
+          "description": "The semantic color of the badge.",
           "type": "BadgeColor",
           "default": "\"primary\""
         },
         {
           "name": "size",
           "attribute": "size",
-          "description": "The size of the badge",
+          "description": "The size of the badge.",
           "type": "BadgeSize",
           "default": "\"md\""
         },
         {
           "name": "shape",
           "attribute": "shape",
-          "description": "The shape of the badge",
+          "description": "The corner shape of the badge.",
           "type": "BadgeShape",
           "default": "\"pill\""
         },
         {
           "name": "outlined",
           "attribute": "outlined",
-          "description": "Whether the badge has an outlined style",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "icon",
-          "attribute": "icon",
-          "description": "Custom icon name to display (if no icon slot is provided)",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "pulse",
-          "attribute": "pulse",
-          "description": "Whether to make the badge pulse to draw attention",
+          "description": "Outlined style: transparent fill, the color's strong tone for text and border.",
           "type": "boolean",
           "default": "false"
         }
@@ -301,11 +275,7 @@
       "slots": [
         {
           "name": "",
-          "description": "The content of the badge (text or HTML)"
-        },
-        {
-          "name": "icon",
-          "description": "Optional icon to display before the content"
+          "description": "The content of the badge (text or short HTML)"
         }
       ],
       "cssParts": [
@@ -316,10 +286,6 @@
         {
           "name": "content",
           "description": "The content container"
-        },
-        {
-          "name": "icon",
-          "description": "The icon container"
         }
       ]
     },
@@ -329,37 +295,25 @@
       "attributes": [
         {
           "name": "color",
-          "description": "The color variant of the badge",
+          "description": "The semantic color of the badge.",
           "type": "BadgeColor",
           "default": "\"primary\""
         },
         {
           "name": "size",
-          "description": "The size of the badge",
+          "description": "The size of the badge.",
           "type": "BadgeSize",
           "default": "\"md\""
         },
         {
           "name": "shape",
-          "description": "The shape of the badge",
+          "description": "The corner shape of the badge.",
           "type": "BadgeShape",
           "default": "\"pill\""
         },
         {
           "name": "outlined",
-          "description": "Whether the badge has an outlined style",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "icon",
-          "description": "Custom icon name to display (if no icon slot is provided)",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "pulse",
-          "description": "Whether to make the badge pulse to draw attention",
+          "description": "Outlined style: transparent fill, the color's strong tone for text and border.",
           "type": "boolean",
           "default": "false"
         }
@@ -373,42 +327,28 @@
         {
           "name": "color",
           "attribute": "color",
-          "description": "The color variant of the badge",
+          "description": "The semantic color of the badge.",
           "type": "BadgeColor",
           "default": "\"primary\""
         },
         {
           "name": "size",
           "attribute": "size",
-          "description": "The size of the badge",
+          "description": "The size of the badge.",
           "type": "BadgeSize",
           "default": "\"md\""
         },
         {
           "name": "shape",
           "attribute": "shape",
-          "description": "The shape of the badge",
+          "description": "The corner shape of the badge.",
           "type": "BadgeShape",
           "default": "\"pill\""
         },
         {
           "name": "outlined",
           "attribute": "outlined",
-          "description": "Whether the badge has an outlined style",
-          "type": "boolean",
-          "default": "false"
-        },
-        {
-          "name": "icon",
-          "attribute": "icon",
-          "description": "Custom icon name to display (if no icon slot is provided)",
-          "type": "string",
-          "default": "\"\""
-        },
-        {
-          "name": "pulse",
-          "attribute": "pulse",
-          "description": "Whether to make the badge pulse to draw attention",
+          "description": "Outlined style: transparent fill, the color's strong tone for text and border.",
           "type": "boolean",
           "default": "false"
         }
@@ -416,11 +356,7 @@
       "slots": [
         {
           "name": "",
-          "description": "The content of the badge (text or HTML)"
-        },
-        {
-          "name": "icon",
-          "description": "Optional icon to display before the content"
+          "description": "The content of the badge (text or short HTML)"
         }
       ],
       "cssParts": [
@@ -431,10 +367,6 @@
         {
           "name": "content",
           "description": "The content container"
-        },
-        {
-          "name": "icon",
-          "description": "The icon container"
         }
       ]
     },
@@ -593,7 +525,7 @@
         {
           "name": "size",
           "description": "Size of the spinner - M3 aligned tokens or numeric Tailwind units\nTokens: 'xxs' (12px), 'xs' (16px), 'sm' (20px), 'md' (24px), 'lg' (32px)\nNumeric: Tailwind units where each unit = 4px (e.g., 6 = 24px)",
-          "type": "number | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "number | \"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         },
         {
@@ -617,7 +549,7 @@
           "name": "size",
           "attribute": "size",
           "description": "Size of the spinner - M3 aligned tokens or numeric Tailwind units\nTokens: 'xxs' (12px), 'xs' (16px), 'sm' (20px), 'md' (24px), 'lg' (32px)\nNumeric: Tailwind units where each unit = 4px (e.g., 6 = 24px)",
-          "type": "number | \"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "number | \"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         },
         {
@@ -783,7 +715,7 @@
         {
           "name": "size",
           "description": "The size of the icon.",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\" | \"xl\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\" | \"xl\"",
           "default": "\"'md'\""
         },
         {
@@ -841,7 +773,7 @@
           "name": "size",
           "attribute": "size",
           "description": "The size of the icon.",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\" | \"xl\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\" | \"xl\"",
           "default": "\"'md'\""
         },
         {
@@ -915,6 +847,193 @@
         }
       ]
     },
+    {
+      "name": "schmancy-calendar",
+      "path": "./src/calendar/calendar.ts",
+      "description": "A presentational calendar primitive with continuous vertical month-scroll.\nSupports single-date and date-range selection. No form-association.",
+      "attributes": [
+        {
+          "name": "mode",
+          "type": "\"single\" | \"range\"",
+          "default": "\"single\""
+        },
+        {
+          "name": "type",
+          "type": "\"date\" | \"datetime-local\"",
+          "default": "\"date\""
+        },
+        {
+          "name": "value",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "start",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "end",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "min",
+          "type": "string | undefined"
+        },
+        {
+          "name": "max",
+          "type": "string | undefined"
+        },
+        {
+          "name": "month",
+          "type": "string | undefined"
+        },
+        {
+          "name": "locale",
+          "description": "BCP-47 locale tag; week-start derived from it. Stored as `calLocale` to avoid conflicting with the base-class `locale` getter.",
+          "type": "string | undefined"
+        },
+        {
+          "name": "disabled",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "readonly",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "properties": [
+        {
+          "name": "styles",
+          "type": "CSSResult[]",
+          "default": "[null]"
+        },
+        {
+          "name": "mode",
+          "attribute": "mode",
+          "type": "\"single\" | \"range\"",
+          "default": "\"single\""
+        },
+        {
+          "name": "type",
+          "attribute": "type",
+          "type": "\"date\" | \"datetime-local\"",
+          "default": "\"date\""
+        },
+        {
+          "name": "value",
+          "attribute": "value",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "start",
+          "attribute": "start",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "end",
+          "attribute": "end",
+          "type": "string | null | undefined"
+        },
+        {
+          "name": "min",
+          "attribute": "min",
+          "type": "string | undefined"
+        },
+        {
+          "name": "max",
+          "attribute": "max",
+          "type": "string | undefined"
+        },
+        {
+          "name": "month",
+          "attribute": "month",
+          "type": "string | undefined"
+        },
+        {
+          "name": "calLocale",
+          "attribute": "locale",
+          "description": "BCP-47 locale tag; week-start derived from it. Stored as `calLocale` to avoid conflicting with the base-class `locale` getter.",
+          "type": "string | undefined"
+        },
+        {
+          "name": "disabled",
+          "attribute": "disabled",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "readonly",
+          "attribute": "readonly",
+          "type": "boolean",
+          "default": "false"
+        }
+      ],
+      "events": [
+        {
+          "name": "input",
+          "description": "Every provisional change (incl. range hover-preview)"
+        },
+        {
+          "name": "change",
+          "description": "Committed change: single click | second range endpoint | clear"
+        },
+        {
+          "name": "navigate",
+          "description": "Dominant in-view month changed while scrolling"
+        }
+      ],
+      "cssParts": [
+        {
+          "name": "scroll",
+          "description": "The scrollable container"
+        },
+        {
+          "name": "month-label",
+          "description": "Sticky month/year label"
+        },
+        {
+          "name": "weekday",
+          "description": "Weekday header cell"
+        },
+        {
+          "name": "grid",
+          "description": "Day grid for a month"
+        },
+        {
+          "name": "day",
+          "description": "Individual day cell"
+        },
+        {
+          "name": "day-selected",
+          "description": "A selected day (single mode, or both endpoints)"
+        },
+        {
+          "name": "day-range-start",
+          "description": "Range start day"
+        },
+        {
+          "name": "day-range-end",
+          "description": "Range end day"
+        },
+        {
+          "name": "day-in-range",
+          "description": "Day inside the selected range (exclusive of endpoints)"
+        },
+        {
+          "name": "day-preview",
+          "description": "Day inside the hover-preview range"
+        },
+        {
+          "name": "day-today",
+          "description": "Today's date"
+        },
+        {
+          "name": "day-disabled",
+          "description": "Disabled (out-of-bounds) day"
+        }
+      ]
+    },
     {
       "name": "schmancy-card-action",
       "path": "./src/card/actions.ts",
@@ -1280,7 +1399,7 @@
     {
       "name": "schmancy-date-range-inline",
       "path": "./src/date-range-inline/date-range-inline.ts",
-      "description": "Smart inline date range picker that handles all the heavy lifting.\r\nAuto-corrects invalid ranges, provides smart defaults, and validates dates.",
+      "description": "Smart inline date range picker that handles all the heavy lifting.\nAuto-corrects invalid ranges, provides smart defaults, and validates dates.",
       "attributes": [
         {
           "name": "type",
@@ -1594,12 +1713,7 @@
         {
           "name": "type",
           "type": "string",
-          "default": "\"solid\""
-        },
-        {
-          "name": "rounded",
-          "type": "string",
-          "default": "\"all\""
+          "default": "\"containerLowest\""
         }
       ]
     },
@@ -1819,7 +1933,7 @@
         {
           "name": "type",
           "type": "TSurfaceColor",
-          "default": "\"solid\""
+          "default": "\"containerLowest\""
         }
       ],
       "properties": [
@@ -1832,7 +1946,7 @@
           "name": "type",
           "attribute": "type",
           "type": "TSurfaceColor",
-          "default": "\"solid\""
+          "default": "\"containerLowest\""
         },
         {
           "name": "isOpen",
@@ -2379,7 +2493,7 @@
         {
           "name": "size",
           "description": "M3-aligned sizes: 24dp (xxs) → 32dp (xs) → 40dp (sm) → 48dp (md) → 56dp (lg).",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         }
       ],
@@ -2401,7 +2515,7 @@
           "name": "size",
           "attribute": "size",
           "description": "M3-aligned sizes: 24dp (xxs) → 32dp (xs) → 40dp (sm) → 48dp (md) → 56dp (lg).",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         }
       ],
@@ -2997,7 +3111,7 @@
     {
       "name": "schmancy-date-range-dialog",
       "path": "./src/form/fields/date-range/date-range-dialog.ts",
-      "description": "Dialog content component for date range selection\n\nRedesigned with chip-based horizontal flow layout:\n- Quick Select: Today, Yesterday, This Week, This Month\n- Days: Last 7/14/30/60/90 Days\n- Periods: Last Week, Last Month, Last Quarter, Last Year\n- Year to Date: This Week, This Month, This Quarter, This Year, YTD\n- Custom Range: Manual date inputs at the bottom",
+      "description": "Picker panel for `<schmancy-date-range>`.\n\nLayout: sticky chip quick-rail → continuous-scroll calendar → secondary typed path.\nEmits composed events that `<schmancy-date-range>` bridges into its own\n`input`/`change` events.",
       "attributes": [
         {
           "name": "type",
@@ -3005,30 +3119,28 @@
           "default": "\"date\""
         },
         {
-          "name": "dateFrom",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"From\",\"value\":\"\"}"
+          "name": "start",
+          "type": "string | null"
         },
         {
-          "name": "dateTo",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"To\",\"value\":\"\"}"
+          "name": "end",
+          "type": "string | null"
         },
         {
-          "name": "minDate",
+          "name": "min",
           "type": "string | undefined"
         },
         {
-          "name": "maxDate",
+          "name": "max",
           "type": "string | undefined"
         },
         {
-          "name": "activePreset",
+          "name": "preset",
           "type": "string | null"
         },
         {
-          "name": "presetCategories",
-          "type": "PresetCategory[]",
+          "name": "presets",
+          "type": "DateRangeDialogPreset[]",
           "default": "[]"
         }
       ],
@@ -3045,58 +3157,56 @@
           "default": "\"date\""
         },
         {
-          "name": "dateFrom",
-          "attribute": "dateFrom",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"From\",\"value\":\"\"}"
+          "name": "start",
+          "attribute": "start",
+          "type": "string | null"
         },
         {
-          "name": "dateTo",
-          "attribute": "dateTo",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"To\",\"value\":\"\"}"
+          "name": "end",
+          "attribute": "end",
+          "type": "string | null"
         },
         {
-          "name": "minDate",
-          "attribute": "minDate",
+          "name": "min",
+          "attribute": "min",
           "type": "string | undefined"
         },
         {
-          "name": "maxDate",
-          "attribute": "maxDate",
+          "name": "max",
+          "attribute": "max",
           "type": "string | undefined"
         },
         {
-          "name": "activePreset",
-          "attribute": "activePreset",
+          "name": "preset",
+          "attribute": "preset",
           "type": "string | null"
         },
         {
-          "name": "presetCategories",
-          "attribute": "presetCategories",
-          "type": "PresetCategory[]",
+          "name": "presets",
+          "attribute": "presets",
+          "type": "DateRangeDialogPreset[]",
           "default": "[]"
         }
       ],
       "events": [
         {
-          "name": "date-change"
+          "name": "calendar-input",
+          "description": "Provisional sweep from the calendar   { start, end }"
         },
         {
-          "name": "preset-select"
+          "name": "calendar-change",
+          "description": "Committed endpoint from the calendar   { start, end }"
         },
         {
-          "name": "announce"
-        },
-        {
-          "name": "apply-dates"
+          "name": "preset-select",
+          "description": "A chip was clicked                     { id, label, start, end }"
         }
       ]
     },
     {
       "name": "schmancy-date-range",
       "path": "./src/form/fields/date-range/date-range.ts",
-      "description": "A date range selector that supports presets and manual date input.",
+      "description": "A date range selector composing `<schmancy-calendar mode=\"range\">` with a\nsticky preset chip quick-rail and a secondary typed-entry path.\n\nPublic API: flat ISO `start`/`end`, `preset` read-back, `presets` array.\nFormData: `${name}.start` / `${name}.end` (empty endpoint omitted).",
       "attributes": [
         {
           "name": "type",
@@ -3104,30 +3214,29 @@
           "default": "\"date\""
         },
         {
-          "name": "dateFrom",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"From\",\"value\":\"\"}"
+          "name": "start",
+          "type": "string | null"
         },
         {
-          "name": "dateTo",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"To\",\"value\":\"\"}"
+          "name": "end",
+          "type": "string | null"
         },
         {
-          "name": "minDate",
-          "type": "string | undefined"
+          "name": "presets",
+          "type": "DateRangeDialogPreset[]",
+          "default": "\"buildDefaultPresets()\""
         },
         {
-          "name": "maxDate",
-          "type": "string | undefined"
+          "name": "preset",
+          "description": "Selected preset id; null = custom range. Reflects to attribute.",
+          "type": "string | null"
         },
         {
-          "name": "customPresets",
-          "type": "{ label: string; dateFrom: string; dateTo: string; }[]",
-          "default": "[]"
+          "name": "min",
+          "type": "string | undefined"
         },
         {
-          "name": "format",
+          "name": "max",
           "type": "string | undefined"
         },
         {
@@ -3146,7 +3255,7 @@
         },
         {
           "name": "collapse",
-          "description": "When true, collapses to just an icon button on mobile screens",
+          "description": "Collapses to an icon-only button on narrow viewports.",
           "type": "boolean",
           "default": "false"
         }
@@ -3159,36 +3268,35 @@
           "default": "\"date\""
         },
         {
-          "name": "dateFrom",
-          "attribute": "dateFrom",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"From\",\"value\":\"\"}"
+          "name": "start",
+          "attribute": "start",
+          "type": "string | null"
         },
         {
-          "name": "dateTo",
-          "attribute": "dateTo",
-          "type": "{ label: string; value: string; }",
-          "default": "{\"label\":\"To\",\"value\":\"\"}"
+          "name": "end",
+          "attribute": "end",
+          "type": "string | null"
         },
         {
-          "name": "minDate",
-          "attribute": "minDate",
-          "type": "string | undefined"
+          "name": "presets",
+          "attribute": "presets",
+          "type": "DateRangeDialogPreset[]",
+          "default": "\"buildDefaultPresets()\""
         },
         {
-          "name": "maxDate",
-          "attribute": "maxDate",
-          "type": "string | undefined"
+          "name": "preset",
+          "attribute": "preset",
+          "description": "Selected preset id; null = custom range. Reflects to attribute.",
+          "type": "string | null"
         },
         {
-          "name": "customPresets",
-          "attribute": "customPresets",
-          "type": "{ label: string; dateFrom: string; dateTo: string; }[]",
-          "default": "[]"
+          "name": "min",
+          "attribute": "min",
+          "type": "string | undefined"
         },
         {
-          "name": "format",
-          "attribute": "format",
+          "name": "max",
+          "attribute": "max",
           "type": "string | undefined"
         },
         {
@@ -3211,7 +3319,7 @@
         {
           "name": "collapse",
           "attribute": "collapse",
-          "description": "When true, collapses to just an icon button on mobile screens",
+          "description": "Collapses to an icon-only button on narrow viewports.",
           "type": "boolean",
           "default": "false"
         },
@@ -3221,12 +3329,16 @@
         }
       ],
       "events": [
+        {
+          "name": "input",
+          "description": "Provisional sweep preview  { start, end }"
+        },
         {
           "name": "change",
-          "description": "Fired when the date range changes with dateFrom and dateTo values"
+          "description": "Committed range change      { start, end, preset }"
         },
         {
-          "name": "beforeopen"
+          "name": "close"
         }
       ]
     },
@@ -4032,7 +4144,7 @@
       "attributes": [
         {
           "name": "size",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         },
         {
@@ -4067,7 +4179,7 @@
         {
           "name": "size",
           "attribute": "size",
-          "type": "\"xs\" | \"sm\" | \"md\" | \"lg\" | \"xxs\"",
+          "type": "\"xs\" | \"sm\" | \"md\" | \"xxs\" | \"lg\"",
           "default": "\"md\""
         },
         {
@@ -4482,7 +4594,7 @@
         {
           "name": "styles",
           "type": "CSSResult",
-          "default": "\"css`\\n\\t\\t:host { display: block; }\\n\\t`\""
+          "default": "\"css`\\n\\t\\t:host {\\n\\t\\t\\tdisplay: block;\\n\\t\\t}\\n\\t`\""
         },
         {
           "name": "tagName",
@@ -6693,7 +6805,7 @@
     {
       "name": "schmancy-surface",
       "path": "./src/surface/surface.ts",
-      "description": "`<schmancy-surface>` component\n\nStyled container that supports rounding, elevation, and background/text color variants.\nSizing is the consumer's responsibility — use Tailwind utilities (`class=\"w-full h-full\"`)\non the element directly.\n\nSurfaceMixin automatically provides surfaceStyles CSS.",
+      "description": "`<schmancy-surface>` component\n\nColor-variant container that paints a background and establishes the inherited\ntext color for descendants. Corner radius, shadow depth, and cursor behavior\nare the consumer's responsibility — apply stock Tailwind classes directly on\nthe element.\n\nSizing is the consumer's responsibility — use Tailwind utilities\n(`class=\"w-full h-full\"`) on the element directly.",
       "attributes": [
         {
           "name": "type",