npm - @carbon/ibm-products-web-components - Versions diffs - 0.7.0 → 0.8.0-rc.0 - Mend

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
-import { __decorate } from '../../node_modules/tslib/tslib.es6.js';
+import { __decorate } from 'tslib';
 import { LitElement, html } from 'lit';
 import { query, queryAssignedElements, state, property } from 'lit/decorators.js';
 import { prefix, carbonPrefix } from '../../globals/settings.js';
@@ -15,8 +15,8 @@ import { SIDE_PANEL_PLACEMENT, SIDE_PANEL_SIZE } from './defs.js';
 import styles from './side-panel.scss.js';
 import { selectorTabbable } from '@carbon/web-components/es/globals/settings.js';
 import { carbonElement } from '@carbon/web-components/es/globals/decorators/carbon-element.js';
-import ArrowLeft16 from '../../icons/arrow--left/16';
-import Close20 from '../../icons/close/20';
+import ArrowLeft16 from '@carbon/web-components/es/icons/arrow--left/16';
+import Close20 from '@carbon/web-components/es/icons/close/20';
 import { moderate02 } from '@carbon/motion';
 import '@carbon/web-components/es/components/button/index.js';
 import '@carbon/web-components/es/components/button/button-set-base.js';

@@ -7,6 +7,7 @@
 import { vi, describe, it, expect } from 'vitest';
 import { render, html } from 'lit';
+import { SIDE_PANEL_PLACEMENT, SIDE_PANEL_SIZE } from './defs.js';
 /**
  * Copyright IBM Corp. 2024, 2024
@@ -14,7 +15,7 @@ import { render, html } from 'lit';
  * This source code is licensed under the Apache-2.0 license found in the
  * LICENSE file in the root directory of this source tree.
  */
-vi.mock('../../icons/close/20', () => vi.fn().mockReturnValue({}));
+vi.mock('@carbon/icons/lib/close/20', () => vi.fn().mockReturnValue({}));
 const defaultProps = {
     animateTitle: true,
     includeOverlay: true,
@@ -22,10 +23,10 @@ const defaultProps = {
     selectorInitialFocus: '',
     label: '',
     open: true,
-    placement: 'right',
+    placement: SIDE_PANEL_PLACEMENT.RIGHT,
     preventCloseOnClickOutside: false,
     selectorPageContent: '',
-    size: 'md',
+    size: SIDE_PANEL_SIZE.MEDIUM,
     title: 'Side panel title',
 };
 const template = (props = defaultProps) => html `

@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  */
-import { __decorate } from '../../node_modules/tslib/tslib.es6.js';
+import { __decorate } from 'tslib';
 import { LitElement, html } from 'lit';
 import { query, queryAssignedElements, state, property } from 'lit/decorators.js';
 import { prefix, carbonPrefix, selectorTabbable } from '../../globals/settings.js';

@@ -0,0 +1,356 @@
+{
+  "version": "experimental",
+  "tags": [
+    {
+      "name": "c4p-side-panel",
+      "path": "./src/components/side-panel/side-panel.ts",
+      "description": "SidePanel.",
+      "attributes": [
+        {
+          "name": "animate-title",
+          "description": "Determines if the title will animate on scroll",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "close-icon-description",
+          "description": "Sets the close button icon description",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "condensed-actions",
+          "description": "Determines whether the side panel should render the condensed version (affects action buttons primarily)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "current-step",
+          "description": "Sets the current step of the side panel"
+        },
+        {
+          "name": "include-overlay",
+          "description": "Determines whether the side panel should render with an overlay",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "label-text",
+          "description": "Sets the label text which will display above the title text"
+        },
+        {
+          "name": "navigation-back-icon-description",
+          "description": "Sets the icon description for the navigation back icon button",
+          "type": "string",
+          "default": "\"Back\""
+        },
+        {
+          "name": "open",
+          "description": "`true` if the side-panel should be open.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "placement",
+          "description": "SidePanel placement.",
+          "type": "SIDE_PANEL_PLACEMENT",
+          "default": "\"right\""
+        },
+        {
+          "name": "prevent-close-on-click-outside",
+          "description": "Prevent closing on click outside of side-panel",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selector-initial-focus",
+          "description": "The initial location of focus in the side panel"
+        },
+        {
+          "name": "selector-page-content",
+          "description": "Selector for page content, used to push content to side except",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "slide-in",
+          "description": "Determines if this panel slides in",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "title",
+          "description": "Sets the title text"
+        },
+        {
+          "name": "size",
+          "description": "SidePanel size.",
+          "type": "SIDE_PANEL_SIZE",
+          "default": "\"md\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "animateTitle",
+          "attribute": "animate-title",
+          "description": "Determines if the title will animate on scroll",
+          "type": "boolean",
+          "default": "true"
+        },
+        {
+          "name": "closeIconDescription",
+          "attribute": "close-icon-description",
+          "description": "Sets the close button icon description",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "condensedActions",
+          "attribute": "condensed-actions",
+          "description": "Determines whether the side panel should render the condensed version (affects action buttons primarily)",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "currentStep",
+          "attribute": "current-step",
+          "description": "Sets the current step of the side panel"
+        },
+        {
+          "name": "includeOverlay",
+          "attribute": "include-overlay",
+          "description": "Determines whether the side panel should render with an overlay",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "labelText",
+          "attribute": "label-text",
+          "description": "Sets the label text which will display above the title text"
+        },
+        {
+          "name": "navigationBackIconDescription",
+          "attribute": "navigation-back-icon-description",
+          "description": "Sets the icon description for the navigation back icon button",
+          "type": "string",
+          "default": "\"Back\""
+        },
+        {
+          "name": "open",
+          "attribute": "open",
+          "description": "`true` if the side-panel should be open.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "placement",
+          "attribute": "placement",
+          "description": "SidePanel placement.",
+          "type": "SIDE_PANEL_PLACEMENT",
+          "default": "\"right\""
+        },
+        {
+          "name": "preventCloseOnClickOutside",
+          "attribute": "prevent-close-on-click-outside",
+          "description": "Prevent closing on click outside of side-panel",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selectorInitialFocus",
+          "attribute": "selector-initial-focus",
+          "description": "The initial location of focus in the side panel"
+        },
+        {
+          "name": "selectorPageContent",
+          "attribute": "selector-page-content",
+          "description": "Selector for page content, used to push content to side except",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "slideIn",
+          "attribute": "slide-in",
+          "description": "Determines if this panel slides in",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "title",
+          "attribute": "title",
+          "description": "Sets the title text"
+        },
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        },
+        {
+          "name": "size",
+          "attribute": "size",
+          "description": "SidePanel size.",
+          "type": "SIDE_PANEL_SIZE",
+          "default": "\"md\""
+        }
+      ],
+      "events": [
+        {
+          "name": "c4p-side-panel-beingclosed",
+          "description": "The custom event fired before this side-panel is being closed upon a user gesture.\nCancellation of this event stops the user-initiated action of closing this side-panel."
+        },
+        {
+          "name": "c4p-side-panel-closed",
+          "description": "The custom event fired after this side-panel is closed upon a user gesture."
+        },
+        {
+          "name": "c4p-side-panel-navigate-back",
+          "description": "custom event fired when clicking navigate back (available when step > 0)"
+        }
+      ]
+    },
+    {
+      "name": "c4p-tearsheet",
+      "path": "./src/components/tearsheet/tearsheet.ts",
+      "description": "Tearsheet.",
+      "attributes": [
+        {
+          "name": "aria-label",
+          "description": "Optional aria label for the tearsheet",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "close-icon-description",
+          "description": "Sets the close button icon description",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "has-close-icon",
+          "description": "Enable a close icon ('x') in the header area of the tearsheet. By default,\n(when this prop is omitted, or undefined or null) a tearsheet does not\ndisplay a close icon if there are navigation actions (\"transactional\ntearsheet\") and displays one if there are no navigation actions (\"passive\ntearsheet\"), and that behavior can be overridden if required by setting\nthis prop to either true or false.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "influencer-placement",
+          "description": "The placement of the influencer section, 'left' or 'right'.",
+          "type": "TEARSHEET_INFLUENCER_PLACEMENT",
+          "default": "\"right\""
+        },
+        {
+          "name": "influencer-width",
+          "description": "The width of the influencer section, 'narrow' or 'wide'.",
+          "type": "TEARSHEET_INFLUENCER_WIDTH",
+          "default": "\"narrow\""
+        },
+        {
+          "name": "open",
+          "description": "`true` if the tearsheet should be open.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "prevent-close-on-click-outside",
+          "description": "Prevent closing on click outside of tearsheet",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selector-initial-focus",
+          "description": "The initial location of focus in the side panel"
+        },
+        {
+          "name": "width",
+          "description": "The width of the influencer section, 'narrow' or 'wide'.",
+          "type": "TEARSHEET_WIDTH",
+          "default": "\"narrow\""
+        }
+      ],
+      "properties": [
+        {
+          "name": "ariaLabel",
+          "attribute": "aria-label",
+          "description": "Optional aria label for the tearsheet",
+          "type": "string",
+          "default": "\"\""
+        },
+        {
+          "name": "closeIconDescription",
+          "attribute": "close-icon-description",
+          "description": "Sets the close button icon description",
+          "type": "string",
+          "default": "\"Close\""
+        },
+        {
+          "name": "hasCloseIcon",
+          "attribute": "has-close-icon",
+          "description": "Enable a close icon ('x') in the header area of the tearsheet. By default,\n(when this prop is omitted, or undefined or null) a tearsheet does not\ndisplay a close icon if there are navigation actions (\"transactional\ntearsheet\") and displays one if there are no navigation actions (\"passive\ntearsheet\"), and that behavior can be overridden if required by setting\nthis prop to either true or false.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "influencerPlacement",
+          "attribute": "influencer-placement",
+          "description": "The placement of the influencer section, 'left' or 'right'.",
+          "type": "TEARSHEET_INFLUENCER_PLACEMENT",
+          "default": "\"right\""
+        },
+        {
+          "name": "influencerWidth",
+          "attribute": "influencer-width",
+          "description": "The width of the influencer section, 'narrow' or 'wide'.",
+          "type": "TEARSHEET_INFLUENCER_WIDTH",
+          "default": "\"narrow\""
+        },
+        {
+          "name": "open",
+          "attribute": "open",
+          "description": "`true` if the tearsheet should be open.",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "preventCloseOnClickOutside",
+          "attribute": "prevent-close-on-click-outside",
+          "description": "Prevent closing on click outside of tearsheet",
+          "type": "boolean",
+          "default": "false"
+        },
+        {
+          "name": "selectorInitialFocus",
+          "attribute": "selector-initial-focus",
+          "description": "The initial location of focus in the side panel"
+        },
+        {
+          "name": "width",
+          "attribute": "width",
+          "description": "The width of the influencer section, 'narrow' or 'wide'.",
+          "type": "TEARSHEET_WIDTH",
+          "default": "\"narrow\""
+        },
+        {
+          "name": "actionsMultiple",
+          "type": "string",
+          "default": "\"['', 'single', 'double', 'triple'][this._actionsCount]\""
+        },
+        {
+          "name": "styles",
+          "default": "\"styles\""
+        },
+        {
+          "name": "size",
+          "type": "number"
+        }
+      ],
+      "events": [
+        {
+          "name": "c4p-tearsheet-beingclosed",
+          "description": "The custom event fired before this tearsheet is being closed upon a user gesture.\nCancellation of this event stops the user-initiated action of closing this tearsheet."
+        },
+        {
+          "name": "c4p-tearsheet-closed",
+          "description": "The custom event fired after this tearsheet is closed upon a user gesture."
+        }
+      ]
+    }
+  ]
+}

	@@ -1 +1 @@
1	- {"version":3,"file":"side-panel.test.js","sources":["../../../src/components/side-panel/side-panel.test.ts"],"sourcesContent":[null],"names":[],"mappings":"~~;;;;;;;;;;~~AAAA;;;;;AAKG;AAEH,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;~~AAIxE~~,MAAM,YAAY,GAAG;AACnB,IAAA,YAAY,EAAE,IAAI;AAClB,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,oBAAoB,EAAE,EAAE;AACxB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,IAAI,EAAE,IAAI;~~AACV~~,~~IAAA,~~SAAS,EAAE,~~OAAO~~;~~AAClB~~,IAAA,0BAA0B,EAAE,KAAK;AACjC,IAAA,mBAAmB,EAAE,EAAE;~~AACvB~~,~~IAAA,~~IAAI,EAAE,~~IAAI~~;~~AACV~~,IAAA,KAAK,EAAE,kBAAkB;CAC1B;AAED,MAAM,QAAQ,GAAG,CAAC,KAAK,GAAG,YAAY,KACpC,IAAI,CAAA;;AAEiB,qBAAA,EAAA,KAAK,CAAC,YAAY;AAChB,uBAAA,EAAA,KAAK,CAAC,cAAc,IAAI,CAAC,KAAK,CAAC,OAAO;AAChC,6BAAA,EAAA,KAAK,CAAC,oBAAoB;AACrC,kBAAA,EAAA,KAAK,CAAC,KAAK,CAAA;AACjB,YAAA,EAAA,KAAK,CAAC,IAAI;AACN,gBAAA,EAAA,KAAK,CAAC,SAAS;AACO,sCAAA,EAAA,KAAK,CAAC,0BAA0B;AAC1C,4BAAA,EAAA,KAAK,CAAC,mBAAmB;AAC1C,WAAA,EAAA,KAAK,CAAC,IAAI;AACL,gBAAA,EAAA,KAAK,CAAC,OAAO;AAChB,aAAA,EAAA,KAAK,CAAC,KAAK;;;;GAIvB;AAEH,QAAQ,CAAC,gBAAgB,EAAE,MAAK;AAC9B,IAAA,EAAE,CAAC,4BAA4B,EAAE,YAAW;QAC1C,MAAM,CAAC,QAAQ,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC;AACjC,QAAA,MAAM,OAAO,CAAC,OAAO,EAAE;QACvB,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAuB,CAAC;AACjE,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE;AAC5B,KAAC,CAAC;AACJ,CAAC,CAAC"}
1	+ {"version":3,"file":"side-panel.test.js","sources":["../../../src/components/side-panel/side-panel.test.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;;AAAA;;;;;AAKG;AAEH,EAAE,CAAC,IAAI,CAAC,4BAA4B,EAAE,MAAM,EAAE,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC;AAKxE,MAAM,YAAY,GAAG;AACnB,IAAA,YAAY,EAAE,IAAI;AAClB,IAAA,cAAc,EAAE,IAAI;AACpB,IAAA,OAAO,EAAE,KAAK;AACd,IAAA,oBAAoB,EAAE,EAAE;AACxB,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,IAAI,EAAE,IAAI;IACV,SAAS,EAAE,oBAAoB,CAAC,KAAK;AACrC,IAAA,0BAA0B,EAAE,KAAK;AACjC,IAAA,mBAAmB,EAAE,EAAE;IACvB,IAAI,EAAE,eAAe,CAAC,MAAM;AAC5B,IAAA,KAAK,EAAE,kBAAkB;CAC1B;AAED,MAAM,QAAQ,GAAG,CAAC,KAAK,GAAG,YAAY,KACpC,IAAI,CAAA;;AAEiB,qBAAA,EAAA,KAAK,CAAC,YAAY;AAChB,uBAAA,EAAA,KAAK,CAAC,cAAc,IAAI,CAAC,KAAK,CAAC,OAAO;AAChC,6BAAA,EAAA,KAAK,CAAC,oBAAoB;AACrC,kBAAA,EAAA,KAAK,CAAC,KAAK,CAAA;AACjB,YAAA,EAAA,KAAK,CAAC,IAAI;AACN,gBAAA,EAAA,KAAK,CAAC,SAAS;AACO,sCAAA,EAAA,KAAK,CAAC,0BAA0B;AAC1C,4BAAA,EAAA,KAAK,CAAC,mBAAmB;AAC1C,WAAA,EAAA,KAAK,CAAC,IAAI;AACL,gBAAA,EAAA,KAAK,CAAC,OAAO;AAChB,aAAA,EAAA,KAAK,CAAC,KAAK;;;;GAIvB;AAEH,QAAQ,CAAC,gBAAgB,EAAE,MAAK;AAC9B,IAAA,EAAE,CAAC,4BAA4B,EAAE,YAAW;QAC1C,MAAM,CAAC,QAAQ,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC;AACjC,QAAA,MAAM,OAAO,CAAC,OAAO,EAAE;QACvB,MAAM,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,gBAAuB,CAAC;AACjE,QAAA,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE;AAC5B,KAAC,CAAC;AACJ,CAAC,CAAC"}

@carbon/ibm-products-web-components 0.7.0 → 0.8.0-rc.0