@cds/core 5.6.1 → 6.0.0-next.0

package/custom-elements.legacy.json

@@ -1435,6 +1435,166 @@
         }
       ]
     },
+    {
+      "name": "cds-dropdown",
+      "path": "./dropdown/dropdown.element.d.ts",
+      "description": "Dropdowns are...\n\n```typescript\nimport '@cds/core/dropdown/register.js';\n```\n\n```html\n<cds-dropdown>...</cds-dropdown>\n```",
+      "events": [
+        {
+          "name": "closeChange",
+          "description": "Notify user when close event has occurred"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot for the content inside the popup's panel"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--active-corner-border-radius"
+        },
+        {
+          "name": "--background"
+        },
+        {
+          "name": "--backdrop-background"
+        },
+        {
+          "name": "--layered-backdrop-background"
+        },
+        {
+          "name": "--border-color"
+        },
+        {
+          "name": "--border-radius"
+        },
+        {
+          "name": "--border-width"
+        },
+        {
+          "name": "--box-shadow"
+        },
+        {
+          "name": "--close-button-offset"
+        },
+        {
+          "name": "--color"
+        },
+        {
+          "name": "--min-height"
+        },
+        {
+          "name": "--min-width"
+        },
+        {
+          "name": "--max-height"
+        },
+        {
+          "name": "--max-width"
+        },
+        {
+          "name": "--mobile-max-height"
+        },
+        {
+          "name": "--overflow",
+          "description": "sets overflow x and y values respectively"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--animation-duration"
+        },
+        {
+          "name": "--animation-easing"
+        }
+      ]
+    },
+    {
+      "name": "cds-dropdown",
+      "path": "./dropdown/register.d.ts",
+      "description": "Dropdowns are...\n\n```typescript\nimport '@cds/core/dropdown/register.js';\n```\n\n```html\n<cds-dropdown>...</cds-dropdown>\n```",
+      "events": [
+        {
+          "name": "closeChange",
+          "description": "Notify user when close event has occurred"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot for the content inside the popup's panel"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--active-corner-border-radius"
+        },
+        {
+          "name": "--background"
+        },
+        {
+          "name": "--backdrop-background"
+        },
+        {
+          "name": "--layered-backdrop-background"
+        },
+        {
+          "name": "--border-color"
+        },
+        {
+          "name": "--border-radius"
+        },
+        {
+          "name": "--border-width"
+        },
+        {
+          "name": "--box-shadow"
+        },
+        {
+          "name": "--close-button-offset"
+        },
+        {
+          "name": "--color"
+        },
+        {
+          "name": "--min-height"
+        },
+        {
+          "name": "--min-width"
+        },
+        {
+          "name": "--max-height"
+        },
+        {
+          "name": "--max-width"
+        },
+        {
+          "name": "--mobile-max-height"
+        },
+        {
+          "name": "--overflow",
+          "description": "sets overflow x and y values respectively"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--animation-duration"
+        },
+        {
+          "name": "--animation-easing"
+        }
+      ]
+    },
     {
       "name": "cds-file",
       "path": "./file/file.element.d.ts",
@@ -2318,11 +2478,19 @@
           "name": "cdsMotionChange"
         },
         {
-          "name": "ariaModal",
-          "type": "string"
+          "name": "closable",
+          "type": "boolean"
         },
         {
-          "name": "role",
+          "name": "ignoreFocusTrap",
+          "type": "boolean"
+        },
+        {
+          "name": "i18n",
+          "type": "{ closeButtonAriaLabel: string; contentStart: string; contentEnd: string; }"
+        },
+        {
+          "name": "ariaModal",
           "type": "string"
         }
       ],
@@ -2367,11 +2535,19 @@
           "name": "cdsMotionChange"
         },
         {
-          "name": "ariaModal",
-          "type": "string"
+          "name": "closable",
+          "type": "boolean"
         },
         {
-          "name": "role",
+          "name": "ignoreFocusTrap",
+          "type": "boolean"
+        },
+        {
+          "name": "i18n",
+          "type": "{ closeButtonAriaLabel: string; contentStart: string; contentEnd: string; }"
+        },
+        {
+          "name": "ariaModal",
           "type": "string"
         }
       ],
@@ -2495,6 +2671,332 @@
         }
       ]
     },
+    {
+      "name": "cds-internal-pointer",
+      "path": "./internal-components/popup/pointer.element.d.ts",
+      "description": "```typescript\nimport '@cds/core/internal-components/popup/register.js';\n```\n\n```html\n<cds-internal-pointer></cds-internal-pointer>\n```",
+      "properties": [
+        {
+          "name": "axisAlign",
+          "type": "\"start\" | \"center\" | \"end\""
+        },
+        {
+          "name": "type",
+          "description": "The \"angle\" pointer type is the right-angle triangle that we are used to seeing with signposts.\nThe \"default\" pointer type is an equilateral triangle like we see with the pop-outs in the\ndatagrid single row actions.",
+          "type": "('angle' | 'default')"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot to override the default pointer SVG"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--pointer-fill"
+        },
+        {
+          "name": "--pointer-outline"
+        },
+        {
+          "name": "--transform"
+        }
+      ]
+    },
+    {
+      "name": "cds-internal-popup",
+      "path": "./internal-components/popup/popup.element.d.ts",
+      "description": "```typescript\nimport '@cds/core/internal-components/popup/register.js';\n```\n\n```html\n<cds-internal-popup>\n  <section cds-layout=\"vertical align:horizontal-stretch\">\n    <div cds-layout=\"vertical pad:md gap:md\">\n      <h2 cds-text=\"display\">A Title</h2>\n      <div>\n        <p cds-text=\"body\">\n          Content inside a generic popup.\n        </p>\n      </div>\n    </div>\n  </section>\n</cds-internal-popup>\n```",
+      "properties": [
+        {
+          "name": "i18n",
+          "type": "{ closeButtonAriaLabel: string; contentStart: string; contentEnd: string; }"
+        },
+        {
+          "name": "cdsMotion",
+          "type": "string"
+        },
+        {
+          "name": "cdsMotionChange"
+        },
+        {
+          "name": "container",
+          "type": "HTMLElement"
+        },
+        {
+          "name": "anchor",
+          "description": "Accepts both an HTMLElement and a string",
+          "type": "string | HTMLElement"
+        },
+        {
+          "name": "anchorAlign"
+        },
+        {
+          "name": "mainAxisOffset",
+          "type": "number"
+        },
+        {
+          "name": "crossAxisOffset",
+          "type": "number"
+        },
+        {
+          "name": "orientation",
+          "type": "string"
+        },
+        {
+          "name": "closable",
+          "description": "If false, the dropdown will not show a close button ever.\nIf true, it will always show a close button.\nIf undefined, it will only show a close button when responsive. a11y expects a close button when responsive.",
+          "type": "boolean"
+        },
+        {
+          "name": "pointerAlign"
+        },
+        {
+          "name": "pointer",
+          "type": "CdsInternalPointer"
+        }
+      ],
+      "events": [
+        {
+          "name": "closeChange",
+          "description": "Notify user when close event has occurred"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot for the content inside the popup's panel"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--active-corner-border-radius"
+        },
+        {
+          "name": "--background"
+        },
+        {
+          "name": "--backdrop-background"
+        },
+        {
+          "name": "--layered-backdrop-background"
+        },
+        {
+          "name": "--border-color"
+        },
+        {
+          "name": "--border-radius"
+        },
+        {
+          "name": "--border-width"
+        },
+        {
+          "name": "--box-shadow"
+        },
+        {
+          "name": "--close-button-offset"
+        },
+        {
+          "name": "--color"
+        },
+        {
+          "name": "--min-height"
+        },
+        {
+          "name": "--min-width"
+        },
+        {
+          "name": "--max-height"
+        },
+        {
+          "name": "--max-width"
+        },
+        {
+          "name": "--mobile-max-height"
+        },
+        {
+          "name": "--overflow",
+          "description": "sets overflow x and y values respectively"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--animation-duration"
+        },
+        {
+          "name": "--animation-easing",
+          "description": "KNOWN ISSUE: Safari jumps through the exit animation but only when the ESC key is pressed."
+        }
+      ]
+    },
+    {
+      "name": "cds-internal-popup",
+      "path": "./internal-components/popup/register.d.ts",
+      "description": "```typescript\nimport '@cds/core/internal-components/popup/register.js';\n```\n\n```html\n<cds-internal-popup>\n  <section cds-layout=\"vertical align:horizontal-stretch\">\n    <div cds-layout=\"vertical pad:md gap:md\">\n      <h2 cds-text=\"display\">A Title</h2>\n      <div>\n        <p cds-text=\"body\">\n          Content inside a generic popup.\n        </p>\n      </div>\n    </div>\n  </section>\n</cds-internal-popup>\n```",
+      "properties": [
+        {
+          "name": "i18n",
+          "type": "{ closeButtonAriaLabel: string; contentStart: string; contentEnd: string; }"
+        },
+        {
+          "name": "cdsMotion",
+          "type": "string"
+        },
+        {
+          "name": "cdsMotionChange"
+        },
+        {
+          "name": "container",
+          "type": "HTMLElement"
+        },
+        {
+          "name": "anchor",
+          "description": "Accepts both an HTMLElement and a string",
+          "type": "string | HTMLElement"
+        },
+        {
+          "name": "anchorAlign"
+        },
+        {
+          "name": "mainAxisOffset",
+          "type": "number"
+        },
+        {
+          "name": "crossAxisOffset",
+          "type": "number"
+        },
+        {
+          "name": "orientation",
+          "type": "string"
+        },
+        {
+          "name": "closable",
+          "description": "If false, the dropdown will not show a close button ever.\nIf true, it will always show a close button.\nIf undefined, it will only show a close button when responsive. a11y expects a close button when responsive.",
+          "type": "boolean"
+        },
+        {
+          "name": "pointerAlign"
+        },
+        {
+          "name": "pointer",
+          "type": "CdsInternalPointer"
+        }
+      ],
+      "events": [
+        {
+          "name": "closeChange",
+          "description": "Notify user when close event has occurred"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot for the content inside the popup's panel"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--active-corner-border-radius"
+        },
+        {
+          "name": "--background"
+        },
+        {
+          "name": "--backdrop-background"
+        },
+        {
+          "name": "--layered-backdrop-background"
+        },
+        {
+          "name": "--border-color"
+        },
+        {
+          "name": "--border-radius"
+        },
+        {
+          "name": "--border-width"
+        },
+        {
+          "name": "--box-shadow"
+        },
+        {
+          "name": "--close-button-offset"
+        },
+        {
+          "name": "--color"
+        },
+        {
+          "name": "--min-height"
+        },
+        {
+          "name": "--min-width"
+        },
+        {
+          "name": "--max-height"
+        },
+        {
+          "name": "--max-width"
+        },
+        {
+          "name": "--mobile-max-height"
+        },
+        {
+          "name": "--overflow",
+          "description": "sets overflow x and y values respectively"
+        },
+        {
+          "name": "--height"
+        },
+        {
+          "name": "--width"
+        },
+        {
+          "name": "--animation-duration"
+        },
+        {
+          "name": "--animation-easing",
+          "description": "KNOWN ISSUE: Safari jumps through the exit animation but only when the ESC key is pressed."
+        }
+      ]
+    },
+    {
+      "name": "cds-internal-pointer",
+      "path": "./internal-components/popup/register.d.ts",
+      "description": "```typescript\nimport '@cds/core/internal-components/popup/register.js';\n```\n\n```html\n<cds-internal-pointer></cds-internal-pointer>\n```",
+      "properties": [
+        {
+          "name": "axisAlign",
+          "type": "\"start\" | \"center\" | \"end\""
+        },
+        {
+          "name": "type",
+          "description": "The \"angle\" pointer type is the right-angle triangle that we are used to seeing with signposts.\nThe \"default\" pointer type is an equilateral triangle like we see with the pop-outs in the\ndatagrid single row actions.",
+          "type": "('angle' | 'default')"
+        }
+      ],
+      "slots": [
+        {
+          "name": "",
+          "description": "Content slot to override the default pointer SVG"
+        }
+      ],
+      "cssProperties": [
+        {
+          "name": "--pointer-fill"
+        },
+        {
+          "name": "--pointer-outline"
+        },
+        {
+          "name": "--transform"
+        }
+      ]
+    },
     {
       "name": "cds-internal-visual-checkbox",
       "path": "./internal-components/visual-checkbox/register.d.ts",
@@ -2547,10 +3049,26 @@
           "description": "If false, the modal will not render the close button.",
           "type": "boolean"
         },
+        {
+          "name": "hidden",
+          "type": "boolean"
+        },
         {
           "name": "size",
           "description": "Sets the overall height and width of the modal and icon based on value",
           "type": "\"default\" | \"sm\" | \"lg\" | \"xl\""
+        },
+        {
+          "name": "content",
+          "type": "HTMLElement"
+        },
+        {
+          "name": "modalHeader",
+          "type": "CdsModalHeader"
+        },
+        {
+          "name": "modalFooter",
+          "type": "CdsModalActions"
         }
       ],
       "events": [
@@ -2648,10 +3166,26 @@
           "description": "If false, the modal will not render the close button.",
           "type": "boolean"
         },
+        {
+          "name": "hidden",
+          "type": "boolean"
+        },
         {
           "name": "size",
           "description": "Sets the overall height and width of the modal and icon based on value",
           "type": "\"default\" | \"sm\" | \"lg\" | \"xl\""
+        },
+        {
+          "name": "content",
+          "type": "HTMLElement"
+        },
+        {
+          "name": "modalHeader",
+          "type": "CdsModalHeader"
+        },
+        {
+          "name": "modalFooter",
+          "type": "CdsModalActions"
         }
       ],
       "events": [
@@ -2929,6 +3463,14 @@
       "slots": [
         {
           "name": ""
+        },
+        {
+          "name": "cds-navigation-substart",
+          "description": "project content below the navigation toggle button"
+        },
+        {
+          "name": "cds-navigation-end",
+          "description": "project content below the scrollable section"
         }
       ],
       "cssProperties": [
@@ -3006,6 +3548,14 @@
       "slots": [
         {
           "name": ""
+        },
+        {
+          "name": "cds-navigation-substart",
+          "description": "project content below the navigation toggle button"
+        },
+        {
+          "name": "cds-navigation-end",
+          "description": "project content below the scrollable section"
         }
       ],
       "cssProperties": [

package/divider/divider.element.scss.js

@@ -1,2 +1,2 @@
-import{css as r}from"lit";var a=r`:host{--color:var(--cds-alias-object-border-color, var(--cds-global-color-construction-200, #cbd4d8));--size:var(--cds-alias-object-border-width-100, calc((1 / var(--cds-global-base, 20)) * 1rem));--padding:0;display:block;width:100%;padding:var(--padding)}.private-host{height:var(--size);background:var(--color)}:host([orientation=vertical]){align-self:stretch;height:inherit;width:var(--size)}:host([orientation*=vertical]) .private-host{height:100%;width:var(--size)}`;export default a;
+import{css as t}from"lit";var i=t`:host{--color:var(--cds-alias-object-border-color, var(--cds-global-color-construction-200, #cbd4d8));--size:var(--cds-alias-object-border-width-100, calc((1 / var(--cds-global-base, 20)) * 1rem));--padding:0;display:block;width:100%;padding:var(--padding)}.private-host{height:var(--size);background:var(--color)}:host([orientation=vertical]){-ms-flex-item-align:stretch;align-self:stretch;height:inherit;width:var(--size)}:host([orientation*=vertical]) .private-host{height:100%;width:var(--size)}`;export default i;
 //# sourceMappingURL=divider.element.scss.js.map

package/dropdown/dropdown.element.d.ts

@@ -0,0 +1,39 @@
+import { CdsInternalPopup } from '@cds/core/internal-components/popup';
+/**
+ * Dropdowns are...
+ *
+ * ```typescript
+ * import '@cds/core/dropdown/register.js';
+ * ```
+ *
+ * ```html
+ * <cds-dropdown>...</cds-dropdown>
+ * ```
+ * @beta
+ * @element cds-dropdown
+ * @slot - Content slot for the content inside the popup's panel
+ * @event closeChange - Notify user when close event has occurred
+ * @cssprop --active-corner-border-radius
+ * @cssprop --background
+ * @cssprop --backdrop-background
+ * @cssprop --layered-backdrop-background
+ * @cssprop --border-color
+ * @cssprop --border-radius
+ * @cssprop --border-width
+ * @cssprop --box-shadow
+ * @cssprop --close-button-offset
+ * @cssprop --color
+ * @cssprop --min-height
+ * @cssprop --min-width
+ * @cssprop --max-height
+ * @cssprop --max-width
+ * @cssprop --mobile-max-height
+ * @cssprop --overflow - sets overflow x and y values respectively
+ * @cssprop --height
+ * @cssprop --width
+ * @cssprop --animation-duration
+ * @cssprop --animation-easing
+ *
+ */
+export declare class CdsDropdown extends CdsInternalPopup {
+}

package/dropdown/dropdown.element.js

@@ -0,0 +1,2 @@
+import{CdsInternalPopup as o}from"@cds/core/internal-components/popup";class e extends o{}export{e as CdsDropdown};
+//# sourceMappingURL=dropdown.element.js.map

package/dropdown/dropdown.element.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.element.js","sources":["../../../src/dropdown/dropdown.element.ts"],"sourcesContent":null,"names":["CdsDropdown","CdsInternalPopup"],"mappings":"uEA0CO,MAAMA,UAAoBC"}

package/dropdown/index.d.ts

@@ -0,0 +1 @@
+export * from './dropdown.element.js';

package/dropdown/index.js

@@ -0,0 +1,2 @@
+export{CdsDropdown}from"./dropdown.element.js";import"@cds/core/internal-components/popup";
+//# sourceMappingURL=index.js.map

package/dropdown/register.d.ts

@@ -0,0 +1,6 @@
+import { CdsDropdown } from './dropdown.element.js';
+declare global {
+    interface HTMLElementTagNameMap {
+        'cds-dropdown': CdsDropdown;
+    }
+}

package/dropdown/register.js

@@ -0,0 +1,2 @@
+import{registerElementSafely as o}from"@cds/core/internal";import{CdsDropdown as r}from"./dropdown.element.js";o("cds-dropdown",r);
+//# sourceMappingURL=register.js.map