@redvars/peacock 3.1.2 → 3.1.3

package/dist/custom-elements-jsdocs.json

@@ -241,43 +241,49 @@
     }
   },
   {
-    "rawTag": "clock",
-    "label": "Clock",
+    "rawTag": "button",
+    "label": "Button",
     "jsdoc": {
       "@label": [
         {
           "kind": "text",
-          "text": "Clock"
+          "text": "Button"
         }
       ],
       "@tag": [
         {
           "kind": "text",
-          "text": "p-clock"
+          "text": "p-button"
         }
       ],
       "@rawTag": [
         {
           "kind": "text",
-          "text": "clock"
+          "text": "button"
         }
       ],
       "@summary": [
         {
           "kind": "text",
-          "text": "Displays the current time in a given timezone."
+          "text": "Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post."
         }
       ],
       "@overview": [
         {
           "kind": "text",
-          "text": "- Clocks are used to display the current time in a specified timezone.\n - They can be displayed in various formats, including 12-hour and 24-hour time."
+          "text": "<p>Buttons are clickable elements that are used to trigger actions. They communicate calls to action to the user and allow users to interact with pages in a variety of ways. Button labels express what action will occur when the user interacts with it.</p>"
+        }
+      ],
+      "@cssprop": [
+        {
+          "kind": "text",
+          "text": "--divider-padding - Controls the padding of the divider."
         }
       ],
       "@example": [
         {
           "kind": "code",
-          "text": "```html\n<p-clock></p-clock>\n```"
+          "text": "```html\n<pc-button>Button</pc-button>\n```"
         }
       ],
       "@tags": [
@@ -290,35 +296,435 @@
     "customElement": {
       "kind": "class",
       "description": "",
-      "name": "Clock",
+      "name": "Button",
+      "cssProperties": [
+        {
+          "description": "Controls the color of the divider.",
+          "name": "--divider-color"
+        },
+        {
+          "description": "Controls the padding of the divider.",
+          "name": "--divider-padding"
+        }
+      ],
       "members": [
         {
           "kind": "field",
-          "name": "timezone",
+          "name": "#id",
+          "privacy": "private"
+        },
+        {
+          "kind": "field",
+          "name": "#tabindex",
+          "privacy": "private",
+          "type": {
+            "text": "number | undefined"
+          },
+          "default": "0"
+        },
+        {
+          "kind": "field",
+          "name": "buttonElement",
+          "type": {
+            "text": "HTMLElement | null"
+          },
+          "privacy": "private",
+          "readonly": true
+        },
+        {
+          "kind": "field",
+          "name": "htmlType",
+          "type": {
+            "text": "'button' | 'submit' | 'reset'"
+          },
+          "default": "'button'",
+          "attribute": "htmlType"
+        },
+        {
+          "kind": "field",
+          "name": "variant",
+          "type": {
+            "text": "| 'elevated'\n    | 'filled'\n    | 'tonal'\n    | 'outlined'\n    | 'text'\n    | 'neo'"
+          },
+          "default": "'filled'",
+          "description": "The visual style of the button.\n\n Possible variant values:\n`\"filled\"` is a filled button.\n`\"outlined\"` is an outlined button.\n`\"text\"` is a transparent button.\n`\"tonal\"` is a light color button.",
+          "attribute": "variant"
+        },
+        {
+          "kind": "field",
+          "name": "size",
+          "type": {
+            "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
+          },
+          "default": "'sm'",
+          "description": "Button size.\nPossible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.",
+          "attribute": "size"
+        },
+        {
+          "kind": "field",
+          "name": "disabled",
+          "type": {
+            "text": "boolean"
+          },
+          "default": "false",
+          "description": "If true, the user cannot interact with the button. Defaults to `false`.",
+          "attribute": "disabled",
+          "reflects": true
+        },
+        {
+          "kind": "field",
+          "name": "softDisabled",
+          "type": {
+            "text": "boolean"
+          },
+          "default": "false",
+          "description": "If true, the user cannot interact with the button and the button is visually styled as disabled. But the button is still focusable. Defaults to `false`.",
+          "attribute": "softDisabled",
+          "reflects": true
+        },
+        {
+          "kind": "field",
+          "name": "disabledReason",
+          "type": {
+            "text": "string"
+          },
+          "default": "''",
+          "description": "If button is disabled, the reason why it is disabled.",
+          "attribute": "disabledReason"
+        },
+        {
+          "kind": "field",
+          "name": "color",
+          "type": {
+            "text": "| 'primary'\n    | 'secondary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'white'\n    | 'black'"
+          },
+          "default": "'primary'",
+          "description": "Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.",
+          "attribute": "color",
+          "reflects": true
+        },
+        {
+          "kind": "field",
+          "name": "iconAlign",
+          "type": {
+            "text": "'start' | 'end'"
+          },
+          "default": "'end'",
+          "description": "Icon alignment.\nPossible values are `\"start\"`, `\"end\"`. Defaults to `\"end\"`.",
+          "attribute": "iconAlign"
+        },
+        {
+          "kind": "field",
+          "name": "href",
           "type": {
             "text": "string | undefined"
           },
-          "attribute": "timezone"
+          "description": "Hyperlink to navigate to on click.",
+          "attribute": "href",
+          "reflects": true
         },
         {
           "kind": "field",
-          "name": "currentTime",
+          "name": "configAria",
+          "type": {
+            "text": "{ [key: string]: any } | undefined"
+          },
+          "attribute": "configAria",
+          "reflects": true
+        },
+        {
+          "kind": "field",
+          "name": "target",
           "type": {
             "text": "string"
           },
-          "default": "''"
+          "default": "'_self'",
+          "description": "Sets or retrieves the window or frame at which to target content.",
+          "attribute": "target"
         },
         {
           "kind": "field",
-          "name": "_timerId",
+          "name": "selected",
           "type": {
-            "text": "any"
+            "text": "boolean"
+          },
+          "default": "false",
+          "attribute": "selected"
+        },
+        {
+          "kind": "field",
+          "name": "throttleDelay",
+          "type": {
+            "text": "number"
+          },
+          "default": "200",
+          "description": "Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.",
+          "attribute": "throttleDelay"
+        },
+        {
+          "kind": "field",
+          "name": "isPressed",
+          "type": {
+            "text": "boolean"
+          },
+          "privacy": "private",
+          "default": "false",
+          "description": "States"
+        },
+        {
+          "kind": "field",
+          "name": "slotHasContent",
+          "type": {
+            "text": "boolean"
+          },
+          "privacy": "private",
+          "default": "false"
+        },
+        {
+          "kind": "method",
+          "name": "focus"
+        },
+        {
+          "kind": "method",
+          "name": "blur"
+        },
+        {
+          "kind": "field",
+          "name": "__dispatchClickWithThrottle",
+          "type": {
+            "text": "(\n    event: MouseEvent | KeyboardEvent,\n  ) => void"
           },
           "privacy": "private"
         },
+        {
+          "kind": "field",
+          "name": "__dispatchClick"
+        },
+        {
+          "kind": "method",
+          "name": "__renderDisabledReason"
+        },
+        {
+          "kind": "field",
+          "name": "__handlePress"
+        },
+        {
+          "kind": "method",
+          "name": "__isLink",
+          "privacy": "private"
+        },
+        {
+          "kind": "method",
+          "name": "getVariant"
+        },
+        {
+          "kind": "method",
+          "name": "renderButtonContent"
+        }
+      ],
+      "attributes": [
+        {
+          "name": "htmlType",
+          "type": {
+            "text": "'button' | 'submit' | 'reset'"
+          },
+          "default": "'button'",
+          "fieldName": "htmlType"
+        },
+        {
+          "name": "variant",
+          "type": {
+            "text": "| 'elevated'\n    | 'filled'\n    | 'tonal'\n    | 'outlined'\n    | 'text'\n    | 'neo'"
+          },
+          "default": "'filled'",
+          "description": "The visual style of the button.\n\n Possible variant values:\n`\"filled\"` is a filled button.\n`\"outlined\"` is an outlined button.\n`\"text\"` is a transparent button.\n`\"tonal\"` is a light color button.",
+          "fieldName": "variant"
+        },
+        {
+          "name": "size",
+          "type": {
+            "text": "'xs' | 'sm' | 'md' | 'lg' | 'xl'"
+          },
+          "default": "'sm'",
+          "description": "Button size.\nPossible values are `\"sm\"`, `\"md\"`, `\"lg\"`. Defaults to `\"md\"`.",
+          "fieldName": "size"
+        },
+        {
+          "name": "disabled",
+          "type": {
+            "text": "boolean"
+          },
+          "default": "false",
+          "description": "If true, the user cannot interact with the button. Defaults to `false`.",
+          "fieldName": "disabled"
+        },
+        {
+          "name": "softDisabled",
+          "type": {
+            "text": "boolean"
+          },
+          "default": "false",
+          "description": "If true, the user cannot interact with the button and the button is visually styled as disabled. But the button is still focusable. Defaults to `false`.",
+          "fieldName": "softDisabled"
+        },
+        {
+          "name": "disabledReason",
+          "type": {
+            "text": "string"
+          },
+          "default": "''",
+          "description": "If button is disabled, the reason why it is disabled.",
+          "fieldName": "disabledReason"
+        },
+        {
+          "name": "color",
+          "type": {
+            "text": "| 'primary'\n    | 'secondary'\n    | 'success'\n    | 'danger'\n    | 'warning'\n    | 'white'\n    | 'black'"
+          },
+          "default": "'primary'",
+          "description": "Defines the primary color of the button. This can be set to predefined color names to apply specific color themes.",
+          "fieldName": "color"
+        },
+        {
+          "name": "iconAlign",
+          "type": {
+            "text": "'start' | 'end'"
+          },
+          "default": "'end'",
+          "description": "Icon alignment.\nPossible values are `\"start\"`, `\"end\"`. Defaults to `\"end\"`.",
+          "fieldName": "iconAlign"
+        },
+        {
+          "name": "href",
+          "type": {
+            "text": "string | undefined"
+          },
+          "description": "Hyperlink to navigate to on click.",
+          "fieldName": "href"
+        },
+        {
+          "name": "configAria",
+          "type": {
+            "text": "{ [key: string]: any } | undefined"
+          },
+          "fieldName": "configAria"
+        },
+        {
+          "name": "target",
+          "type": {
+            "text": "string"
+          },
+          "default": "'_self'",
+          "description": "Sets or retrieves the window or frame at which to target content.",
+          "fieldName": "target"
+        },
+        {
+          "name": "selected",
+          "type": {
+            "text": "boolean"
+          },
+          "default": "false",
+          "fieldName": "selected"
+        },
+        {
+          "name": "throttleDelay",
+          "type": {
+            "text": "number"
+          },
+          "default": "200",
+          "description": "Sets the delay for throttle in milliseconds. Defaults to 200 milliseconds.",
+          "fieldName": "throttleDelay"
+        }
+      ],
+      "superclass": {
+        "name": "LitElement",
+        "package": "lit"
+      },
+      "tagName": "p-button",
+      "customElement": true,
+      "summary": "Buttons help people initiate actions, from sending an email, to sharing a document, to liking a post.",
+      "rawTag": {
+        "name": "button",
+        "description": ""
+      }
+    }
+  },
+  {
+    "rawTag": "clock",
+    "label": "Clock",
+    "jsdoc": {
+      "@label": [
+        {
+          "kind": "text",
+          "text": "Clock"
+        }
+      ],
+      "@tag": [
+        {
+          "kind": "text",
+          "text": "p-clock"
+        }
+      ],
+      "@rawTag": [
+        {
+          "kind": "text",
+          "text": "clock"
+        }
+      ],
+      "@summary": [
+        {
+          "kind": "text",
+          "text": "Displays the current time in a given timezone."
+        }
+      ],
+      "@overview": [
+        {
+          "kind": "text",
+          "text": "- Clocks are used to display the current time in a specified timezone.\r\n - They can be displayed in various formats, including 12-hour and 24-hour time."
+        }
+      ],
+      "@example": [
+        {
+          "kind": "code",
+          "text": "```html\r\n<p-clock></p-clock>\r\n```"
+        }
+      ],
+      "@tags": [
+        {
+          "kind": "text",
+          "text": "display"
+        }
+      ]
+    },
+    "customElement": {
+      "kind": "class",
+      "description": "",
+      "name": "Clock",
+      "members": [
+        {
+          "kind": "field",
+          "name": "clockController",
+          "default": "new ClockController(this, 100)"
+        },
+        {
+          "kind": "field",
+          "name": "timezone",
+          "type": {
+            "text": "string | undefined"
+          },
+          "attribute": "timezone"
+        },
         {
           "kind": "method",
-          "name": "__updateCurrentTime"
+          "name": "__formatDate",
+          "parameters": [
+            {
+              "name": "date",
+              "type": {
+                "text": "Date"
+              }
+            }
+          ]
         }
       ],
       "attributes": [
@@ -428,19 +834,6 @@
             "text": "boolean"
           },
           "default": "false"
-        },
-        {
-          "kind": "method",
-          "name": "#handleSlotChange",
-          "privacy": "private",
-          "parameters": [
-            {
-              "name": "event",
-              "type": {
-                "text": "{ target: any }"
-              }
-            }
-          ]
         }
       ],
       "attributes": [
@@ -466,6 +859,168 @@
       }
     }
   },
+  {
+    "rawTag": "elevation",
+    "label": "Elevation",
+    "jsdoc": {
+      "@label": [
+        {
+          "kind": "text",
+          "text": "Elevation"
+        }
+      ],
+      "@tag": [
+        {
+          "kind": "text",
+          "text": "p-elevation"
+        }
+      ],
+      "@rawTag": [
+        {
+          "kind": "text",
+          "text": "elevation"
+        }
+      ],
+      "@summary": [
+        {
+          "kind": "text",
+          "text": "Adds elevation to an element."
+        }
+      ],
+      "@overview": [
+        {
+          "kind": "text",
+          "text": "- Elevation adds a shadow effect to an element to give it depth.\n - It can be used to create a sense of hierarchy or to draw attention to a particular element."
+        }
+      ],
+      "@cssprop": [
+        {
+          "kind": "text",
+          "text": "--elevation-color - Controls the color of the shadow."
+        }
+      ],
+      "@example": [
+        {
+          "kind": "code",
+          "text": "```html\n  <div style=\"position: relative; padding: var(--spacing-200); border-radius: var(--shape-corner-small);\">\n    <p-elevation style='--elevation-level: 2'></p-elevation>\n    Level 2\n  </div>\n```"
+        }
+      ],
+      "@tags": [
+        {
+          "kind": "text",
+          "text": "display"
+        }
+      ]
+    },
+    "customElement": {
+      "kind": "class",
+      "description": "",
+      "name": "Elevation",
+      "cssProperties": [
+        {
+          "description": "Controls the elevation level of the shadow.",
+          "name": "--elevation-level"
+        },
+        {
+          "description": "Controls the color of the shadow.",
+          "name": "--elevation-color"
+        }
+      ],
+      "members": [],
+      "superclass": {
+        "name": "LitElement",
+        "package": "lit"
+      },
+      "tagName": "p-elevation",
+      "customElement": true,
+      "summary": "Adds elevation to an element.",
+      "rawTag": {
+        "name": "elevation",
+        "description": ""
+      }
+    }
+  },
+  {
+    "rawTag": "elevation",
+    "label": "Elevation",
+    "jsdoc": {
+      "@label": [
+        {
+          "kind": "text",
+          "text": "Elevation"
+        }
+      ],
+      "@tag": [
+        {
+          "kind": "text",
+          "text": "p-elevation"
+        }
+      ],
+      "@rawTag": [
+        {
+          "kind": "text",
+          "text": "elevation"
+        }
+      ],
+      "@summary": [
+        {
+          "kind": "text",
+          "text": "Adds elevation to an element."
+        }
+      ],
+      "@overview": [
+        {
+          "kind": "text",
+          "text": "- Elevation adds a shadow effect to an element to give it depth.\n - It can be used to create a sense of hierarchy or to draw attention to a particular element."
+        }
+      ],
+      "@cssprop": [
+        {
+          "kind": "text",
+          "text": "--elevation-color - Controls the color of the shadow."
+        }
+      ],
+      "@example": [
+        {
+          "kind": "code",
+          "text": "```html\n  <div style=\"position: relative; padding: var(--spacing-200); border-radius: var(--shape-corner-small);\">\n    <p-elevation style='--elevation-level: 2'></p-elevation>\n    Level 2\n  </div>\n```"
+        }
+      ],
+      "@tags": [
+        {
+          "kind": "text",
+          "text": "display"
+        }
+      ]
+    },
+    "customElement": {
+      "kind": "class",
+      "description": "",
+      "name": "Elevation",
+      "cssProperties": [
+        {
+          "description": "Controls the elevation level of the shadow.",
+          "name": "--elevation-level"
+        },
+        {
+          "description": "Controls the color of the shadow.",
+          "name": "--elevation-color"
+        }
+      ],
+      "members": [],
+      "superclass": {
+        "name": "LitElement",
+        "package": "lit"
+      },
+      "tagName": "p-elevation",
+      "customElement": true,
+      "summary": "Adds elevation to an element.",
+      "rawTag": {
+        "name": "elevation",
+        "description": ""
+      }
+    }
+  },
   {
     "rawTag": "icon",
     "label": "Icon",
@@ -509,7 +1064,7 @@
       "@example": [
         {
           "kind": "code",
-          "text": "```html\n<p-icon name=\"home\"></p-icon>\n```"
+          "text": "```html\r\n<p-icon name=\"home\"></p-icon>\r\n```"
         }
       ]
     },
@@ -535,7 +1090,7 @@
           "type": {
             "text": "string | undefined"
           },
-          "description": "The identifier for the icon.\nThis name corresponds to a specific SVG asset in the icon set.",
+          "description": "The identifier for the icon.\r\nThis name corresponds to a specific SVG asset in the icon set.",
           "attribute": "name",
           "reflects": true
         },
@@ -552,7 +1107,7 @@
           "kind": "field",
           "name": "provider",
           "type": {
-            "text": "'material-symbols' | 'carbon'"
+            "text": "IconProvider"
           },
           "default": "'material-symbols'",
           "attribute": "provider"
@@ -621,7 +1176,7 @@
           "type": {
             "text": "string | undefined"
           },
-          "description": "The identifier for the icon.\nThis name corresponds to a specific SVG asset in the icon set.",
+          "description": "The identifier for the icon.\r\nThis name corresponds to a specific SVG asset in the icon set.",
           "fieldName": "name"
         },
         {
@@ -634,7 +1189,7 @@
         {
           "name": "provider",
           "type": {
-            "text": "'material-symbols' | 'carbon'"
+            "text": "IconProvider"
           },
           "default": "'material-symbols'",
           "fieldName": "provider"