@vonage/vivid 5.17.0 → 5.18.0

package/custom-elements.json

@@ -3869,6 +3869,14 @@
               "name": "--vvd-button-cta-fierce-primary",
               "default": "var(--vvd-color-cta-700)"
             },
+            {
+              "name": "--vvd-button-cta-dim",
+              "default": "var(--vvd-color-cta-200)"
+            },
+            {
+              "name": "--vvd-button-cta-pale",
+              "default": "var(--vvd-color-cta-300)"
+            },
             {
               "name": "--vvd-button-success-primary",
               "default": "var(--vvd-color-success-500)"
@@ -3905,6 +3913,14 @@
               "name": "--vvd-button-success-fierce-primary",
               "default": "var(--vvd-color-success-700)"
             },
+            {
+              "name": "--vvd-button-success-dim",
+              "default": "var(--vvd-color-success-200)"
+            },
+            {
+              "name": "--vvd-button-success-pale",
+              "default": "var(--vvd-color-success-300)"
+            },
             {
               "name": "--vvd-button-alert-primary",
               "default": "var(--vvd-color-alert-500)"
@@ -3941,6 +3957,14 @@
               "name": "--vvd-button-alert-fierce-primary",
               "default": "var(--vvd-color-alert-700)"
             },
+            {
+              "name": "--vvd-button-alert-dim",
+              "default": "var(--vvd-color-alert-200)"
+            },
+            {
+              "name": "--vvd-button-alert-pale",
+              "default": "var(--vvd-color-alert-300)"
+            },
             {
               "name": "--vvd-button-announcement-primary",
               "default": "var(--vvd-color-announcement-500)"
@@ -3977,6 +4001,14 @@
               "name": "--vvd-button-announcement-fierce-primary",
               "default": "var(--vvd-color-announcement-700)"
             },
+            {
+              "name": "--vvd-button-announcement-dim",
+              "default": "var(--vvd-color-announcement-200)"
+            },
+            {
+              "name": "--vvd-button-announcement-pale",
+              "default": "var(--vvd-color-announcement-300)"
+            },
             {
               "name": "--vvd-button-accent-primary",
               "default": "var(--vvd-color-canvas-text)"
@@ -4012,6 +4044,14 @@
             {
               "name": "--vvd-button-accent-fierce-primary",
               "default": "var(--vvd-color-canvas-text)"
+            },
+            {
+              "name": "--vvd-button-accent-dim",
+              "default": "var(--vvd-color-neutral-200)"
+            },
+            {
+              "name": "--vvd-button-accent-pale",
+              "default": "var(--vvd-color-neutral-300)"
             }
           ],
           "slots": [
@@ -4106,6 +4146,16 @@
               "description": "Displays the button in active state.",
               "privacy": "public"
             },
+            {
+              "kind": "field",
+              "name": "pressed",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates the button is in a pressed/toggled state.\nSets `aria-pressed` on the button element.",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "label",
@@ -4762,6 +4812,15 @@
               "description": "Displays the button in active state.",
               "fieldName": "active"
             },
+            {
+              "name": "pressed",
+              "type": {
+                "text": "boolean"
+              },
+              "default": "false",
+              "description": "Indicates the button is in a pressed/toggled state.\nSets `aria-pressed` on the button element.",
+              "fieldName": "pressed"
+            },
             {
               "name": "label",
               "type": {
@@ -7600,6 +7659,13 @@
               },
               "description": "Fires when the value changes",
               "name": "change"
+            },
+            {
+              "type": {
+                "text": "Event"
+              },
+              "description": "Fires when the value of the element changes.",
+              "name": "input"
             }
           ],
           "attributes": [
@@ -9107,7 +9173,7 @@
           "type": {
             "text": "Country[]"
           },
-          "default": "[\n\t{ code: 'AF', countryCode: '+93', iconFlagName: 'flag-afghanistan' },\n\t{ code: 'AL', countryCode: '+355', iconFlagName: 'flag-albania' },\n\t{ code: 'DZ', countryCode: '+213', iconFlagName: 'flag-algeria' },\n\t{ code: 'AS', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'AD', countryCode: '+376', iconFlagName: '' },\n\t{ code: 'AO', countryCode: '+244', iconFlagName: '' },\n\t{ code: 'AI', countryCode: '+43', iconFlagName: '' },\n\t{ code: 'AG', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'AR', countryCode: '+54', iconFlagName: 'flag-argentina' },\n\t{ code: 'AM', countryCode: '+374', iconFlagName: 'flag-armenia' },\n\t{ code: 'AW', countryCode: '+297', iconFlagName: 'flag-aruba' },\n\t{ code: 'AU', countryCode: '+61', iconFlagName: 'flag-australia' },\n\t{ code: 'AT', countryCode: '+43', iconFlagName: 'flag-austria' },\n\t{ code: 'AZ', countryCode: '+994', iconFlagName: '' },\n\t{ code: 'BS', countryCode: '+1', iconFlagName: 'flag-bahamas' },\n\t{ code: 'BH', countryCode: '+973', iconFlagName: 'flag-bahrain' },\n\t{ code: 'BD', countryCode: '+880', iconFlagName: 'flag-bangladesh' },\n\t{ code: 'BB', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'BY', countryCode: '+375', iconFlagName: 'flag-belarus' },\n\t{ code: 'BE', countryCode: '+32', iconFlagName: 'flag-belgium' },\n\t{ code: 'BZ', countryCode: '+501', iconFlagName: '' },\n\t{ code: 'BJ', countryCode: '+229', iconFlagName: 'flag-benin' },\n\t{ code: 'BM', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'BT', countryCode: '+975', iconFlagName: '' },\n\t{ code: 'BO', countryCode: '+591', iconFlagName: 'flag-bolivia' },\n\t{ code: 'BA', countryCode: '+387', iconFlagName: '' },\n\t{ code: 'BW', countryCode: '+267', iconFlagName: 'flag-botswana' },\n\t{ code: 'BR', countryCode: '+55', iconFlagName: 'flag-brazil' },\n\t{ code: 'IO', countryCode: '+246', iconFlagName: '' },\n\t{ code: 'VG', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'VI', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'BN', countryCode: '+673', iconFlagName: '' },\n\t{ code: 'BG', countryCode: '+359', iconFlagName: 'flag-bulgaria' },\n\t{ code: 'BF', countryCode: '+226', iconFlagName: 'flag-burkina-faso' },\n\t{ code: 'BI', countryCode: '+257', iconFlagName: '' },\n\t{ code: 'KH', countryCode: '+855', iconFlagName: 'flag-cambodia' },\n\t{ code: 'CM', countryCode: '+237', iconFlagName: '' },\n\t{ code: 'CA', countryCode: '+1', iconFlagName: 'flag-canada' },\n\t{ code: 'CV', countryCode: '+238', iconFlagName: '' },\n\t{ code: 'KY', countryCode: '+1', iconFlagName: 'flag-cayman-islands' },\n\t{\n\t\tcode: 'CF',\n\t\tcountryCode: '+236',\n\t\ticonFlagName: 'flag-central-african-republic',\n\t},\n\t{\n\t\tcode: 'CF',\n\t\tcountryCode: '+236',\n\t\ticonFlagName: 'flag-central-african-republic',\n\t},\n\t{ code: 'CL', countryCode: '+56', iconFlagName: 'flag-chile' },\n\t{ code: 'CN', countryCode: '+86', iconFlagName: 'flag-china' },\n\t{ code: 'CO', countryCode: '+57', iconFlagName: 'flag-colombia' },\n\t{ code: 'KM', countryCode: '+269', iconFlagName: '' },\n\t{ code: 'CG', countryCode: '+242', iconFlagName: '' },\n\t{ code: 'CD', countryCode: '+243', iconFlagName: '' },\n\t{ code: 'CK', countryCode: '+682', iconFlagName: '' },\n\t{ code: 'CR', countryCode: '+506', iconFlagName: 'flag-costa-rica' },\n\t{ code: 'HR', countryCode: '+385', iconFlagName: 'flag-croatia' },\n\t{ code: 'CU', countryCode: '+53', iconFlagName: '' },\n\t{ code: 'CU', countryCode: '+53', iconFlagName: '' },\n\t{ code: 'CY', countryCode: '+357', iconFlagName: 'flag-cyprus' },\n\t{ code: 'CZ', countryCode: '+420', iconFlagName: 'flag-czech-republic' },\n\t{ code: 'DK', countryCode: '+45', iconFlagName: 'flag-denmark' },\n\t{ code: 'DJ', countryCode: '+253', iconFlagName: '' },\n\t{ code: 'DM', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'DO', countryCode: '+1', iconFlagName: 'flag-dominican-republic' },\n\t{ code: 'EC', countryCode: '+593', iconFlagName: '' },\n\t{ code: 'EG', countryCode: '+20', iconFlagName: 'flag-egypt' },\n\t{ code: 'SV', countryCode: '+503', iconFlagName: 'flag-el-salvador' },\n\t{ code: 'GQ', countryCode: '+240', iconFlagName: '' },\n\t{ code: 'ER', countryCode: '+291', iconFlagName: '' },\n\t{ code: 'EE', countryCode: '+372', iconFlagName: 'flag-estonia' },\n\t{ code: 'ET', countryCode: '+251', iconFlagName: '' },\n\t{ code: 'FK', countryCode: '+500', iconFlagName: '' },\n\t{ code: 'FO', countryCode: '+298', iconFlagName: '' },\n\t{ code: 'FJ', countryCode: '+679', iconFlagName: '' },\n\t{ code: 'FI', countryCode: '+358', iconFlagName: 'flag-finland' },\n\t{ code: 'FR', countryCode: '+33', iconFlagName: 'flag-france' },\n\t{ code: 'GF', countryCode: '+594', iconFlagName: '' },\n\t{ code: 'PF', countryCode: '+689', iconFlagName: '' },\n\t{ code: 'GA', countryCode: '+241', iconFlagName: '' },\n\t{ code: 'GM', countryCode: '+220', iconFlagName: '' },\n\t{ code: 'GE', countryCode: '+995', iconFlagName: 'flag-georgia' },\n\t{ code: 'DE', countryCode: '+49', iconFlagName: 'flag-germany' },\n\t{ code: 'GH', countryCode: '+233', iconFlagName: 'flag-ghana' },\n\t{ code: 'GI', countryCode: '+350', iconFlagName: '' },\n\t{ code: 'GR', countryCode: '+30', iconFlagName: 'flag-greece' },\n\t{ code: 'GL', countryCode: '+299', iconFlagName: '' },\n\t{ code: 'GD', countryCode: '+1', iconFlagName: 'flag-grenada' },\n\t{ code: 'GP', countryCode: '+590', iconFlagName: '' },\n\t{ code: 'GU', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'GT', countryCode: '+502', iconFlagName: 'flag-guatemala' },\n\t{ code: 'GN', countryCode: '+224', iconFlagName: '' },\n\t{ code: 'GW', countryCode: '+245', iconFlagName: '' },\n\t{ code: 'GY', countryCode: '+592', iconFlagName: '' },\n\t{ code: 'HT', countryCode: '+509', iconFlagName: '' },\n\t{ code: 'VA', countryCode: '+39', iconFlagName: '' },\n\t{ code: 'HN', countryCode: '+504', iconFlagName: 'flag-honduras' },\n\t{ code: 'HK', countryCode: '+852', iconFlagName: 'flag-hong-kong' },\n\t{ code: 'HU', countryCode: '+36', iconFlagName: 'flag-hungary' },\n\t{ code: 'IS', countryCode: '+354', iconFlagName: 'flag-iceland' },\n\t{ code: 'IN', countryCode: '+91', iconFlagName: 'flag-india' },\n\t{ code: 'ID', countryCode: '+62', iconFlagName: 'flag-indonesia' },\n\t{ code: 'CI', countryCode: '+225', iconFlagName: '' },\n\t{ code: 'IR', countryCode: '+98', iconFlagName: '' },\n\t{ code: 'IQ', countryCode: '+964', iconFlagName: '' },\n\t{ code: 'IE', countryCode: '+353', iconFlagName: 'flag-ireland' },\n\t{ code: 'IL', countryCode: '+972', iconFlagName: 'flag-israel' },\n\t{ code: 'IT', countryCode: '+39', iconFlagName: 'flag-italy' },\n\t{ code: 'JM', countryCode: '+1', iconFlagName: 'flag-jamaica' },\n\t{ code: 'JP', countryCode: '+81', iconFlagName: 'flag-japan' },\n\t{ code: 'JO', countryCode: '+962', iconFlagName: '' },\n\t{ code: 'KZ', countryCode: '+7', iconFlagName: '' },\n\t{ code: 'KE', countryCode: '+254', iconFlagName: '' },\n\t{ code: 'KI', countryCode: '+686', iconFlagName: '' },\n\t{ code: 'KW', countryCode: '+965', iconFlagName: '' },\n\t{ code: 'KG', countryCode: '+996', iconFlagName: '' },\n\t{ code: 'LA', countryCode: '+856', iconFlagName: '' },\n\t{ code: 'LV', countryCode: '+371', iconFlagName: 'flag-latvia' },\n\t{ code: 'LB', countryCode: '+961', iconFlagName: '' },\n\t{ code: 'LS', countryCode: '+266', iconFlagName: '' },\n\t{ code: 'LR', countryCode: '+231', iconFlagName: '' },\n\t{ code: 'LY', countryCode: '+218', iconFlagName: '' },\n\t{ code: 'LI', countryCode: '+423', iconFlagName: 'flag-liechtenstein' },\n\t{ code: 'LT', countryCode: '+370', iconFlagName: 'flag-lithuania' },\n\t{ code: 'LU', countryCode: '+352', iconFlagName: 'flag-luxembourg' },\n\t{ code: 'MO', countryCode: '+853', iconFlagName: 'flag-macao' },\n\t{ code: 'MK', countryCode: '+389', iconFlagName: '' },\n\t{ code: 'MG', countryCode: '+261', iconFlagName: '' },\n\t{ code: 'MW', countryCode: '+265', iconFlagName: '' },\n\t{ code: 'MY', countryCode: '+60', iconFlagName: 'flag-malaysia' },\n\t{ code: 'MV', countryCode: '+960', iconFlagName: '' },\n\t{ code: 'ML', countryCode: '+223', iconFlagName: '' },\n\t{ code: 'MT', countryCode: '+356', iconFlagName: 'flag-malta' },\n\t{ code: 'MH', countryCode: '+692', iconFlagName: '' },\n\t{ code: 'MQ', countryCode: '+596', iconFlagName: '' },\n\t{ code: 'MR', countryCode: '+222', iconFlagName: '' },\n\t{ code: 'MU', countryCode: '+230', iconFlagName: 'flag-mauritius' },\n\t{ code: 'YT', countryCode: '+262', iconFlagName: '' },\n\t{ code: 'MX', countryCode: '+52', iconFlagName: 'flag-mexico' },\n\t{ code: 'FM', countryCode: '+691', iconFlagName: '' },\n\t{ code: 'MD', countryCode: '+373', iconFlagName: 'flag-moldova' },\n\t{ code: 'MC', countryCode: '+377', iconFlagName: '' },\n\t{ code: 'MN', countryCode: '+976', iconFlagName: '' },\n\t{ code: 'ME', countryCode: '+382', iconFlagName: '' },\n\t{ code: 'MS', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'MA', countryCode: '+212', iconFlagName: '' },\n\t{ code: 'MZ', countryCode: '+258', iconFlagName: '' },\n\t{ code: 'MM', countryCode: '+95', iconFlagName: '' },\n\t{ code: 'NA', countryCode: '+264', iconFlagName: '' },\n\t{ code: 'NR', countryCode: '+674', iconFlagName: '' },\n\t{ code: 'NP', countryCode: '+977', iconFlagName: '' },\n\t{ code: 'NL', countryCode: '+31', iconFlagName: 'flag-netherlands' },\n\t{ code: 'NC', countryCode: '+687', iconFlagName: '' },\n\t{ code: 'NZ', countryCode: '+64', iconFlagName: 'flag-new-zealand' },\n\t{ code: 'NI', countryCode: '+505', iconFlagName: '' },\n\t{ code: 'NE', countryCode: '+227', iconFlagName: '' },\n\t{ code: 'NG', countryCode: '+234', iconFlagName: 'flag-nigeria' },\n\t{ code: 'NU', countryCode: '+683', iconFlagName: '' },\n\t{ code: 'NF', countryCode: '+672', iconFlagName: '' },\n\t{ code: 'KP', countryCode: '+850', iconFlagName: '' },\n\t{ code: 'MP', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'NO', countryCode: '+47', iconFlagName: 'flag-norway' },\n\t{ code: 'OM', countryCode: '+968', iconFlagName: '' },\n\t{ code: 'PK', countryCode: '+92', iconFlagName: 'flag-pakistan' },\n\t{ code: 'PW', countryCode: '+680', iconFlagName: '' },\n\t{ code: 'PS', countryCode: '+970', iconFlagName: '' },\n\t{ code: 'PA', countryCode: '+507', iconFlagName: 'flag-panama' },\n\t{ code: 'PG', countryCode: '+675', iconFlagName: '' },\n\t{ code: 'PY', countryCode: '+595', iconFlagName: '' },\n\t{ code: 'PE', countryCode: '+51', iconFlagName: 'flag-peru' },\n\t{ code: 'PH', countryCode: '+63', iconFlagName: 'flag-philippines' },\n\t{ code: 'PL', countryCode: '+48', iconFlagName: 'flag-poland' },\n\t{ code: 'PT', countryCode: '+351', iconFlagName: 'flag-portugal' },\n\t{ code: 'PR', countryCode: '+1', iconFlagName: 'flag-puertorico' },\n\t{ code: 'QA', countryCode: '+974', iconFlagName: '' },\n\t{ code: 'XK', countryCode: '+381', iconFlagName: '' },\n\t{ code: 'RE', countryCode: '+262', iconFlagName: '' },\n\t{ code: 'RO', countryCode: '+40', iconFlagName: 'flag-romania' },\n\t{ code: 'RU', countryCode: '+7', iconFlagName: 'flag-russia' },\n\t{ code: 'RW', countryCode: '+250', iconFlagName: 'flag-rwanda' },\n\t{ code: 'BL', countryCode: '+590', iconFlagName: '' },\n\t{ code: 'SH', countryCode: '+290', iconFlagName: '' },\n\t{ code: 'KN', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'LC', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'MF', countryCode: '+590', iconFlagName: '' },\n\t{ code: 'PM', countryCode: '+508', iconFlagName: '' },\n\t{ code: 'VC', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'WS', countryCode: '+685', iconFlagName: '' },\n\t{ code: 'SM', countryCode: '+378', iconFlagName: '' },\n\t{ code: 'ST', countryCode: '+239', iconFlagName: '' },\n\t{ code: 'SA', countryCode: '+966', iconFlagName: 'flag-saudi-arabia' },\n\t{ code: 'SN', countryCode: '+221', iconFlagName: '' },\n\t{ code: 'RS', countryCode: '+381', iconFlagName: 'flag-serbia' },\n\t{ code: 'SC', countryCode: '+248', iconFlagName: '' },\n\t{ code: 'SL', countryCode: '+232', iconFlagName: '' },\n\t{ code: 'SG', countryCode: '+65', iconFlagName: 'flag-singapore' },\n\t{ code: 'SG', countryCode: '+65', iconFlagName: 'flag-singapore' },\n\t{ code: 'SK', countryCode: '+421', iconFlagName: 'flag-slovakia' },\n\t{ code: 'SI', countryCode: '+386', iconFlagName: 'flag-slovenia' },\n\t{ code: 'SB', countryCode: '+677', iconFlagName: '' },\n\t{ code: 'SO', countryCode: '+252', iconFlagName: '' },\n\t{ code: 'ZA', countryCode: '+27', iconFlagName: 'flag-south-africa' },\n\t{ code: 'KR', countryCode: '+82', iconFlagName: 'flag-south-korea' },\n\t{ code: 'ES', countryCode: '+34', iconFlagName: 'flag-spain' },\n\t{ code: 'LK', countryCode: '+94', iconFlagName: 'flag-sri-lanka' },\n\t{ code: 'SD', countryCode: '+249', iconFlagName: '' },\n\t{ code: 'SR', countryCode: '+597', iconFlagName: '' },\n\t{ code: 'SZ', countryCode: '+268', iconFlagName: '' },\n\t{ code: 'SE', countryCode: '+46', iconFlagName: 'flag-sweden' },\n\t{ code: 'CH', countryCode: '+41', iconFlagName: 'flag-switzerland' },\n\t{ code: 'SY', countryCode: '+963', iconFlagName: '' },\n\t{ code: 'TW', countryCode: '+886', iconFlagName: 'flag-taiwan' },\n\t{ code: 'TJ', countryCode: '+992', iconFlagName: 'flag-tajikistan' },\n\t{ code: 'TZ', countryCode: '+255', iconFlagName: 'flag-tanzania' },\n\t{ code: 'TH', countryCode: '+66', iconFlagName: 'flag-thailand' },\n\t{ code: 'TL', countryCode: '+670', iconFlagName: '' },\n\t{ code: 'TG', countryCode: '+228', iconFlagName: '' },\n\t{ code: 'TK', countryCode: '+690', iconFlagName: '' },\n\t{ code: 'TO', countryCode: '+676', iconFlagName: '' },\n\t{ code: 'TT', countryCode: '+1', iconFlagName: 'flag-trinidad-and-tobago' },\n\t{ code: 'TN', countryCode: '+216', iconFlagName: '' },\n\t{ code: 'TR', countryCode: '+90', iconFlagName: 'flag-turkey' },\n\t{ code: 'TM', countryCode: '+993', iconFlagName: '' },\n\t{ code: 'TC', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'TV', countryCode: '+688', iconFlagName: '' },\n\t{ code: 'UG', countryCode: '+256', iconFlagName: '' },\n\t{ code: 'UA', countryCode: '+380', iconFlagName: 'flag-ukraine' },\n\t{\n\t\tcode: 'AE',\n\t\tcountryCode: '+971',\n\t\ticonFlagName: 'flag-united-arab-emirates',\n\t},\n\t{ code: 'GB', countryCode: '+44', iconFlagName: 'flag-united-kingdom' },\n\t{ code: 'UK', countryCode: '+44', iconFlagName: 'flag-united-kingdom' },\n\t{ code: 'US', countryCode: '+1', iconFlagName: 'flag-united-states' },\n\t{ code: 'UY', countryCode: '+598', iconFlagName: 'flag-uruguay' },\n\t{ code: 'UZ', countryCode: '+998', iconFlagName: 'flag-uzbekistan' },\n\t{ code: 'VU', countryCode: '+678', iconFlagName: '' },\n\t{ code: 'VE', countryCode: '+58', iconFlagName: 'flag-venezuela' },\n\t{ code: 'VN', countryCode: '+84', iconFlagName: 'flag-vietnam' },\n\t{ code: 'WF', countryCode: '+681', iconFlagName: '' },\n\t{ code: 'WF', countryCode: '+681', iconFlagName: '' },\n\t{ code: 'YE', countryCode: '+967', iconFlagName: '' },\n\t{ code: 'ZM', countryCode: '+260', iconFlagName: 'flag-zambia' },\n\t{ code: 'ZW', countryCode: '+263', iconFlagName: '' },\n]",
+          "default": "[\n\t{\n\t\tcode: 'AF',\n\t\tlabel: 'Afghanistan',\n\t\tcountryCode: '+93',\n\t\ticonFlagName: 'flag-afghanistan',\n\t},\n\t{\n\t\tcode: 'AL',\n\t\tlabel: 'Albania',\n\t\tcountryCode: '+355',\n\t\ticonFlagName: 'flag-albania',\n\t},\n\t{\n\t\tcode: 'DZ',\n\t\tlabel: 'Algeria',\n\t\tcountryCode: '+213',\n\t\ticonFlagName: 'flag-algeria',\n\t},\n\t{ code: 'AS', label: 'American Samoa', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'AD', label: 'Andorra', countryCode: '+376', iconFlagName: '' },\n\t{ code: 'AO', label: 'Angola', countryCode: '+244', iconFlagName: '' },\n\t{ code: 'AI', label: 'Anguilla', countryCode: '+43', iconFlagName: '' },\n\t{\n\t\tcode: 'AG',\n\t\tlabel: 'Antigua and Barbuda',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'AR',\n\t\tlabel: 'Argentina',\n\t\tcountryCode: '+54',\n\t\ticonFlagName: 'flag-argentina',\n\t},\n\t{\n\t\tcode: 'AM',\n\t\tlabel: 'Armenia',\n\t\tcountryCode: '+374',\n\t\ticonFlagName: 'flag-armenia',\n\t},\n\t{\n\t\tcode: 'AW',\n\t\tlabel: 'Aruba',\n\t\tcountryCode: '+297',\n\t\ticonFlagName: 'flag-aruba',\n\t},\n\t{\n\t\tcode: 'AU',\n\t\tlabel: 'Australia',\n\t\tcountryCode: '+61',\n\t\ticonFlagName: 'flag-australia',\n\t},\n\t{\n\t\tcode: 'AT',\n\t\tlabel: 'Austria',\n\t\tcountryCode: '+43',\n\t\ticonFlagName: 'flag-austria',\n\t},\n\t{ code: 'AZ', label: 'Azerbaijan', countryCode: '+994', iconFlagName: '' },\n\t{\n\t\tcode: 'BS',\n\t\tlabel: 'Bahamas',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-bahamas',\n\t},\n\t{\n\t\tcode: 'BH',\n\t\tlabel: 'Bahrain',\n\t\tcountryCode: '+973',\n\t\ticonFlagName: 'flag-bahrain',\n\t},\n\t{\n\t\tcode: 'BD',\n\t\tlabel: 'Bangladesh',\n\t\tcountryCode: '+880',\n\t\ticonFlagName: 'flag-bangladesh',\n\t},\n\t{ code: 'BB', label: 'Barbados', countryCode: '+1', iconFlagName: '' },\n\t{\n\t\tcode: 'BY',\n\t\tlabel: 'Belarus',\n\t\tcountryCode: '+375',\n\t\ticonFlagName: 'flag-belarus',\n\t},\n\t{\n\t\tcode: 'BE',\n\t\tlabel: 'Belgium',\n\t\tcountryCode: '+32',\n\t\ticonFlagName: 'flag-belgium',\n\t},\n\t{ code: 'BZ', label: 'Belize', countryCode: '+501', iconFlagName: '' },\n\t{\n\t\tcode: 'BJ',\n\t\tlabel: 'Benin',\n\t\tcountryCode: '+229',\n\t\ticonFlagName: 'flag-benin',\n\t},\n\t{ code: 'BM', label: 'Bermuda', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'BT', label: 'Bhutan', countryCode: '+975', iconFlagName: '' },\n\t{\n\t\tcode: 'BO',\n\t\tlabel: 'Bolivia (Plurinational State of)',\n\t\tcountryCode: '+591',\n\t\ticonFlagName: 'flag-bolivia',\n\t},\n\t{\n\t\tcode: 'BA',\n\t\tlabel: 'Bosnia and Herzegovina',\n\t\tcountryCode: '+387',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'BW',\n\t\tlabel: 'Botswana',\n\t\tcountryCode: '+267',\n\t\ticonFlagName: 'flag-botswana',\n\t},\n\t{\n\t\tcode: 'BR',\n\t\tlabel: 'Brazil',\n\t\tcountryCode: '+55',\n\t\ticonFlagName: 'flag-brazil',\n\t},\n\t{\n\t\tcode: 'IO',\n\t\tlabel: 'British Indian Ocean Territory',\n\t\tcountryCode: '+246',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'VG',\n\t\tlabel: 'Virgin Islands (British)',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'VI',\n\t\tlabel: 'Virgin Islands (U.S.)',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'BN',\n\t\tlabel: 'Brunei Darussalam',\n\t\tcountryCode: '+673',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'BG',\n\t\tlabel: 'Bulgaria',\n\t\tcountryCode: '+359',\n\t\ticonFlagName: 'flag-bulgaria',\n\t},\n\t{\n\t\tcode: 'BF',\n\t\tlabel: 'Burkina Faso',\n\t\tcountryCode: '+226',\n\t\ticonFlagName: 'flag-burkina-faso',\n\t},\n\t{ code: 'BI', label: 'Burundi', countryCode: '+257', iconFlagName: '' },\n\t{\n\t\tcode: 'KH',\n\t\tlabel: 'Cambodia',\n\t\tcountryCode: '+855',\n\t\ticonFlagName: 'flag-cambodia',\n\t},\n\t{ code: 'CM', label: 'Cameroon', countryCode: '+237', iconFlagName: '' },\n\t{\n\t\tcode: 'CA',\n\t\tlabel: 'Canada',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-canada',\n\t},\n\t{ code: 'CV', label: 'Cabo Verde', countryCode: '+238', iconFlagName: '' },\n\t{\n\t\tcode: 'KY',\n\t\tlabel: 'Cayman Islands',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-cayman-islands',\n\t},\n\t{\n\t\tcode: 'CF',\n\t\tlabel: 'Central African Republic',\n\t\tcountryCode: '+236',\n\t\ticonFlagName: 'flag-central-african-republic',\n\t},\n\t{\n\t\tcode: 'CF',\n\t\tlabel: 'Central African Republic',\n\t\tcountryCode: '+236',\n\t\ticonFlagName: 'flag-central-african-republic',\n\t},\n\t{\n\t\tcode: 'CL',\n\t\tlabel: 'Chile',\n\t\tcountryCode: '+56',\n\t\ticonFlagName: 'flag-chile',\n\t},\n\t{\n\t\tcode: 'CN',\n\t\tlabel: 'China',\n\t\tcountryCode: '+86',\n\t\ticonFlagName: 'flag-china',\n\t},\n\t{\n\t\tcode: 'CO',\n\t\tlabel: 'Colombia',\n\t\tcountryCode: '+57',\n\t\ticonFlagName: 'flag-colombia',\n\t},\n\t{ code: 'KM', label: 'Comoros', countryCode: '+269', iconFlagName: '' },\n\t{ code: 'CG', label: 'Congo', countryCode: '+242', iconFlagName: '' },\n\t{\n\t\tcode: 'CD',\n\t\tlabel: 'Congo (Democratic Republic of the)',\n\t\tcountryCode: '+243',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'CK', label: 'Cook Islands', countryCode: '+682', iconFlagName: '' },\n\t{\n\t\tcode: 'CR',\n\t\tlabel: 'Costa Rica',\n\t\tcountryCode: '+506',\n\t\ticonFlagName: 'flag-costa-rica',\n\t},\n\t{\n\t\tcode: 'HR',\n\t\tlabel: 'Croatia',\n\t\tcountryCode: '+385',\n\t\ticonFlagName: 'flag-croatia',\n\t},\n\t{ code: 'CU', label: 'Cuba', countryCode: '+53', iconFlagName: '' },\n\t{ code: 'CU', label: 'Cuba', countryCode: '+53', iconFlagName: '' },\n\t{\n\t\tcode: 'CY',\n\t\tlabel: 'Cyprus',\n\t\tcountryCode: '+357',\n\t\ticonFlagName: 'flag-cyprus',\n\t},\n\t{\n\t\tcode: 'CZ',\n\t\tlabel: 'Czech Republic',\n\t\tcountryCode: '+420',\n\t\ticonFlagName: 'flag-czech-republic',\n\t},\n\t{\n\t\tcode: 'DK',\n\t\tlabel: 'Denmark',\n\t\tcountryCode: '+45',\n\t\ticonFlagName: 'flag-denmark',\n\t},\n\t{ code: 'DJ', label: 'Djibouti', countryCode: '+253', iconFlagName: '' },\n\t{ code: 'DM', label: 'Dominica', countryCode: '+1', iconFlagName: '' },\n\t{\n\t\tcode: 'DO',\n\t\tlabel: 'Dominican Republic',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-dominican-republic',\n\t},\n\t{ code: 'EC', label: 'Ecuador', countryCode: '+593', iconFlagName: '' },\n\t{\n\t\tcode: 'EG',\n\t\tlabel: 'Egypt',\n\t\tcountryCode: '+20',\n\t\ticonFlagName: 'flag-egypt',\n\t},\n\t{\n\t\tcode: 'SV',\n\t\tlabel: 'El Salvador',\n\t\tcountryCode: '+503',\n\t\ticonFlagName: 'flag-el-salvador',\n\t},\n\t{\n\t\tcode: 'GQ',\n\t\tlabel: 'Equatorial Guinea',\n\t\tcountryCode: '+240',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'ER', label: 'Eritrea', countryCode: '+291', iconFlagName: '' },\n\t{\n\t\tcode: 'EE',\n\t\tlabel: 'Estonia',\n\t\tcountryCode: '+372',\n\t\ticonFlagName: 'flag-estonia',\n\t},\n\t{ code: 'ET', label: 'Ethiopia', countryCode: '+251', iconFlagName: '' },\n\t{\n\t\tcode: 'FK',\n\t\tlabel: 'Falkland Islands (Malvinas)',\n\t\tcountryCode: '+500',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'FO', label: 'Faroe Islands', countryCode: '+298', iconFlagName: '' },\n\t{ code: 'FJ', label: 'Fiji', countryCode: '+679', iconFlagName: '' },\n\t{\n\t\tcode: 'FI',\n\t\tlabel: 'Finland',\n\t\tcountryCode: '+358',\n\t\ticonFlagName: 'flag-finland',\n\t},\n\t{\n\t\tcode: 'FR',\n\t\tlabel: 'France',\n\t\tcountryCode: '+33',\n\t\ticonFlagName: 'flag-france',\n\t},\n\t{ code: 'GF', label: 'French Guiana', countryCode: '+594', iconFlagName: '' },\n\t{\n\t\tcode: 'PF',\n\t\tlabel: 'French Polynesia',\n\t\tcountryCode: '+689',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'GA', label: 'Gabon', countryCode: '+241', iconFlagName: '' },\n\t{ code: 'GM', label: 'Gambia', countryCode: '+220', iconFlagName: '' },\n\t{\n\t\tcode: 'GE',\n\t\tlabel: 'Georgia',\n\t\tcountryCode: '+995',\n\t\ticonFlagName: 'flag-georgia',\n\t},\n\t{\n\t\tcode: 'DE',\n\t\tlabel: 'Germany',\n\t\tcountryCode: '+49',\n\t\ticonFlagName: 'flag-germany',\n\t},\n\t{\n\t\tcode: 'GH',\n\t\tlabel: 'Ghana',\n\t\tcountryCode: '+233',\n\t\ticonFlagName: 'flag-ghana',\n\t},\n\t{ code: 'GI', label: 'Gibraltar', countryCode: '+350', iconFlagName: '' },\n\t{\n\t\tcode: 'GR',\n\t\tlabel: 'Greece',\n\t\tcountryCode: '+30',\n\t\ticonFlagName: 'flag-greece',\n\t},\n\t{ code: 'GL', label: 'Greenland', countryCode: '+299', iconFlagName: '' },\n\t{\n\t\tcode: 'GD',\n\t\tlabel: 'Grenada',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-grenada',\n\t},\n\t{ code: 'GP', label: 'Guadeloupe', countryCode: '+590', iconFlagName: '' },\n\t{ code: 'GU', label: 'Guam', countryCode: '+1', iconFlagName: '' },\n\t{\n\t\tcode: 'GT',\n\t\tlabel: 'Guatemala',\n\t\tcountryCode: '+502',\n\t\ticonFlagName: 'flag-guatemala',\n\t},\n\t{ code: 'GN', label: 'Guinea', countryCode: '+224', iconFlagName: '' },\n\t{ code: 'GW', label: 'Guinea-Bissau', countryCode: '+245', iconFlagName: '' },\n\t{ code: 'GY', label: 'Guyana', countryCode: '+592', iconFlagName: '' },\n\t{ code: 'HT', label: 'Haiti', countryCode: '+509', iconFlagName: '' },\n\t{ code: 'VA', label: 'Holy See', countryCode: '+39', iconFlagName: '' },\n\t{\n\t\tcode: 'HN',\n\t\tlabel: 'Honduras',\n\t\tcountryCode: '+504',\n\t\ticonFlagName: 'flag-honduras',\n\t},\n\t{\n\t\tcode: 'HK',\n\t\tlabel: 'Hong Kong',\n\t\tcountryCode: '+852',\n\t\ticonFlagName: 'flag-hong-kong',\n\t},\n\t{\n\t\tcode: 'HU',\n\t\tlabel: 'Hungary',\n\t\tcountryCode: '+36',\n\t\ticonFlagName: 'flag-hungary',\n\t},\n\t{\n\t\tcode: 'IS',\n\t\tlabel: 'Iceland',\n\t\tcountryCode: '+354',\n\t\ticonFlagName: 'flag-iceland',\n\t},\n\t{\n\t\tcode: 'IN',\n\t\tlabel: 'India',\n\t\tcountryCode: '+91',\n\t\ticonFlagName: 'flag-india',\n\t},\n\t{\n\t\tcode: 'ID',\n\t\tlabel: 'Indonesia',\n\t\tcountryCode: '+62',\n\t\ticonFlagName: 'flag-indonesia',\n\t},\n\t{ code: 'CI', label: \"Côte d'Ivoire\", countryCode: '+225', iconFlagName: '' },\n\t{\n\t\tcode: 'IR',\n\t\tlabel: 'Iran (Islamic Republic of)',\n\t\tcountryCode: '+98',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'IQ', label: 'Iraq', countryCode: '+964', iconFlagName: '' },\n\t{\n\t\tcode: 'IE',\n\t\tlabel: 'Ireland',\n\t\tcountryCode: '+353',\n\t\ticonFlagName: 'flag-ireland',\n\t},\n\t{\n\t\tcode: 'IL',\n\t\tlabel: 'Israel',\n\t\tcountryCode: '+972',\n\t\ticonFlagName: 'flag-israel',\n\t},\n\t{\n\t\tcode: 'IT',\n\t\tlabel: 'Italy',\n\t\tcountryCode: '+39',\n\t\ticonFlagName: 'flag-italy',\n\t},\n\t{\n\t\tcode: 'JM',\n\t\tlabel: 'Jamaica',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-jamaica',\n\t},\n\t{\n\t\tcode: 'JP',\n\t\tlabel: 'Japan',\n\t\tcountryCode: '+81',\n\t\ticonFlagName: 'flag-japan',\n\t},\n\t{ code: 'JO', label: 'Jordan', countryCode: '+962', iconFlagName: '' },\n\t{ code: 'KZ', label: 'Kazakhstan', countryCode: '+7', iconFlagName: '' },\n\t{ code: 'KE', label: 'Kenya', countryCode: '+254', iconFlagName: '' },\n\t{ code: 'KI', label: 'Kiribati', countryCode: '+686', iconFlagName: '' },\n\t{ code: 'KW', label: 'Kuwait', countryCode: '+965', iconFlagName: '' },\n\t{ code: 'KG', label: 'Kyrgyzstan', countryCode: '+996', iconFlagName: '' },\n\t{\n\t\tcode: 'LA',\n\t\tlabel: \"Lao People's Democratic Republic\",\n\t\tcountryCode: '+856',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'LV',\n\t\tlabel: 'Latvia',\n\t\tcountryCode: '+371',\n\t\ticonFlagName: 'flag-latvia',\n\t},\n\t{ code: 'LB', label: 'Lebanon', countryCode: '+961', iconFlagName: '' },\n\t{ code: 'LS', label: 'Lesotho', countryCode: '+266', iconFlagName: '' },\n\t{ code: 'LR', label: 'Liberia', countryCode: '+231', iconFlagName: '' },\n\t{ code: 'LY', label: 'Libya', countryCode: '+218', iconFlagName: '' },\n\t{\n\t\tcode: 'LI',\n\t\tlabel: 'Liechtenstein',\n\t\tcountryCode: '+423',\n\t\ticonFlagName: 'flag-liechtenstein',\n\t},\n\t{\n\t\tcode: 'LT',\n\t\tlabel: 'Lithuania',\n\t\tcountryCode: '+370',\n\t\ticonFlagName: 'flag-lithuania',\n\t},\n\t{\n\t\tcode: 'LU',\n\t\tlabel: 'Luxembourg',\n\t\tcountryCode: '+352',\n\t\ticonFlagName: 'flag-luxembourg',\n\t},\n\t{\n\t\tcode: 'MO',\n\t\tlabel: 'Macao',\n\t\tcountryCode: '+853',\n\t\ticonFlagName: 'flag-macao',\n\t},\n\t{\n\t\tcode: 'MK',\n\t\tlabel: 'Macedonia (the former Yugoslav Republic of)',\n\t\tcountryCode: '+389',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'MG', label: 'Madagascar', countryCode: '+261', iconFlagName: '' },\n\t{ code: 'MW', label: 'Malawi', countryCode: '+265', iconFlagName: '' },\n\t{\n\t\tcode: 'MY',\n\t\tlabel: 'Malaysia',\n\t\tcountryCode: '+60',\n\t\ticonFlagName: 'flag-malaysia',\n\t},\n\t{ code: 'MV', label: 'Maldives', countryCode: '+960', iconFlagName: '' },\n\t{ code: 'ML', label: 'Mali', countryCode: '+223', iconFlagName: '' },\n\t{\n\t\tcode: 'MT',\n\t\tlabel: 'Malta',\n\t\tcountryCode: '+356',\n\t\ticonFlagName: 'flag-malta',\n\t},\n\t{\n\t\tcode: 'MH',\n\t\tlabel: 'Marshall Islands',\n\t\tcountryCode: '+692',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'MQ', label: 'Martinique', countryCode: '+596', iconFlagName: '' },\n\t{ code: 'MR', label: 'Mauritania', countryCode: '+222', iconFlagName: '' },\n\t{\n\t\tcode: 'MU',\n\t\tlabel: 'Mauritius',\n\t\tcountryCode: '+230',\n\t\ticonFlagName: 'flag-mauritius',\n\t},\n\t{ code: 'YT', label: 'Mayotte', countryCode: '+262', iconFlagName: '' },\n\t{\n\t\tcode: 'MX',\n\t\tlabel: 'Mexico',\n\t\tcountryCode: '+52',\n\t\ticonFlagName: 'flag-mexico',\n\t},\n\t{\n\t\tcode: 'FM',\n\t\tlabel: 'Micronesia (Federated States of)',\n\t\tcountryCode: '+691',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'MD',\n\t\tlabel: 'Moldova (Republic of)',\n\t\tcountryCode: '+373',\n\t\ticonFlagName: 'flag-moldova',\n\t},\n\t{ code: 'MC', label: 'Monaco', countryCode: '+377', iconFlagName: '' },\n\t{ code: 'MN', label: 'Mongolia', countryCode: '+976', iconFlagName: '' },\n\t{ code: 'ME', label: 'Montenegro', countryCode: '+382', iconFlagName: '' },\n\t{ code: 'MS', label: 'Montserrat', countryCode: '+1', iconFlagName: '' },\n\t{ code: 'MA', label: 'Morocco', countryCode: '+212', iconFlagName: '' },\n\t{ code: 'MZ', label: 'Mozambique', countryCode: '+258', iconFlagName: '' },\n\t{ code: 'MM', label: 'Myanmar', countryCode: '+95', iconFlagName: '' },\n\t{ code: 'NA', label: 'Namibia', countryCode: '+264', iconFlagName: '' },\n\t{ code: 'NR', label: 'Nauru', countryCode: '+674', iconFlagName: '' },\n\t{ code: 'NP', label: 'Nepal', countryCode: '+977', iconFlagName: '' },\n\t{\n\t\tcode: 'NL',\n\t\tlabel: 'Netherlands',\n\t\tcountryCode: '+31',\n\t\ticonFlagName: 'flag-netherlands',\n\t},\n\t{ code: 'NC', label: 'New Caledonia', countryCode: '+687', iconFlagName: '' },\n\t{\n\t\tcode: 'NZ',\n\t\tlabel: 'New Zealand',\n\t\tcountryCode: '+64',\n\t\ticonFlagName: 'flag-new-zealand',\n\t},\n\t{ code: 'NI', label: 'Nicaragua', countryCode: '+505', iconFlagName: '' },\n\t{ code: 'NE', label: 'Niger', countryCode: '+227', iconFlagName: '' },\n\t{\n\t\tcode: 'NG',\n\t\tlabel: 'Nigeria',\n\t\tcountryCode: '+234',\n\t\ticonFlagName: 'flag-nigeria',\n\t},\n\t{ code: 'NU', label: 'Niue', countryCode: '+683', iconFlagName: '' },\n\t{\n\t\tcode: 'NF',\n\t\tlabel: 'Norfolk Island',\n\t\tcountryCode: '+672',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'KP',\n\t\tlabel: \"Korea (Democratic People's Republic of)\",\n\t\tcountryCode: '+850',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'MP',\n\t\tlabel: 'Northern Mariana Islands',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'NO',\n\t\tlabel: 'Norway',\n\t\tcountryCode: '+47',\n\t\ticonFlagName: 'flag-norway',\n\t},\n\t{ code: 'OM', label: 'Oman', countryCode: '+968', iconFlagName: '' },\n\t{\n\t\tcode: 'PK',\n\t\tlabel: 'Pakistan',\n\t\tcountryCode: '+92',\n\t\ticonFlagName: 'flag-pakistan',\n\t},\n\t{ code: 'PW', label: 'Palau', countryCode: '+680', iconFlagName: '' },\n\t{ code: 'PS', label: 'Palestine', countryCode: '+970', iconFlagName: '' },\n\t{\n\t\tcode: 'PA',\n\t\tlabel: 'Panama',\n\t\tcountryCode: '+507',\n\t\ticonFlagName: 'flag-panama',\n\t},\n\t{\n\t\tcode: 'PG',\n\t\tlabel: 'Papua New Guinea',\n\t\tcountryCode: '+675',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'PY', label: 'Paraguay', countryCode: '+595', iconFlagName: '' },\n\t{ code: 'PE', label: 'Peru', countryCode: '+51', iconFlagName: 'flag-peru' },\n\t{\n\t\tcode: 'PH',\n\t\tlabel: 'Philippines',\n\t\tcountryCode: '+63',\n\t\ticonFlagName: 'flag-philippines',\n\t},\n\t{\n\t\tcode: 'PL',\n\t\tlabel: 'Poland',\n\t\tcountryCode: '+48',\n\t\ticonFlagName: 'flag-poland',\n\t},\n\t{\n\t\tcode: 'PT',\n\t\tlabel: 'Portugal',\n\t\tcountryCode: '+351',\n\t\ticonFlagName: 'flag-portugal',\n\t},\n\t{\n\t\tcode: 'PR',\n\t\tlabel: 'Puerto Rico',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-puertorico',\n\t},\n\t{ code: 'QA', label: 'Qatar', countryCode: '+974', iconFlagName: '' },\n\t{\n\t\tcode: 'XK',\n\t\tlabel: 'Republic of Kosovo',\n\t\tcountryCode: '+381',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'RE', label: 'Réunion', countryCode: '+262', iconFlagName: '' },\n\t{\n\t\tcode: 'RO',\n\t\tlabel: 'Romania',\n\t\tcountryCode: '+40',\n\t\ticonFlagName: 'flag-romania',\n\t},\n\t{\n\t\tcode: 'RU',\n\t\tlabel: 'Russian Federation',\n\t\tcountryCode: '+7',\n\t\ticonFlagName: 'flag-russia',\n\t},\n\t{\n\t\tcode: 'RW',\n\t\tlabel: 'Rwanda',\n\t\tcountryCode: '+250',\n\t\ticonFlagName: 'flag-rwanda',\n\t},\n\t{\n\t\tcode: 'BL',\n\t\tlabel: 'Saint Barthélemy',\n\t\tcountryCode: '+590',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'SH',\n\t\tlabel: 'Saint Helena, Ascension and Tristan da Cunha',\n\t\tcountryCode: '+290',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'KN',\n\t\tlabel: 'Saint Kitts and Nevis',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'LC', label: 'Saint Lucia', countryCode: '+1', iconFlagName: '' },\n\t{\n\t\tcode: 'MF',\n\t\tlabel: 'Saint Martin (French part)',\n\t\tcountryCode: '+590',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'PM',\n\t\tlabel: 'Saint Pierre and Miquelon',\n\t\tcountryCode: '+508',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'VC',\n\t\tlabel: 'Saint Vincent and the Grenadines',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'WS', label: 'Samoa', countryCode: '+685', iconFlagName: '' },\n\t{ code: 'SM', label: 'San Marino', countryCode: '+378', iconFlagName: '' },\n\t{\n\t\tcode: 'ST',\n\t\tlabel: 'Sao Tome and Principe',\n\t\tcountryCode: '+239',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'SA',\n\t\tlabel: 'Saudi Arabia',\n\t\tcountryCode: '+966',\n\t\ticonFlagName: 'flag-saudi-arabia',\n\t},\n\t{ code: 'SN', label: 'Senegal', countryCode: '+221', iconFlagName: '' },\n\t{\n\t\tcode: 'RS',\n\t\tlabel: 'Serbia',\n\t\tcountryCode: '+381',\n\t\ticonFlagName: 'flag-serbia',\n\t},\n\t{ code: 'SC', label: 'Seychelles', countryCode: '+248', iconFlagName: '' },\n\t{ code: 'SL', label: 'Sierra Leone', countryCode: '+232', iconFlagName: '' },\n\t{\n\t\tcode: 'SG',\n\t\tlabel: 'Singapore',\n\t\tcountryCode: '+65',\n\t\ticonFlagName: 'flag-singapore',\n\t},\n\t{\n\t\tcode: 'SG',\n\t\tlabel: 'Singapore',\n\t\tcountryCode: '+65',\n\t\ticonFlagName: 'flag-singapore',\n\t},\n\t{\n\t\tcode: 'SK',\n\t\tlabel: 'Slovakia',\n\t\tcountryCode: '+421',\n\t\ticonFlagName: 'flag-slovakia',\n\t},\n\t{\n\t\tcode: 'SI',\n\t\tlabel: 'Slovenia',\n\t\tcountryCode: '+386',\n\t\ticonFlagName: 'flag-slovenia',\n\t},\n\t{\n\t\tcode: 'SB',\n\t\tlabel: 'Solomon Islands',\n\t\tcountryCode: '+677',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'SO', label: 'Somalia', countryCode: '+252', iconFlagName: '' },\n\t{\n\t\tcode: 'ZA',\n\t\tlabel: 'South Africa',\n\t\tcountryCode: '+27',\n\t\ticonFlagName: 'flag-south-africa',\n\t},\n\t{\n\t\tcode: 'KR',\n\t\tlabel: 'Korea (Republic of)',\n\t\tcountryCode: '+82',\n\t\ticonFlagName: 'flag-south-korea',\n\t},\n\t{\n\t\tcode: 'ES',\n\t\tlabel: 'Spain',\n\t\tcountryCode: '+34',\n\t\ticonFlagName: 'flag-spain',\n\t},\n\t{\n\t\tcode: 'LK',\n\t\tlabel: 'Sri Lanka',\n\t\tcountryCode: '+94',\n\t\ticonFlagName: 'flag-sri-lanka',\n\t},\n\t{ code: 'SD', label: 'Sudan', countryCode: '+249', iconFlagName: '' },\n\t{ code: 'SR', label: 'Suriname', countryCode: '+597', iconFlagName: '' },\n\t{ code: 'SZ', label: 'Swaziland', countryCode: '+268', iconFlagName: '' },\n\t{\n\t\tcode: 'SE',\n\t\tlabel: 'Sweden',\n\t\tcountryCode: '+46',\n\t\ticonFlagName: 'flag-sweden',\n\t},\n\t{\n\t\tcode: 'CH',\n\t\tlabel: 'Switzerland',\n\t\tcountryCode: '+41',\n\t\ticonFlagName: 'flag-switzerland',\n\t},\n\t{\n\t\tcode: 'SY',\n\t\tlabel: 'Syrian Arab Republic',\n\t\tcountryCode: '+963',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'TW',\n\t\tlabel: 'Taiwan',\n\t\tcountryCode: '+886',\n\t\ticonFlagName: 'flag-taiwan',\n\t},\n\t{\n\t\tcode: 'TJ',\n\t\tlabel: 'Tajikistan',\n\t\tcountryCode: '+992',\n\t\ticonFlagName: 'flag-tajikistan',\n\t},\n\t{\n\t\tcode: 'TZ',\n\t\tlabel: 'Tanzania, United Republic of',\n\t\tcountryCode: '+255',\n\t\ticonFlagName: 'flag-tanzania',\n\t},\n\t{\n\t\tcode: 'TH',\n\t\tlabel: 'Thailand',\n\t\tcountryCode: '+66',\n\t\ticonFlagName: 'flag-thailand',\n\t},\n\t{ code: 'TL', label: 'Timor-Leste', countryCode: '+670', iconFlagName: '' },\n\t{ code: 'TG', label: 'Togo', countryCode: '+228', iconFlagName: '' },\n\t{ code: 'TK', label: 'Tokelau', countryCode: '+690', iconFlagName: '' },\n\t{ code: 'TO', label: 'Tonga', countryCode: '+676', iconFlagName: '' },\n\t{\n\t\tcode: 'TT',\n\t\tlabel: 'Trinidad and Tobago',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-trinidad-and-tobago',\n\t},\n\t{ code: 'TN', label: 'Tunisia', countryCode: '+216', iconFlagName: '' },\n\t{\n\t\tcode: 'TR',\n\t\tlabel: 'Turkey',\n\t\tcountryCode: '+90',\n\t\ticonFlagName: 'flag-turkey',\n\t},\n\t{ code: 'TM', label: 'Turkmenistan', countryCode: '+993', iconFlagName: '' },\n\t{\n\t\tcode: 'TC',\n\t\tlabel: 'Turks and Caicos Islands',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'TV', label: 'Tuvalu', countryCode: '+688', iconFlagName: '' },\n\t{ code: 'UG', label: 'Uganda', countryCode: '+256', iconFlagName: '' },\n\t{\n\t\tcode: 'UA',\n\t\tlabel: 'Ukraine',\n\t\tcountryCode: '+380',\n\t\ticonFlagName: 'flag-ukraine',\n\t},\n\t{\n\t\tcode: 'AE',\n\t\tlabel: 'United Arab Emirates',\n\t\tcountryCode: '+971',\n\t\ticonFlagName: 'flag-united-arab-emirates',\n\t},\n\t{\n\t\tcode: 'GB',\n\t\tlabel: 'United Kingdom of Great Britain and Northern Ireland',\n\t\tcountryCode: '+44',\n\t\ticonFlagName: 'flag-united-kingdom',\n\t},\n\t{\n\t\tcode: 'UK',\n\t\tlabel: 'United Kingdom',\n\t\tcountryCode: '+44',\n\t\ticonFlagName: 'flag-united-kingdom',\n\t},\n\t{\n\t\tcode: 'US',\n\t\tlabel: 'United States of America',\n\t\tcountryCode: '+1',\n\t\ticonFlagName: 'flag-united-states',\n\t},\n\t{\n\t\tcode: 'UY',\n\t\tlabel: 'Uruguay',\n\t\tcountryCode: '+598',\n\t\ticonFlagName: 'flag-uruguay',\n\t},\n\t{\n\t\tcode: 'UZ',\n\t\tlabel: 'Uzbekistan',\n\t\tcountryCode: '+998',\n\t\ticonFlagName: 'flag-uzbekistan',\n\t},\n\t{ code: 'VU', label: 'Vanuatu', countryCode: '+678', iconFlagName: '' },\n\t{\n\t\tcode: 'VE',\n\t\tlabel: 'Venezuela (Bolivarian Republic of)',\n\t\tcountryCode: '+58',\n\t\ticonFlagName: 'flag-venezuela',\n\t},\n\t{\n\t\tcode: 'VN',\n\t\tlabel: 'Viet Nam',\n\t\tcountryCode: '+84',\n\t\ticonFlagName: 'flag-vietnam',\n\t},\n\t{\n\t\tcode: 'WF',\n\t\tlabel: 'Wallis and Futuna',\n\t\tcountryCode: '+681',\n\t\ticonFlagName: '',\n\t},\n\t{\n\t\tcode: 'WF',\n\t\tlabel: 'Wallis and Futuna',\n\t\tcountryCode: '+681',\n\t\ticonFlagName: '',\n\t},\n\t{ code: 'YE', label: 'Yemen', countryCode: '+967', iconFlagName: '' },\n\t{\n\t\tcode: 'ZM',\n\t\tlabel: 'Zambia',\n\t\tcountryCode: '+260',\n\t\ticonFlagName: 'flag-zambia',\n\t},\n\t{ code: 'ZW', label: 'Zimbabwe', countryCode: '+263', iconFlagName: '' },\n]",
           "description": "Country list from https://github.com/esmat-nawahda/countries (countries.ts)."
         }
       ],
@@ -9124,7 +9190,142 @@
     },
     {
       "kind": "javascript-module",
-      "path": "src/lib/country/country-code-to-flag-icon.ts",
+      "path": "src/lib/country/country.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "Country",
+          "slots": [
+            {
+              "description": "Optional custom flag or graphic. When `code` is set and no content is slotted, a default flag icon (Vivid/Vonage icon set) is shown.",
+              "name": "icon"
+            }
+          ],
+          "members": [
+            {
+              "kind": "field",
+              "name": "code",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from [flag-icons](https://github.com/lipis/flag-icons)) and the code (e.g. \"UK\")\nautomatically.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Optional text to show instead of the country code (e.g. \"Saint Helena\" for \"SH\"). Useful for\nless familiar codes.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "VIVID_VERSION",
+              "static": true,
+              "default": "__PACKAGE_VERSION__",
+              "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+              "type": {
+                "text": "string"
+              },
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "componentName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "description": "Core component name, without prefix",
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "code",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from [flag-icons](https://github.com/lipis/flag-icons)) and the code (e.g. \"UK\")\nautomatically.",
+              "fieldName": "code"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Optional text to show instead of the country code (e.g. \"Saint Helena\" for \"SH\"). Useful for\nless familiar codes.",
+              "fieldName": "label"
+            }
+          ],
+          "superclass": {
+            "name": "VividElement",
+            "module": "/src/shared/foundation/vivid-element/vivid-element"
+          },
+          "vividComponent": {
+            "public": true,
+            "name": "country"
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "Country",
+          "declaration": {
+            "name": "Country",
+            "module": "src/lib/country/country.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/country/definition.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "registerCountry",
+          "description": "Registers the country element with the design system.",
+          "parameters": [
+            {
+              "description": "the prefix to use for the component name",
+              "name": "prefix"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "registerCountry",
+          "declaration": {
+            "name": "registerCountry",
+            "module": "src/lib/country/definition.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "VwcCountryElement",
+          "declaration": {
+            "name": "Country",
+            "module": "src/lib/country/definition.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/country/utils.ts",
       "declarations": [
         {
           "kind": "function",
@@ -9166,28 +9367,12 @@
         }
       ],
       "exports": [
-        {
-          "kind": "js",
-          "name": "Country",
-          "declaration": {
-            "name": "Country",
-            "module": "src/lib/country/country-code-to-flag-icon.ts"
-          }
-        },
-        {
-          "kind": "js",
-          "name": "countries",
-          "declaration": {
-            "name": "countries",
-            "module": "src/lib/country/country-code-to-flag-icon.ts"
-          }
-        },
         {
           "kind": "js",
           "name": "getDialCode",
           "declaration": {
             "name": "getDialCode",
-            "module": "src/lib/country/country-code-to-flag-icon.ts"
+            "module": "src/lib/country/utils.ts"
           }
         },
         {
@@ -9195,43 +9380,215 @@
           "name": "getFlagIconName",
           "declaration": {
             "name": "getFlagIconName",
-            "module": "src/lib/country/country-code-to-flag-icon.ts"
+            "module": "src/lib/country/utils.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/lib/country/country.ts",
+      "path": "src/lib/country-group/country-group.ts",
       "declarations": [
         {
           "kind": "class",
           "description": "",
-          "name": "Country",
+          "name": "CountryGroup",
           "slots": [
             {
-              "description": "Optional custom flag or graphic. When `code` is set and no content is slotted, a default flag icon (Vivid/Vonage icon set) is shown.",
-              "name": "icon"
+              "description": "One or more `vwc-country` elements (Country only).",
+              "name": "default"
             }
           ],
           "members": [
             {
               "kind": "field",
-              "name": "code",
+              "name": "slotEl",
               "type": {
-                "text": "string | undefined"
+                "text": "HTMLSlotElement"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "badgeEl",
+              "type": {
+                "text": "Badge | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "overflowWrapEl",
+              "type": {
+                "text": "HTMLDivElement | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "overflowGridEl",
+              "type": {
+                "text": "HTMLDivElement | undefined"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "overflowCount",
+              "type": {
+                "text": "number"
               },
-              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from [flag-icons](https://github.com/lipis/flag-icons)) and the code (e.g. \"UK\")\nautomatically.",
-              "privacy": "public"
+              "readonly": true
             },
             {
               "kind": "field",
-              "name": "label",
+              "name": "#observer",
+              "privacy": "private",
               "type": {
-                "text": "string | undefined"
+                "text": "IntersectionObserver | null"
               },
-              "description": "Optional text to show instead of the country code (e.g. \"Saint Helena\" for \"SH\"). Useful for\nless familiar codes.",
-              "privacy": "public"
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "#visibleMap",
+              "privacy": "private",
+              "default": "new Map<Element, boolean>()"
+            },
+            {
+              "kind": "field",
+              "name": "#candidateVisible",
+              "privacy": "private",
+              "type": {
+                "text": "number"
+              },
+              "default": "-1"
+            },
+            {
+              "kind": "field",
+              "name": "#candidateStreak",
+              "privacy": "private",
+              "type": {
+                "text": "number"
+              },
+              "default": "0"
+            },
+            {
+              "kind": "method",
+              "name": "#countryNameForCode",
+              "return": {
+                "type": {
+                  "text": "string"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "code",
+                  "type": {
+                    "text": "string"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "#applyLayout",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "visibleCount",
+                  "type": {
+                    "text": "number"
+                  }
+                },
+                {
+                  "name": "mode",
+                  "type": {
+                    "text": "'final' | 'fit'"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "field",
+              "name": "#onSlotChange",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "#ensureObserver",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#requestFit",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#observeAll",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#syncFromSlot",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "method",
+              "name": "#updateAriaLabel",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
+            },
+            {
+              "kind": "field",
+              "name": "#handleIntersection",
+              "privacy": "private"
+            },
+            {
+              "kind": "method",
+              "name": "#proposeVisibleCount",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "nextVisible",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "#prepareForFit",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              }
             },
             {
               "kind": "field",
@@ -9261,22 +9618,14 @@
               }
             }
           ],
-          "attributes": [
+          "mixins": [
             {
-              "name": "code",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from [flag-icons](https://github.com/lipis/flag-icons)) and the code (e.g. \"UK\")\nautomatically.",
-              "fieldName": "code"
+              "name": "Localized",
+              "module": "/src/shared/patterns"
             },
             {
-              "name": "label",
-              "type": {
-                "text": "string | undefined"
-              },
-              "description": "Optional text to show instead of the country code (e.g. \"Saint Helena\" for \"SH\"). Useful for\nless familiar codes.",
-              "fieldName": "label"
+              "name": "DelegatesAria",
+              "module": "/src/shared/aria/delegates-aria"
             }
           ],
           "superclass": {
@@ -9285,29 +9634,29 @@
           },
           "vividComponent": {
             "public": true,
-            "name": "country"
+            "name": "country-group"
           }
         }
       ],
       "exports": [
         {
           "kind": "js",
-          "name": "Country",
+          "name": "CountryGroup",
           "declaration": {
-            "name": "Country",
-            "module": "src/lib/country/country.ts"
+            "name": "CountryGroup",
+            "module": "src/lib/country-group/country-group.ts"
           }
         }
       ]
     },
     {
       "kind": "javascript-module",
-      "path": "src/lib/country/definition.ts",
+      "path": "src/lib/country-group/definition.ts",
       "declarations": [
         {
           "kind": "variable",
-          "name": "registerCountry",
-          "description": "Registers the country element with the design system.",
+          "name": "registerCountryGroup",
+          "description": "Registers the country-group element with the design system.",
           "parameters": [
             {
               "description": "the prefix to use for the component name",
@@ -9319,22 +9668,28 @@
       "exports": [
         {
           "kind": "js",
-          "name": "registerCountry",
+          "name": "registerCountryGroup",
           "declaration": {
-            "name": "registerCountry",
-            "module": "src/lib/country/definition.ts"
+            "name": "registerCountryGroup",
+            "module": "src/lib/country-group/definition.ts"
           }
         },
         {
           "kind": "js",
-          "name": "VwcCountryElement",
+          "name": "VwcCountryGroupElement",
           "declaration": {
-            "name": "Country",
-            "module": "src/lib/country/definition.ts"
+            "name": "CountryGroup",
+            "module": "src/lib/country-group/definition.ts"
           }
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/country-group/locale.ts",
+      "declarations": [],
+      "exports": []
+    },
     {
       "kind": "javascript-module",
       "path": "src/lib/data-grid/data-grid-cell.ts",
@@ -10684,6 +11039,19 @@
                 "module": "src/shared/foundation/form-associated/form-associated.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "readOnly",
@@ -11150,6 +11518,18 @@
                 "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
               }
             },
+            {
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "fieldName": "scale",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "name": "readonly",
               "type": {
@@ -11488,6 +11868,19 @@
                 "module": "src/shared/foundation/form-associated/form-associated.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "readOnly",
@@ -11952,6 +12345,18 @@
                 "module": "src/shared/picker-field/mixins/min-max-calendar-picker.ts"
               }
             },
+            {
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "fieldName": "scale",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "name": "readonly",
               "type": {
@@ -12386,6 +12791,19 @@
                 "module": "src/shared/foundation/form-associated/form-associated.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "readOnly",
@@ -12868,6 +13286,18 @@
                 "module": "src/shared/picker-field/mixins/time-selection-picker.ts"
               }
             },
+            {
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "fieldName": "scale",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "name": "readonly",
               "type": {
@@ -16420,6 +16850,191 @@
       "declarations": [],
       "exports": []
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/flag/definition.ts",
+      "declarations": [
+        {
+          "kind": "variable",
+          "name": "registerFlag",
+          "description": "Registers the flag component & its prerequisite components with the design system.",
+          "parameters": [
+            {
+              "description": "the prefix to use for the component name",
+              "name": "prefix"
+            }
+          ]
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "registerFlag",
+          "declaration": {
+            "name": "registerFlag",
+            "module": "src/lib/flag/definition.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "VwcFlagElement",
+          "declaration": {
+            "name": "Flag",
+            "module": "src/lib/flag/definition.ts"
+          }
+        }
+      ]
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/lib/flag/flag.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "Flag",
+          "members": [
+            {
+              "kind": "field",
+              "name": "code",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from the Vivid/Vonage icon set).",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a (screen reader only) descriptive label for the flag.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "size",
+              "type": {
+                "text": "| -6\n\t\t| -5\n\t\t| -4\n\t\t| -3\n\t\t| -2\n\t\t| -1\n\t\t| 0\n\t\t| 1\n\t\t| 2\n\t\t| 3\n\t\t| 4\n\t\t| 5 | undefined"
+              },
+              "description": "Controls the rendered size. Uses the same scale and behavior as `Icon.size`.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "#currentRequestId",
+              "privacy": "private",
+              "type": {
+                "text": "number"
+              },
+              "default": "0"
+            },
+            {
+              "kind": "field",
+              "name": "#abortController",
+              "privacy": "private",
+              "type": {
+                "text": "AbortController | null"
+              },
+              "default": "null"
+            },
+            {
+              "kind": "field",
+              "name": "VIVID_VERSION",
+              "static": true,
+              "default": "__PACKAGE_VERSION__",
+              "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+              "type": {
+                "text": "string"
+              },
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "componentName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "description": "Core component name, without prefix",
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "code",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "ISO 3166-1 alpha-2 country code (e.g. \"GB\", \"UK\", \"US\"). When set, the component shows the\nmatching flag (from the Vivid/Vonage icon set).",
+              "fieldName": "code"
+            },
+            {
+              "name": "label",
+              "type": {
+                "text": "string | undefined"
+              },
+              "description": "Provides a (screen reader only) descriptive label for the flag.",
+              "fieldName": "label"
+            },
+            {
+              "name": "size",
+              "type": {
+                "text": "| -6\n\t\t| -5\n\t\t| -4\n\t\t| -3\n\t\t| -2\n\t\t| -1\n\t\t| 0\n\t\t| 1\n\t\t| 2\n\t\t| 3\n\t\t| 4\n\t\t| 5 | undefined"
+              },
+              "description": "Controls the rendered size. Uses the same scale and behavior as `Icon.size`.",
+              "fieldName": "size"
+            }
+          ],
+          "superclass": {
+            "name": "VividElement",
+            "module": "/src/shared/foundation/vivid-element/vivid-element"
+          },
+          "vividComponent": {
+            "public": true,
+            "name": "flag"
+          },
+          "vividTesting": {
+            "selectors": [],
+            "actions": [],
+            "queries": [
+              {
+                "name": "code",
+                "args": [
+                  "code"
+                ]
+              }
+            ],
+            "refs": []
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "Flag",
+          "declaration": {
+            "name": "Flag",
+            "module": "src/lib/flag/flag.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "VwcFlagElement",
+          "declaration": {
+            "name": "Flag",
+            "module": "src/lib/flag/flag.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/lib/header/definition.ts",
@@ -16616,54 +17231,10 @@
         }
       ]
     },
-    {
-      "kind": "javascript-module",
-      "path": "src/lib/icon/icon.placeholder.ts",
-      "declarations": [
-        {
-          "kind": "variable",
-          "name": "PLACEHOLDER_ICON",
-          "default": "`<svg width=\"80%\" height=\"80%\" viewBox=\"0 0 64 64\">\n    <g>\n        <g stroke-width=\"6\" stroke-linecap=\"round\" fill=\"none\">\n            <path stroke=\"currentColor\" d=\"M4,32 c0,15,12,28,28,28c8,0,16-4,21-9\">\n            </path>\n            <path d=\"M60,32 C60,16,47.464,4,32,4S4,16,4,32\">\n            </path>\n            <animateTransform values=\"0,32,32;360,32,32\" attributeName=\"transform\" type=\"rotate\" repeatCount=\"indefinite\" dur=\"750ms\">\n            </animateTransform>\n        </g>\n    </g>\n</svg>`"
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "PLACEHOLDER_ICON",
-          "declaration": {
-            "name": "PLACEHOLDER_ICON",
-            "module": "src/lib/icon/icon.placeholder.ts"
-          }
-        }
-      ]
-    },
     {
       "kind": "javascript-module",
       "path": "src/lib/icon/icon.ts",
       "declarations": [
-        {
-          "kind": "function",
-          "name": "resolveIcon",
-          "return": {
-            "type": {
-              "text": "Promise<string>"
-            }
-          },
-          "parameters": [
-            {
-              "name": "iconId",
-              "type": {
-                "text": "string | undefined"
-              }
-            },
-            {
-              "name": "signal",
-              "type": {
-                "text": "AbortSignal"
-              }
-            }
-          ]
-        },
         {
           "kind": "class",
           "description": "",
@@ -16842,14 +17413,6 @@
         }
       ],
       "exports": [
-        {
-          "kind": "js",
-          "name": "resolveIcon",
-          "declaration": {
-            "name": "resolveIcon",
-            "module": "src/lib/icon/icon.ts"
-          }
-        },
         {
           "kind": "js",
           "name": "Icon",
@@ -24182,6 +24745,11 @@
               "name": "#onThumbBlur",
               "privacy": "private"
             },
+            {
+              "kind": "field",
+              "name": "#onVisibilityChange",
+              "privacy": "private"
+            },
             {
               "kind": "field",
               "name": "#onMouseOver",
@@ -25542,6 +26110,13 @@
               },
               "default": "false"
             },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "OptionTagSize | undefined"
+              }
+            },
             {
               "kind": "field",
               "name": "VIVID_VERSION",
@@ -25600,6 +26175,13 @@
               },
               "default": "false",
               "fieldName": "disabled"
+            },
+            {
+              "name": "scale",
+              "type": {
+                "text": "OptionTagSize | undefined"
+              },
+              "fieldName": "scale"
             }
           ],
           "mixins": [
@@ -25704,8 +26286,8 @@
               "type": {
                 "text": "SearchableSelectAppearance | undefined"
               },
-              "privacy": "public",
-              "description": ""
+              "description": "Sets the appearance of the Searchable Select element.",
+              "privacy": "public"
             },
             {
               "kind": "field",
@@ -25713,8 +26295,17 @@
               "type": {
                 "text": "SearchableSelectShape | undefined"
               },
-              "privacy": "public",
-              "description": ""
+              "description": "Sets the shape of the Searchable Select element.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "SearchableSelectSize | undefined"
+              },
+              "description": "Sets the display size of the Searchable Select element.",
+              "privacy": "public"
             },
             {
               "kind": "field",
@@ -26463,6 +27054,7 @@
               "type": {
                 "text": "SearchableSelectAppearance | undefined"
               },
+              "description": "Sets the appearance of the Searchable Select element.",
               "fieldName": "appearance"
             },
             {
@@ -26470,8 +27062,17 @@
               "type": {
                 "text": "SearchableSelectShape | undefined"
               },
+              "description": "Sets the shape of the Searchable Select element.",
               "fieldName": "shape"
             },
+            {
+              "name": "scale",
+              "type": {
+                "text": "SearchableSelectSize | undefined"
+              },
+              "description": "Sets the display size of the Searchable Select element.",
+              "fieldName": "scale"
+            },
             {
               "name": "fixed-dropdown",
               "type": {
@@ -28796,6 +29397,13 @@
               },
               "description": "Fires when the value changes",
               "name": "change"
+            },
+            {
+              "type": {
+                "text": "Event"
+              },
+              "description": "Fires when the value of the element changes.",
+              "name": "input"
             }
           ],
           "attributes": [
@@ -29313,6 +29921,11 @@
               "kind": "method",
               "name": "#unregisterThumbListeners"
             },
+            {
+              "kind": "field",
+              "name": "#onVisibilityChange",
+              "privacy": "private"
+            },
             {
               "kind": "field",
               "name": "#onMouseOver",
@@ -34499,6 +35112,13 @@
               },
               "description": "Emits a custom 'change' event when the textarea emits a change event",
               "name": "change"
+            },
+            {
+              "type": {
+                "text": "Event"
+              },
+              "description": "Fires when the value of the element changes.",
+              "name": "input"
             }
           ],
           "attributes": [
@@ -35994,6 +36614,19 @@
                 "module": "src/shared/picker-field/mixins/time-selection-picker.ts"
               }
             },
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "privacy": "public",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "kind": "field",
               "name": "readOnly",
@@ -36453,6 +37086,18 @@
                 "module": "src/shared/picker-field/mixins/time-selection-picker.ts"
               }
             },
+            {
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "fieldName": "scale",
+              "inheritedFrom": {
+                "name": "PickerField",
+                "module": "src/shared/picker-field/picker-field.ts"
+              }
+            },
             {
               "name": "readonly",
               "type": {
@@ -48854,343 +49499,140 @@
           ],
           "attributes": [
             {
-              "name": "autofocus",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Determines if the element should receive document focus on page load.",
-              "fieldName": "autofocus"
-            },
-            {
-              "name": "form",
-              "type": {
-                "text": "string"
-              },
-              "description": "The id of a form to associate the element to.",
-              "fieldName": "formId"
-            },
-            {
-              "name": "formaction",
-              "type": {
-                "text": "string"
-              },
-              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
-              "fieldName": "formaction"
-            },
-            {
-              "name": "formenctype",
-              "type": {
-                "text": "string"
-              },
-              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
-              "fieldName": "formenctype"
-            },
-            {
-              "name": "formmethod",
-              "type": {
-                "text": "string"
-              },
-              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
-              "fieldName": "formmethod"
-            },
-            {
-              "name": "formnovalidate",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
-              "fieldName": "formnovalidate"
-            },
-            {
-              "name": "formtarget",
-              "type": {
-                "text": "'_self' | '_blank' | '_parent' | '_top'"
-              },
-              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
-              "fieldName": "formtarget"
-            },
-            {
-              "name": "type",
-              "type": {
-                "text": "'submit' | 'reset' | 'button'"
-              },
-              "description": "The button type.",
-              "fieldName": "type"
-            },
-            {
-              "name": "current-value",
-              "type": {
-                "text": "string"
-              },
-              "description": "The current value of the element.",
-              "fieldName": "value",
-              "inheritedFrom": {
-                "name": "FormAssociated",
-                "module": "src/shared/foundation/form-associated/form-associated.ts"
-              }
-            },
-            {
-              "name": "value",
-              "type": {
-                "text": "string"
-              },
-              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
-              "fieldName": "initialValue",
-              "inheritedFrom": {
-                "name": "FormAssociated",
-                "module": "src/shared/foundation/form-associated/form-associated.ts"
-              }
-            },
-            {
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "default": "false",
-              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
-              "fieldName": "disabled",
-              "inheritedFrom": {
-                "name": "FormAssociated",
-                "module": "src/shared/foundation/form-associated/form-associated.ts"
-              }
-            },
-            {
-              "name": "name",
-              "type": {
-                "text": "string"
-              },
-              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
-              "fieldName": "name",
-              "inheritedFrom": {
-                "name": "FormAssociated",
-                "module": "src/shared/foundation/form-associated/form-associated.ts"
-              }
-            },
-            {
-              "name": "required",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "Require the field to be completed prior to form submission.",
-              "default": "false",
-              "fieldName": "required",
-              "inheritedFrom": {
-                "name": "FormAssociated",
-                "module": "src/shared/foundation/form-associated/form-associated.ts"
-              }
-            }
-          ],
-          "mixins": [
-            {
-              "name": "DelegatesAria",
-              "module": "/src/shared/aria/delegates-aria"
-            },
-            {
-              "name": "FormAssociated",
-              "module": "/src/shared/foundation/form-associated/form-associated"
-            }
-          ],
-          "superclass": {
-            "name": "VividElement",
-            "module": "/src/shared/foundation/vivid-element/vivid-element"
-          }
-        }
-      ],
-      "exports": [
-        {
-          "kind": "js",
-          "name": "VividFoundationButton",
-          "declaration": {
-            "name": "VividFoundationButton",
-            "module": "src/shared/foundation/button/button.ts"
-          }
-        }
-      ]
-    },
-    {
-      "kind": "javascript-module",
-      "path": "src/shared/foundation/listbox/listbox.ts",
-      "declarations": [
-        {
-          "kind": "class",
-          "description": "",
-          "name": "Listbox",
-          "members": [
-            {
-              "kind": "field",
-              "name": "length",
-              "type": {
-                "text": "number"
-              },
-              "description": "The number of options.",
-              "privacy": "public",
-              "readonly": true
-            },
-            {
-              "kind": "field",
-              "name": "options",
-              "type": {
-                "text": "ListboxOption[]"
-              },
-              "description": "The list of options.",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "disabled",
-              "type": {
-                "text": "boolean"
-              },
-              "description": "The disabled state of the listbox.",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "selectedIndex",
-              "type": {
-                "text": "number"
-              },
-              "default": "-1",
-              "description": "The index of the selected option.",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "selectedOptions",
-              "type": {
-                "text": "ListboxOption[]"
-              },
-              "default": "[]",
-              "description": "A collection of the selected options.",
-              "privacy": "public"
-            },
-            {
-              "kind": "field",
-              "name": "slottedOptionFilter",
-              "static": true,
-              "description": "A static filter to include only selectable options.",
-              "parameters": [
-                {
-                  "description": "element to filter",
-                  "name": "n"
-                }
-              ],
-              "privacy": "public"
-            },
-            {
-              "kind": "method",
-              "name": "_validSelectedIndex",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "number"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "index",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "selectFirstOption",
-              "return": {
-                "type": {
-                  "text": "void"
-                }
-              },
-              "description": "Moves focus to the first selectable option.",
-              "privacy": "public"
-            },
-            {
-              "kind": "method",
-              "name": "_newDefaultSelectedIndex",
-              "privacy": "protected",
-              "return": {
-                "type": {
-                  "text": "number | null"
-                }
-              },
-              "parameters": [
-                {
-                  "name": "prev",
-                  "type": {
-                    "text": "ListboxOption[]"
-                  }
-                },
-                {
-                  "name": "next",
-                  "type": {
-                    "text": "ListboxOption[]"
-                  }
-                },
-                {
-                  "name": "currentSelectedIndex",
-                  "type": {
-                    "text": "number"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "_isDefaultSelected",
-              "privacy": "protected",
-              "parameters": [
-                {
-                  "name": "option",
-                  "type": {
-                    "text": "ListboxOption"
-                  }
-                }
-              ]
-            },
-            {
-              "kind": "method",
-              "name": "setSelectedOptions",
-              "privacy": "public",
-              "description": "Sets an option as selected and gives it focus."
-            },
-            {
-              "kind": "field",
-              "name": "VIVID_VERSION",
-              "static": true,
-              "default": "__PACKAGE_VERSION__",
-              "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
-              "type": {
-                "text": "string"
-              },
-              "inheritedFrom": {
-                "name": "VividElement",
-                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
-              }
-            },
-            {
-              "kind": "field",
-              "name": "componentName",
-              "type": {
-                "text": "string"
-              },
-              "static": true,
-              "description": "Core component name, without prefix",
-              "inheritedFrom": {
-                "name": "VividElement",
-                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
-              }
-            }
-          ],
-          "attributes": [
-            {
+              "name": "autofocus",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Determines if the element should receive document focus on page load.",
+              "fieldName": "autofocus"
+            },
+            {
+              "name": "form",
+              "type": {
+                "text": "string"
+              },
+              "description": "The id of a form to associate the element to.",
+              "fieldName": "formId"
+            },
+            {
+              "name": "formaction",
+              "type": {
+                "text": "string"
+              },
+              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
+              "fieldName": "formaction"
+            },
+            {
+              "name": "formenctype",
+              "type": {
+                "text": "string"
+              },
+              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
+              "fieldName": "formenctype"
+            },
+            {
+              "name": "formmethod",
+              "type": {
+                "text": "string"
+              },
+              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
+              "fieldName": "formmethod"
+            },
+            {
+              "name": "formnovalidate",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
+              "fieldName": "formnovalidate"
+            },
+            {
+              "name": "formtarget",
+              "type": {
+                "text": "'_self' | '_blank' | '_parent' | '_top'"
+              },
+              "description": "See https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button | <button> element for more details.",
+              "fieldName": "formtarget"
+            },
+            {
+              "name": "type",
+              "type": {
+                "text": "'submit' | 'reset' | 'button'"
+              },
+              "description": "The button type.",
+              "fieldName": "type"
+            },
+            {
+              "name": "current-value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The current value of the element.",
+              "fieldName": "value",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "value",
+              "type": {
+                "text": "string"
+              },
+              "description": "The default value of the element. This value sets the `value` property\nonly when the `value` property has not been explicitly set.",
+              "fieldName": "initialValue",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
               "name": "disabled",
               "type": {
                 "text": "boolean"
               },
-              "description": "The disabled state of the listbox.",
-              "fieldName": "disabled"
+              "default": "false",
+              "description": "Sets the element's disabled state. A disabled element will not be included during form submission.",
+              "fieldName": "disabled",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "name",
+              "type": {
+                "text": "string"
+              },
+              "description": "The name of the element. This element's value will be surfaced during form submission under the provided name.",
+              "fieldName": "name",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            },
+            {
+              "name": "required",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "Require the field to be completed prior to form submission.",
+              "default": "false",
+              "fieldName": "required",
+              "inheritedFrom": {
+                "name": "FormAssociated",
+                "module": "src/shared/foundation/form-associated/form-associated.ts"
+              }
+            }
+          ],
+          "mixins": [
+            {
+              "name": "DelegatesAria",
+              "module": "/src/shared/aria/delegates-aria"
+            },
+            {
+              "name": "FormAssociated",
+              "module": "/src/shared/foundation/form-associated/form-associated"
             }
           ],
           "superclass": {
@@ -49202,10 +49644,10 @@
       "exports": [
         {
           "kind": "js",
-          "name": "Listbox",
+          "name": "VividFoundationButton",
           "declaration": {
-            "name": "Listbox",
-            "module": "src/shared/foundation/listbox/listbox.ts"
+            "name": "VividFoundationButton",
+            "module": "src/shared/foundation/button/button.ts"
           }
         }
       ]
@@ -49721,6 +50163,209 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/shared/foundation/listbox/listbox.ts",
+      "declarations": [
+        {
+          "kind": "class",
+          "description": "",
+          "name": "Listbox",
+          "members": [
+            {
+              "kind": "field",
+              "name": "length",
+              "type": {
+                "text": "number"
+              },
+              "description": "The number of options.",
+              "privacy": "public",
+              "readonly": true
+            },
+            {
+              "kind": "field",
+              "name": "options",
+              "type": {
+                "text": "ListboxOption[]"
+              },
+              "description": "The list of options.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The disabled state of the listbox.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "selectedIndex",
+              "type": {
+                "text": "number"
+              },
+              "default": "-1",
+              "description": "The index of the selected option.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "selectedOptions",
+              "type": {
+                "text": "ListboxOption[]"
+              },
+              "default": "[]",
+              "description": "A collection of the selected options.",
+              "privacy": "public"
+            },
+            {
+              "kind": "field",
+              "name": "slottedOptionFilter",
+              "static": true,
+              "description": "A static filter to include only selectable options.",
+              "parameters": [
+                {
+                  "description": "element to filter",
+                  "name": "n"
+                }
+              ],
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "_validSelectedIndex",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "number"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "index",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "selectFirstOption",
+              "return": {
+                "type": {
+                  "text": "void"
+                }
+              },
+              "description": "Moves focus to the first selectable option.",
+              "privacy": "public"
+            },
+            {
+              "kind": "method",
+              "name": "_newDefaultSelectedIndex",
+              "privacy": "protected",
+              "return": {
+                "type": {
+                  "text": "number | null"
+                }
+              },
+              "parameters": [
+                {
+                  "name": "prev",
+                  "type": {
+                    "text": "ListboxOption[]"
+                  }
+                },
+                {
+                  "name": "next",
+                  "type": {
+                    "text": "ListboxOption[]"
+                  }
+                },
+                {
+                  "name": "currentSelectedIndex",
+                  "type": {
+                    "text": "number"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "_isDefaultSelected",
+              "privacy": "protected",
+              "parameters": [
+                {
+                  "name": "option",
+                  "type": {
+                    "text": "ListboxOption"
+                  }
+                }
+              ]
+            },
+            {
+              "kind": "method",
+              "name": "setSelectedOptions",
+              "privacy": "public",
+              "description": "Sets an option as selected and gives it focus."
+            },
+            {
+              "kind": "field",
+              "name": "VIVID_VERSION",
+              "static": true,
+              "default": "__PACKAGE_VERSION__",
+              "description": "The current version of the Vivid library, which is useful for debugging.\nIt can be accessed from any Vivid element via `<el>.constructor.VIVID_VERSION`.",
+              "type": {
+                "text": "string"
+              },
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            },
+            {
+              "kind": "field",
+              "name": "componentName",
+              "type": {
+                "text": "string"
+              },
+              "static": true,
+              "description": "Core component name, without prefix",
+              "inheritedFrom": {
+                "name": "VividElement",
+                "module": "src/shared/foundation/vivid-element/vivid-element.ts"
+              }
+            }
+          ],
+          "attributes": [
+            {
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "description": "The disabled state of the listbox.",
+              "fieldName": "disabled"
+            }
+          ],
+          "superclass": {
+            "name": "VividElement",
+            "module": "/src/shared/foundation/vivid-element/vivid-element"
+          }
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "Listbox",
+          "declaration": {
+            "name": "Listbox",
+            "module": "src/shared/foundation/listbox/listbox.ts"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/shared/foundation/progress/base-progress.ts",
@@ -51781,6 +52426,15 @@
           "description": "Base class for picker fields. Picker fields consist of a text field with a button that opens a popup that allows\npicking values.",
           "name": "PickerField",
           "members": [
+            {
+              "kind": "field",
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "privacy": "public"
+            },
             {
               "kind": "field",
               "name": "readOnly",
@@ -52148,6 +52802,14 @@
             }
           ],
           "attributes": [
+            {
+              "name": "scale",
+              "type": {
+                "text": "TextFieldSize | undefined"
+              },
+              "description": "Sets the display size of the picker field input element.",
+              "fieldName": "scale"
+            },
             {
               "name": "readonly",
               "type": {