voa-ds-core 1.0.3

package/dist/collection/components/voa-dropdown/dropdown.js

@@ -0,0 +1,58 @@
+import { h } from "@stencil/core";
+export class Dropdown {
+    constructor() {
+        this.options = [];
+        this.isOpen = false;
+        this.toggleDropdown = () => {
+            this.isOpen = !this.isOpen;
+        };
+        this.selectOption = (option) => {
+            this.selected = option;
+            this.isOpen = false;
+        };
+    }
+    render() {
+        return (h("div", { key: '810d5c74687c947408a7476e60c35160db1995cb', class: "dropdown" }, h("button", { key: 'f3dd374446486867146545cdf8ca83de69c91e44', onClick: this.toggleDropdown, class: "dropdown-button" }, this.selected || "Select an option"), this.isOpen && (h("ul", { key: '0b20f8b82b5c6a76372fa761e491d58469cd86a6', class: "dropdown-list" }, this.options.map((option) => (h("li", { onClick: () => this.selectOption(option) }, option)))))));
+    }
+    static get is() { return "voa-dropdown"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["dropdown.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["dropdown.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "options": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "string[]",
+                    "resolved": "string[]",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": ""
+                },
+                "getter": false,
+                "setter": false,
+                "defaultValue": "[]"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isOpen": {},
+            "selected": {}
+        };
+    }
+}
+//# sourceMappingURL=dropdown.js.map

package/dist/collection/components/voa-dropdown/dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.js","sourceRoot":"","sources":["../../../src/components/voa-dropdown/dropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAO1D,MAAM,OAAO,QAAQ;IALrB;QAMU,YAAO,GAAa,EAAE,CAAC;QACtB,WAAM,GAAY,KAAK,CAAC;QAGjC,mBAAc,GAAG,GAAG,EAAE;YACpB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAC;QAC7B,CAAC,CAAC;QAEF,iBAAY,GAAG,CAAC,MAAc,EAAE,EAAE;YAChC,IAAI,CAAC,QAAQ,GAAG,MAAM,CAAC;YACvB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;QACtB,CAAC,CAAC;KAkBH;IAhBC,MAAM;QACJ,OAAO,CACL,4DAAK,KAAK,EAAC,UAAU;YACnB,+DAAQ,OAAO,EAAE,IAAI,CAAC,cAAc,EAAE,KAAK,EAAC,iBAAiB,IAC1D,IAAI,CAAC,QAAQ,IAAI,kBAAkB,CAC7B;YACR,IAAI,CAAC,MAAM,IAAI,CACd,2DAAI,KAAK,EAAC,eAAe,IACtB,IAAI,CAAC,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CAC5B,UAAI,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC,IAAG,MAAM,CAAM,CAC5D,CAAC,CACC,CACN,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, State, h } from \"@stencil/core\";\r\n\r\n@Component({\r\n  tag: \"voa-dropdown\",\r\n  styleUrl: \"dropdown.css\",\r\n  shadow: true,\r\n})\r\nexport class Dropdown {\r\n  @Prop() options: string[] = [];\r\n  @State() isOpen: boolean = false;\r\n  @State() selected: string;\r\n\r\n  toggleDropdown = () => {\r\n    this.isOpen = !this.isOpen;\r\n  };\r\n\r\n  selectOption = (option: string) => {\r\n    this.selected = option;\r\n    this.isOpen = false;\r\n  };\r\n\r\n  render() {\r\n    return (\r\n      <div class=\"dropdown\">\r\n        <button onClick={this.toggleDropdown} class=\"dropdown-button\">\r\n          {this.selected || \"Select an option\"}\r\n        </button>\r\n        {this.isOpen && (\r\n          <ul class=\"dropdown-list\">\r\n            {this.options.map((option) => (\r\n              <li onClick={() => this.selectOption(option)}>{option}</li>\r\n            ))}\r\n          </ul>\r\n        )}\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}

package/dist/collection/components/voa-dropdown/dropdown.stories.js

@@ -0,0 +1,23 @@
+import { html } from "lit-html";
+import ReadmeMdx from "./README.mdx";
+export default {
+    title: "Componentes/Layout/Dropdown",
+    component: "voa-dropdown",
+    argTypes: {
+        items: { control: { type: "object" } },
+    },
+    parameters: {
+        docs: {
+            page: ReadmeMdx,
+        },
+    },
+    tags: ["autodocs"],
+};
+const Template = ({ options }) => html `
+  <voa-dropdown .options="${options}"></voa-dropdown>
+`;
+export const Default = Template.bind({});
+Default.args = {
+    options: ["Option 1", "Option 2", "Option 3"],
+};
+//# sourceMappingURL=dropdown.stories.js.map

package/dist/collection/components/voa-dropdown/dropdown.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"dropdown.stories.js","sourceRoot":"","sources":["../../../src/components/voa-dropdown/dropdown.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAEhC,OAAO,SAAS,MAAM,cAAc,CAAC;AAErC,eAAe;IACb,KAAK,EAAE,6BAA6B;IACpC,SAAS,EAAE,cAAc;IACzB,QAAQ,EAAE;QACR,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,EAAE;KACvC;IACD,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,IAAI,EAAE,SAAS;SAChB;KACF;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;CACX,CAAC;AAEV,MAAM,QAAQ,GAAY,CAAC,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,IAAI,CAAA;4BACnB,OAAO;CAClC,CAAC;AAEF,MAAM,CAAC,MAAM,OAAO,GAAG,QAAQ,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;AACzC,OAAO,CAAC,IAAI,GAAG;IACb,OAAO,EAAE,CAAC,UAAU,EAAE,UAAU,EAAE,UAAU,CAAC;CAC9C,CAAC","sourcesContent":["import { html } from \"lit-html\";\r\nimport { Meta, StoryFn } from \"@storybook/web-components\";\r\nimport ReadmeMdx from \"./README.mdx\";\r\n\r\nexport default {\r\n  title: \"Componentes/Layout/Dropdown\",\r\n  component: \"voa-dropdown\",\r\n  argTypes: {\r\n    items: { control: { type: \"object\" } },\r\n  },\r\n  parameters: {\r\n    docs: {\r\n      page: ReadmeMdx,\r\n    },\r\n  },\r\n  tags: [\"autodocs\"],\r\n} as Meta;\r\n\r\nconst Template: StoryFn = ({ options }) => html`\r\n  <voa-dropdown .options=\"${options}\"></voa-dropdown>\r\n`;\r\n\r\nexport const Default = Template.bind({});\r\nDefault.args = {\r\n  options: [\"Option 1\", \"Option 2\", \"Option 3\"],\r\n};\r\n"]}

package/dist/collection/components/voa-input/voa-input.css

@@ -0,0 +1,90 @@
+/* 
+ * UNSTYLED PATTERN: This file contains ONLY structural CSS (layout, positioning).
+ * All visual styles (colors, backgrounds, fonts, spacing) must be applied externally
+ * via CSS Parts API (::part() selectors) using design tokens.
+ */
+
+:host {
+  display: block;
+  box-sizing: border-box;
+}
+
+.voa-input__title-row {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+}
+
+.voa-input__label {
+  display: block;
+  box-sizing: border-box;
+}
+
+.voa-input__info {
+  display: flex;
+  align-items: center;
+  gap: 4px;
+  box-sizing: border-box;
+}
+
+.voa-input__info-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.voa-input__required-indicator {
+  display: inline;
+  box-sizing: border-box;
+}
+
+.voa-input__container {
+  position: relative;
+  display: flex;
+  align-items: center;
+  box-sizing: border-box;
+  overflow: hidden;
+}
+
+.voa-input__prefix {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  box-sizing: border-box;
+}
+
+.voa-input__suffix {
+  display: flex;
+  align-items: center;
+  flex-shrink: 0;
+  box-sizing: border-box;
+}
+
+.voa-input__input {
+  flex: 1 1 0%;
+  min-width: 0;
+  width: 100%;
+  border: none;
+  outline: none;
+  background: transparent;
+  box-sizing: border-box;
+  display: block;
+}
+
+.voa-input__input:disabled {
+  cursor: not-allowed;
+}
+
+.voa-input__input:read-only {
+  cursor: default;
+}
+
+.voa-input__helper-text {
+  display: block;
+  box-sizing: border-box;
+}
+
+.is-hidden {
+  display: none !important;
+}