npm - @ptcwebops/ptcw-design - Versions diffs - 6.3.17 → 6.3.18 - Mend

@ptcwebops/ptcw-design 6.3.17 → 6.3.18

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (402) hide show

package/dist/collection/stories/Link.stories.js CHANGED Viewed

@@ -74,22 +74,33 @@ export default {
         'underline',
       ],
     },
+    slotContent: {
+      name: 'Default Slot',
+      description: 'Text Content between the <ptc-link> tags.',
+      control: 'text',
+      table: {
+        category: 'Default Slot',
+        type: {
+            summary: 'plain text',
+        },
+      }
+    }
   },
 };
-const Template = args => {
-  return html`<ptc-link
-    disabled=${args.disabled}
-    external=${args.external}
-    font-size=${args.fontSize}
-    font-weight=${args.fontWeight}
-    href=${args.href}
-    link-area=${args.linkArea}
-    link-title=${args.linkTitle}
-    target=${args.target}
-    theme=${args.theme}
-    >Link Text</ptc-link
-  >`;
+const Template = args => { return html`<ptc-link
+  disabled=${args.disabled}
+  external=${args.external}
+  font-size=${args.fontSize}
+  font-weight=${args.fontWeight}
+  href=${args.href}
+  link-area=${args.linkArea}
+  link-title=${args.linkTitle}
+  target=${args.target}
+  theme=${args.theme}
+  >
+    ${args.slotContent}
+</ptc-link>`;
 };
 export const Example = Template.bind({});
@@ -104,4 +115,5 @@ Example.args = {
   linkTitle: 'Title attribute goes here',
   target: '_blank',
   theme: 'simple',
+  slotContent:'Link text goes here',
 };

package/dist/collection/stories/Paragraph.stories.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { html } from 'lit';
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 export default {
   title: 'Atoms/ptc-para',
@@ -45,18 +46,24 @@ export default {
       description: 'Paragraph Margin',
       defaultValue: { summary: 'undefined' }
     },
-    // paraStyle: {
-    //   control: 'select',
-    //   options: ["announcement", "default", "flush-style", "intro", "main", "small"],
-    //   description: 'Paragraph Style',
-    //   defaultValue: { summary: 'default' }
-    // },
     paraZIndex: {
       control: 'select',
       options: ["z-1", "z-2", "z-3", "z-99", "z-999", "z-auto"],
       description: 'sep z-index',
       defaultValue: { summary: 'undefined' }
     },
+    slotContent: {
+      name: 'Default Slot',
+      description: 'Text Content between the <ptc-para> tags.',
+      control: 'text',
+      table: {
+        category: 'Default Slot',
+        type: {
+            summary: 'html',
+        },
+      }
+    }
     // styles: {
     //   control: '',
     //   description: '(optional) Injected CSS Styles',
@@ -65,7 +72,7 @@ export default {
   }
 };
-let paragraphContent = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
+//let paragraphContent = "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.";
 const Template = args => { return html `<ptc-para
 	ellipsis-line-cutoff=${args.ellipsisLineCutoff}
@@ -78,7 +85,9 @@ const Template = args => { return html `<ptc-para
 	para-style=${args.paraStyle}
 	para-z-index=${args.paraZIndex}
 	styles=${args.styles}
->${paragraphContent}</ptc-para>`;}
+>
+  ${unsafeHTML(args.slotContent)}
+</ptc-para>`;}
 export const Example = Template.bind({});
@@ -90,7 +99,6 @@ Example.args = {
   paraColor: 'primary-grey',
   paraLineH: 'line-height-normal',
   paraMargin: 'margin-5',
-  // paraStyle: 'default',
+  slotContent:'Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.',
   paraZIndex: 'z-1',
-  // styles: 'undefined'
 }

package/dist/collection/stories/Select.stories.js CHANGED Viewed

@@ -6,27 +6,27 @@ export default {
   argTypes: {
     disabled: {
       control: 'boolean',
-      description: '',
+      description: 'Disable the field?',
       defaultValue: { summary: 'false' },
     },
     helpertext: {
       control: 'text',
-      description: '',
+      description: 'Help text',
       defaultValue: { summary: 'Please select a value!' },
     },
     isRequired: {
       control: 'boolean',
-      description: '',
+      description: 'Is this field required?',
       defaultValue: { summary: 'true' },
     },
     label: {
       control: 'text',
-      description: '',
+      description: 'Label text',
       defaultValue: { summary: 'undefined' },
     },
     name: {
       control: 'text',
-      description: '',
+      description: 'Name attribute',
       defaultValue: { summary: 'undefined' },
     },
     ptcDataEloquaName: {
@@ -34,7 +34,6 @@ export default {
       description: 'Eloqua Data',
       defaultValue: { summary: 'undefined' },
     },
-    selectedValue: { control: 'text', description: '', defaultValue: { summary: '' } },
   },
 };
@@ -46,7 +45,6 @@ const Template = args => {
     label=${args.label}
     name=${args.name}
     ptc-data-eloqua-name=${args.ptcDataEloquaName}
-    selected-value=${args.selectedValue}
   >
     <ul class="mdc-list">
       <li class="mdc-list-item" data-value="">
@@ -77,5 +75,4 @@ Example.args = {
   label: 'Lable Name',
   name: 'examplename',
   ptcDataEloquaName: 'data-eloqua-value',
-  selectedValue: '',
 };

package/dist/collection/stories/Textfield.stories.js CHANGED Viewed

@@ -4,79 +4,122 @@ export default {
   title: 'Atoms/ptc-textfield',
   tags: [ 'autodocs' ],
   argTypes: {
+    alertText: {
+      control: 'text',
+      description: 'Alert text (blue)',
+      defaultValue: { summary: '' }
+    },
+    alertTextContent: {
+      control: 'text',
+      description: 'Alert text content - below alert text (grey)',
+      defaultValue: { summary: '' }
+    },
     disabled: {
       control: 'boolean',
-      description: '',
+      description: 'Disable the field?',
       defaultValue: { summary: 'false' }
     },
     fieldId: {
       control: 'text',
-      description: '',
-      defaultValue: { summary: 'undefined' }
+      description: 'ID',
+      defaultValue: { summary: '' }
     },
-    helpertext: {
+    fieldName: {
       control: 'text',
-      description: '',
-      defaultValue: { summary: 'Please enter a value' }
+      description: 'input "name" value. e.g.: phone, email, firstname, lastname',
+      defaultValue: { summary: 'email' }
+    },
+    helpertext: { control: 'text', description: 'Validation text (red)', defaultValue: { summary: '' } },
+    ignoreBlindSubmit: {
+      control: 'boolean',
+      description: 'Ignore Blind Submit?',
+      defaultValue: { summary: 'false' }
     },
-    inputValue: { control: 'text', description: '', defaultValue: { summary: '' } },
+    infoText: {
+      control: 'text',
+      description: 'Info Text (black)',
+      defaultValue: { summary: '' }
+    },
+    // inputValue: { control: 'text', description: '', defaultValue: { summary: '' } },
     labelText: {
       control: 'text',
-      description: '',
+      description: 'Label Text',
       defaultValue: { summary: 'Email' }
     },
-    name: {
+    placeholderText: {
       control: 'text',
-      description: '',
-      defaultValue: { summary: 'email' }
+      description: 'Place holder Text',
+      defaultValue: { summary: '' }
     },
     ptcDataEloquaName: {
       control: 'text',
-      description: '',
-      defaultValue: { summary: 'undefined' }
+      description: 'Eloqua Data Name (for the eloqua)',
+      defaultValue: { summary: '' }
+    },
+    ptcDataTargetEloquaName: {
+      control: 'text',
+      description: 'Eloqua Target Data Name (for the eloqua)',
+      defaultValue: { summary: '' }
     },
     ptcMaxLength: {
-      control: '',
-      description: '',
-      defaultValue: { summary: 'undefined' }
+      control: 'number',
+      description: 'Text counter limit',
+      defaultValue: { summary: '' }
     },
     required: {
       control: 'boolean',
-      description: '',
+      description: 'Is this a mandatory field?',
       defaultValue: { summary: 'true' }
     },
+    styles: {
+      control: 'text',
+      description: 'Inject styles for customization',
+      defaultValue: { summary: '' }
+    },
     type: {
       control: 'text',
-      description: 'button, email, file and etc. ',
+      description: 'text, button, email, file and etc. This value triggers different validation',
       defaultValue: { summary: 'text' }
     }
   }
 };
 const Template = args => { return html `<ptc-textfield
+	alert-text=${args.alertText}
+	alert-text-content=${args.alertTextContent}
 	disabled=${args.disabled}
 	field-id=${args.fieldId}
+	field-name=${args.fieldName}
 	helpertext=${args.helpertext}
-	input-value=${args.inputValue}
+	ignore-blind-submit=${args.ignoreBlindSubmit}
+	info-text=${args.infoText}
 	label-text=${args.labelText}
-	name=${args.name}
+	placeholder-text=${args.placeholderText}
 	ptc-data-eloqua-name=${args.ptcDataEloquaName}
+	ptc-data-target-eloqua-name=${args.ptcDataTargetEloquaName}
 	ptc-max-length=${args.ptcMaxLength}
 	required=${args.required}
+	styles=${args.styles}
 	type=${args.type}
 ></ptc-textfield>`;}
 export const Example = Template.bind({});
 Example.args = {
+  alertText: 'Alert text',
+  alertTextContent: 'Alert text content',
   disabled: 'false',
-  fieldId: 'ptc-field-name',
-  helpertext: 'Please enter a value',
-  inputValue: '',
-  labelText: 'Email',
-  name: 'email',
-  ptcDataEloquaName: 'data-eloqua-name-value',
-  ptcMaxLength: 'undefined',
+  fieldId: 'ID',
+  fieldName: 'company field',
+  helpertext: 'Helper text',
+  ignoreBlindSubmit: 'false',
+  infoText: 'Info text',
+  labelText: 'Lable Name',
+  placeholderText: 'Place hoder text goes here',
+  ptcDataEloquaName: 'C_EmailAddress',
+  ptcDataTargetEloquaName: '',
+  ptcMaxLength: '',
   required: 'true',
-  type: 'email'
+  styles: '',
+  type: 'text'
 }

package/dist/collection/stories/Title.stories.js CHANGED Viewed

@@ -1,4 +1,5 @@
 import { html } from 'lit';
+import { unsafeHTML } from 'lit/directives/unsafe-html.js';
 export default {
   title: 'Atoms/ptc-title',
@@ -77,26 +78,36 @@ export default {
     isPlmHub: {
         description: "is it a title for PLM Hub page?",
         defaultValue: {summary: false}
+    },
+    slotContent: {
+      name: 'Default Slot',
+      description: 'Text Content between the <ptc-title> tags.',
+      control: 'text',
+      table: {
+        category: 'Default Slot',
+        type: {
+            summary: 'html',
+        },
+      }
     }
   },
 };
-const Template = args => {
-  return html`<ptc-title
-    type="${args.type}"
-    text-align="${args.textAlign}"
-    title-size="${args.titleSize}"
-    title-color="${args.titleColor}"
-    upperline="${args.upperline}"
-    title-display="${args.titleDisplay}"
-    title-shadow="${args.titleShadow}"
-    title-height="${args.titleHeight}"
-    title-margin="${args.titleMargin}"
-    title-weight="${args.titleWeight}"
-    is-plm-hub="${args.isPlmHub}"
-  >
-    Title Example
-  </ptc-title>`;
+const Template = args => {return html`<ptc-title
+  type="${args.type}"
+  text-align="${args.textAlign}"
+  title-size="${args.titleSize}"
+  title-color="${args.titleColor}"
+  upperline="${args.upperline}"
+  title-display="${args.titleDisplay}"
+  title-shadow="${args.titleShadow}"
+  title-height="${args.titleHeight}"
+  title-margin="${args.titleMargin}"
+  title-weight="${args.titleWeight}"
+  is-plm-hub="${args.isPlmHub}"
+>
+  ${unsafeHTML(args.slotContent)}
+</ptc-title>`;
 };
 export const Example = Template.bind({});
@@ -112,4 +123,5 @@ Example.args = {
   titleWeight: 'w-8',
   titleShadow: '',
   isPlmHub: false,
+  slotContent:'Lorem ipsum',
 };

package/dist/custom-elements/index.js CHANGED Viewed

@@ -10024,7 +10024,7 @@ const InnovatorToggleContainer$1 = class extends HTMLElement$1 {
   static get style() { return innovatorToggleContainerCss; }
 };
-const jumbotronSubMenuCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.menu{display:block;background-color:transparent;color:black;position:relative}.menu-list{list-style:none;margin:0;padding:var(--ptc-element-spacing-03) 0;display:none;flex-direction:column;background-color:white;width:250px;position:absolute;top:40px;left:0;margin-top:var(--ptc-element-spacing-04);box-shadow:var(--ptc-shadow-x-small);border-radius:var(--ptc-border-radius-standard)}.menu-list.open{display:flex}.menu-list li{margin:0}.menu-list .active button{font-weight:var(--ptc-font-weight-bold)}.menu-list .active button::after{opacity:1}.menu-list button{color:var(--color-gray-10);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-medium);text-decoration:none;border:2px solid transparent;background:none;cursor:pointer;line-height:var(--ptc-line-height-p);position:relative;text-align:left;width:100%;padding:var(--ptc-element-spacing-03) var(--ptc-element-spacing-06);font-family:var(--ptc-font-latin)}.menu-list button::after{content:\"\";display:block;width:2px;height:calc(100% - 24px);background:var(--color-green-07);transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout);opacity:0;position:absolute;top:12px;left:10px}.menu-list button:hover::after,.menu-list button:focus::after{opacity:1}.menu-list button:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.menu-list button:focus-visible::after{opacity:0}.mobile-menu-icon{display:flex;align-items:center;cursor:pointer;font-size:var(--ptc-font-size-x-small);text-align:left;padding:8px 0px;background-color:var(--color-white);border-bottom:2px solid var(--color-white);justify-content:flex-end;width:fit-content;background-color:transparent}.mobile-menu-icon:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.mobile-menu-text{color:var(--color-white);text-align:left;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);margin-right:var(--ptc-element-spacing-03)}@media (min-width: 992px){.menu{display:flex;justify-content:center;align-items:center;background-color:transparent;padding:0px;color:white;position:relative;font-family:var(--ptc-font-latin);left:0;top:0px}.menu-list{display:flex;flex-direction:row;justify-content:center;gap:32px;background-color:transparent;width:auto;position:relative;top:auto;right:auto;box-shadow:none;border-radius:0;margin-top:0px;padding-top:0px;padding-bottom:0px}.menu-list button{text-align:center;width:auto;padding:0px;font-size:16px;color:white;font-family:var(--ptc-font-latin)}.menu-list button::after{position:relative;width:100%;height:1px;transform-origin:bottom;bottom:auto;top:calc(100% + 8px);background:var(--color-white);left:0;transform:scaleY(0);transition:all var(--ptc-transition-medium) var(--ptc-ease-in)}.menu-list button:hover::after,.menu-list button:active::after{transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.menu-list button:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.menu-list li.active button::after{height:2px;transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.mobile-menu-icon{display:none}}";
+const jumbotronSubMenuCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}.menu{display:block;background-color:transparent;color:black;position:relative}.menu-list{list-style:none;margin:0;padding:var(--ptc-element-spacing-03) 0;display:none;flex-direction:column;background-color:white;width:250px;position:absolute;top:40px;left:0;margin-top:var(--ptc-element-spacing-04);box-shadow:var(--ptc-shadow-x-small);border-radius:var(--ptc-border-radius-standard);z-index:10}.menu-list.open{display:flex}.menu-list li{margin:0}.menu-list .active button{font-weight:var(--ptc-font-weight-bold)}.menu-list .active button::after{opacity:1}.menu-list button{color:var(--color-gray-10);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-medium);text-decoration:none;border:2px solid transparent;background:none;cursor:pointer;line-height:var(--ptc-line-height-p);position:relative;text-align:left;width:100%;padding:var(--ptc-element-spacing-03) var(--ptc-element-spacing-06);font-family:var(--ptc-font-latin)}.menu-list button::after{content:\"\";display:block;width:2px;height:calc(100% - 24px);background:var(--color-green-07);transition:opacity var(--ptc-transition-medium) var(--ptc-ease-inout);opacity:0;position:absolute;top:12px;left:10px}.menu-list button:hover::after,.menu-list button:focus::after{opacity:1}.menu-list button:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.menu-list button:focus-visible::after{opacity:0}.mobile-menu-icon{display:flex;align-items:center;cursor:pointer;font-size:var(--ptc-font-size-x-small);text-align:left;padding:8px 0px;background-color:var(--color-white);border-bottom:2px solid var(--color-white);justify-content:flex-end;width:fit-content;background-color:transparent}.mobile-menu-icon:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.mobile-menu-text{color:var(--color-white);text-align:left;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);margin-right:var(--ptc-element-spacing-03)}@media (min-width: 992px){.menu{display:flex;justify-content:center;align-items:center;background-color:transparent;padding:0px;color:white;position:relative;font-family:var(--ptc-font-latin);left:0;top:0px}.menu-list{display:flex;flex-direction:row;justify-content:center;gap:32px;background-color:transparent;width:auto;position:relative;top:auto;right:auto;box-shadow:none;border-radius:0;margin-top:0px;padding-top:0px;padding-bottom:0px}.menu-list button{text-align:center;width:auto;padding:0px;font-size:16px;color:white;font-family:var(--ptc-font-latin)}.menu-list button::after{position:relative;width:100%;height:1px;transform-origin:bottom;bottom:auto;top:calc(100% + 8px);background:var(--color-white);left:0;transform:scaleY(0);transition:all var(--ptc-transition-medium) var(--ptc-ease-in)}.menu-list button:hover::after,.menu-list button:active::after{transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.menu-list button:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.menu-list li.active button::after{height:2px;transform:scaleY(1);font-weight:var(--ptc-font-weight-bold)}.mobile-menu-icon{display:none}}";
 const JumbotronSubMenu$1 = class extends HTMLElement$1 {
   constructor() {
@@ -12369,7 +12369,7 @@ 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.
 ***************************************************************************** */
-/* global Reflect, Promise, SuppressedError, Symbol */
+/* global Reflect, Promise, SuppressedError, Symbol, Iterator */
 var extendStatics = function(d, b) {
     extendStatics = Object.setPrototypeOf ||

package/dist/esm/academic-form-test.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c83db688.js';
 const academicFormTestCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}.form-wrapper{width:433px;display:flex;border-radius:3px;background:#FFF;box-shadow:0px 2px 6px 0px rgba(0, 0, 0, 0.16);flex-direction:column;align-items:center;padding:24px 0px}.form-wrapper>form{max-width:277px}.form-wrapper>ptc-button{align-items:center}.form-wrapper .ptc-label{display:block;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:normal;margin-bottom:var(--ptc-element-spacing-04);position:relative;z-index:1;color:var(--color-gray-13)}";

package/dist/esm/author-listing-example.entry.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, h, g as getElement } from './index-c83db688.js';
 const authorListingExampleCss = ":host{display:block}:host .loader{margin:5rem auto;max-width:45px;position:relative;width:100%}:host .author-grid{width:100%;display:flex;flex-wrap:wrap;grid-row-gap:2rem;grid-column-gap:2rem;justify-content:center}:host .author-grid .author-col{width:100%}@media (min-width: 768px){:host .author-grid .author-col{width:calc(50% - 21.3333333px)}}@media (min-width: 992px){:host .author-grid .author-col{width:calc(33.333333333333% - 21.3333333px)}}";