diff --git a/.gitignore b/.gitignore index c202c3e49..ffc1611d8 100644 --- a/.gitignore +++ b/.gitignore @@ -18,6 +18,7 @@ node_modules/ # Build artifacts dist/ +dist-demo/ examples/**/dist packages/**/dist diff --git a/.vscode/settings.json b/.vscode/settings.json index b8142104e..5edfa39dd 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -21,7 +21,7 @@ "editor.formatOnSave": true }, "[typescript]": { - "editor.defaultFormatter": "esbenp.prettier-vscode", + "editor.defaultFormatter": "dbaeumer.vscode-eslint", "editor.formatOnSave": true }, "[vue]": { diff --git a/packages/ui-solid/fixtures/xforms/socio-economic-survey.xml b/packages/ui-solid/fixtures/xforms/socio-economic-survey.xml new file mode 100644 index 000000000..a29fd0455 --- /dev/null +++ b/packages/ui-solid/fixtures/xforms/socio-economic-survey.xml @@ -0,0 +1,1505 @@ + + + + Socio-economic Survey + + + + + Sindh + + + Punjab + + + Balochistan + + + Khyber Pakhunkhwan + + + Azad Kashmir & Gilgit + + + Karachi + + + Sakhar + + + Hyderabad + + + Tando Turel + + + Thatta & Shah Bunder + + + Hafizabad + + + Lahore & Sialkot + + + Multan & Bahawalpur + + + Rawalpindi + + + Sargodha + + + Arkari + + + Chitral Town + + + Garamchashma + + + Madaklasht + + + Parabeg + + + Shoghore + + + Susum + + + Bang + + + Booni + + + Brep + + + Khot + + + Laspur + + + Chatoorkhand + + + Damas + + + Gahkuch + + + Immit + + + Ishkoman + + + Sherquilla + + + Singal + + + Gilgit + + + Skardu + + + Sul, Dan & Oshikhandas + + + Not willing to disclose + + + Less than 10,000 + + + 10,001 to 50,000 + + + 50,001 to 60,000 + + + 60,001 to 75,000 + + + 75,001 to 100,000 + + + 100,001 to 200,000 + + + Above 200,000 + + + Unknown + + + Lower + + + Lower + + + Middle + + + Middle + + + Middle + + + Upper-middle + + + Upper + + + Yes + + + No + + + I don't know + + + Access available in area, but my HH is not interested + + + Cable / LAN / DSL + + + No internet access (in the area) + + + Available through 2G + + + Available through 3G / 4G + + + I don't know + + + Other + + + Male + + + Female + + + Other + + + LHV or Community Health Worker + + + Government clinic + + + Private clinic + + + NGO Clinic + + + Traditional healers + + + Pharmacist + + + Other + + + Facility not available in the area + + + Lack of funds + + + Lack of time + + + Healthy - no need + + + Not mobile (bed bound / disabled) + + + Security concerns + + + Prefer traditional healers + + + Prefer home remedies / self-medication + + + Other + + + Diabetes + + + Cardiovascular (Heart) + + + Hypertension + + + Chronic kidney problem + + + Respiratory related (Asthma, lung infection) + + + Arthritis + + + Cancer + + + Mental health (Depression, etc) + + + Other + + + Not applicable + + + I don't know + + + Fluent + + + Moderate + + + Low + + + No + + + don't know + + + Household Information + + + Region + + + District + + + Residential Address + + + Primary contact no. + + + Secondary contact no. + + + Household monthly income + + + se_list + + + Economic Class + + + Internet Access + + + Does the household have access to internet? + + + Type of internet access / coverage + + + Household members + + + Person + + + First name + + + Gender + + + Health + + + Have they visited doctor / hospital in last 12 months? + + + Type of facility accessed? + + + Reason for not accessing health facility? + + + Have they been diagnosed and prescribed a medicine for any diseases? + + + Level of English proficiency: + + + Component + + + Read + + + Write + + + Speak + + + Listen + + + Other Comments + + + + + Sind + + + Pendjab + + + Baloutchistan + + + Khyber Pakhunkhwan + + + Azad Cachemire et Gilgit + + + Karachi + + + Sakhar + + + Hyderâbâd + + + Tando Turel + + + Thatta et Shah Bunder + + + Hafizabad + + + Lahore et Sialkot + + + Multan et Bahawalpur + + + Rawalpindi + + + Sargodha + + + Arkari + + + Ville de Chitral + + + Garamchashma + + + Madaklasht + + + Parabeg + + + Shohore + + + Susum + + + Claquer + + + Booni + + + Brep + + + Khot + + + Laspur + + + Chatoorkhand + + + Damas + + + Gahkuch + + + Immettre + + + Ishkoman + + + Sherquilla + + + Singal + + + Gilgit + + + Skardu + + + Sul, Dan et Oshikhandas + + + Ne veut pas divulguer + + + Moins de 10 000 + + + 10 001 à 50 000 + + + 50 001 à 60 000 + + + 60 001 à 75 000 + + + 75 001 à 100 000 + + + 100 001 à 200 000 + + + Au-dessus de 200 000 + + + Inconnu + + + Inférieur + + + Inférieur + + + Milieu + + + Milieu + + + Milieu + + + Moyenne supérieure + + + Supérieur + + + Oui + + + Non + + + Je ne sais pas + + + Accès disponible dans la zone, mais mon ménage n'est pas intéressé + + + Câble / LAN / DSL + + + Pas d'accès internet (dans la région) + + + Disponible via 2G + + + Disponible via 3G / 4G + + + Je ne sais pas + + + Autre + + + Mâle + + + Femelle + + + Autre + + + LHV ou Agent de Santé Communautaire + + + Clinique gouvernementale + + + Clinique privée + + + Clinique des ONG + + + Guérisseurs traditionnels + + + Pharmacien + + + Autre + + + Installation non disponible dans la région + + + Manque de fonds + + + Manque de temps + + + Sain - pas besoin + + + Non mobile (lié au lit / handicapé) + + + Problèmes de sécurité + + + Préférez les guérisseurs traditionnels + + + Préférer les remèdes maison/automédication + + + Autre + + + Diabète + + + Cardiovasculaire (Cœur) + + + Hypertension + + + Problème rénal chronique + + + Problèmes respiratoires (asthme, infection pulmonaire) + + + Arthrite + + + Cancer + + + Santé mentale (dépression, etc.) + + + Autre + + + N'est pas applicable + + + Je ne sais pas + + + Courant + + + Modéré + + + Faible + + + Non + + + je ne sais pas + + + Informations sur le ménage + + + Région + + + District + + + Adresse résidentielle + + + Numéro de contact principal + + + Numéro de contact secondaire + + + revenu mensuel des ménages + + + se_list + + + Classe économique + + + Accès Internet + + + Type d'accès / couverture Internet + + + Type d'accès / couverture Internet + + + Membres du foyer + + + Personne + + + Prénom + + + Genre + + + Santé + + + Ont-ils consulté un médecin/un hôpital au cours des 12 derniers mois ? + + + Type d'établissement consulté ? + + + Raison pour laquelle vous n'avez pas accès aux établissements de santé ? + + + Ont-ils été diagnostiqués et prescrits des médicaments pour des maladies ? + + + Niveau de maîtrise de l'anglais : + + + Composant + + + Lire + + + Écrire + + + Parler + + + Écouter + + + Autres commentaires + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + region-0 + Sindh + + + region-1 + Punjab + + + region-2 + Balochistan + + + region-3 + KP + + + region-4 + AKG + + + + + + + district-0 + Garden + Sindh + + + district-1 + Gulshan + Sindh + + + district-2 + Hyderabad + Sindh + + + district-3 + TandoTurel + Sindh + + + district-4 + Thatta&ShahBunder + Sindh + + + district-5 + Hafizabad + Punjab + + + district-6 + Lahore&Sialkot + Punjab + + + district-7 + Multan&Bahawalpur + Punjab + + + district-8 + Rawalpindi + Punjab + + + district-9 + Sargodha + Punjab + + + district-10 + Arkari + KP + + + district-11 + ChitralTown + KP + + + district-12 + Garamchashma + KP + + + district-13 + Madaklasht + KP + + + district-14 + Parabeg + KP + + + district-15 + Shoghore + KP + + + district-16 + Susum + KP + + + district-17 + Bang + KP + + + district-18 + Booni + KP + + + district-19 + Brep + KP + + + district-20 + Khot + KP + + + district-21 + Laspur + KP + + + district-22 + Chatoorkhand + Balochistan + + + district-23 + Damas + Balochistan + + + district-24 + Gahkuch + Balochistan + + + district-25 + Immit + Balochistan + + + district-26 + Ishkoman + Balochistan + + + district-27 + Sherquilla + Balochistan + + + district-28 + Singal + Balochistan + + + district-29 + Gilgit + AKG + + + district-30 + Skardu + AKG + + + district-31 + Sul,Dan&Oshikhandas + AKG + + + + + + + monthlyIncome-0 + 1 + + + monthlyIncome-1 + 2 + + + monthlyIncome-2 + 3 + + + monthlyIncome-3 + 4 + + + monthlyIncome-4 + 5 + + + monthlyIncome-5 + 6 + + + monthlyIncome-6 + 7 + + + monthlyIncome-7 + 8 + + + + + + + seclass-0 + 1 + + + seclass-1 + 2 + + + seclass-2 + 3 + + + seclass-3 + 4 + + + seclass-4 + 5 + + + seclass-5 + 6 + + + seclass-6 + 7 + + + seclass-7 + 8 + + + + + + + yesNoIdk-0 + 1 + + + yesNoIdk-1 + 2 + + + yesNoIdk-2 + 3 + + + + + + + internetType-0 + 1 + + + internetType-1 + 2 + + + internetType-2 + 3 + + + internetType-3 + 4 + + + internetType-4 + 5 + + + internetType-5 + 6 + + + internetType-6 + 7 + + + + + + + gender-0 + 1 + + + gender-1 + 2 + + + gender-2 + 3 + + + + + + + healthFacility-0 + 1 + + + healthFacility-1 + 2 + + + healthFacility-2 + 3 + + + healthFacility-3 + 4 + + + healthFacility-4 + 5 + + + healthFacility-5 + 6 + + + healthFacility-6 + 7 + + + + + + + reasonForNoHealthVisit-0 + 1 + + + reasonForNoHealthVisit-1 + 2 + + + reasonForNoHealthVisit-2 + 3 + + + reasonForNoHealthVisit-3 + 4 + + + reasonForNoHealthVisit-4 + 5 + + + reasonForNoHealthVisit-5 + 6 + + + reasonForNoHealthVisit-6 + 7 + + + reasonForNoHealthVisit-7 + 8 + + + reasonForNoHealthVisit-8 + 9 + + + + + + + diseases-0 + 1 + + + diseases-1 + 2 + + + diseases-2 + 3 + + + diseases-3 + 4 + + + diseases-4 + 5 + + + diseases-5 + 6 + + + diseases-6 + 7 + + + diseases-7 + 8 + + + diseases-8 + 9 + + + diseases-9 + 10 + + + diseases-10 + 11 + + + + + + + languageLevel-0 + 1 + + + languageLevel-1 + 2 + + + languageLevel-2 + 3 + + + languageLevel-3 + 4 + + + languageLevel-4 + 5 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/ui-solid/fixtures/xforms/validation/1-validation.xml b/packages/ui-solid/fixtures/xforms/validation/1-validation.xml new file mode 100644 index 000000000..4d8022c6d --- /dev/null +++ b/packages/ui-solid/fixtures/xforms/validation/1-validation.xml @@ -0,0 +1,93 @@ + + + + Validation Form + + + + + Please enter your profession + + + It has to be two + + + + + اپنا پروفیشن بتائیں + + + صرف دو ہی ہوسکتی ہیں + + + + + + + + + + + + + + + + + + + + pk + + + + ca + + + + us + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/packages/web-forms/README.md b/packages/web-forms/README.md index a2cb7c34c..8c6746519 100644 --- a/packages/web-forms/README.md +++ b/packages/web-forms/README.md @@ -63,4 +63,12 @@ To update the icons using the [IcoMoon website](https://icomoon.io/app/): By following the steps above, you should minimize the diff. However, in the JSON file, you may still see changes for properties like `id`, `iconIdx`, `setId`, and `setIdx`. -Material Icons are available under the Apache License Version 2.0. Copy of the license can be found at [`./src/assets/fonts/LICENSE-2.0.txt`](./src/assets/fonts/LICENSE-2.0.txt) +Material Icons are available under the Apache License Version 2.0. Copy of the license can be found at [`./src/assets/fonts/icomoon/LICENSE-2.0.txt`](./src/assets/fonts/LICENSE-2.0.txt) + + +================ + +To download fonts from Google Fonts API: + +curl "https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap" -H 'user-agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/127.0.0.0 Safari/537.36' \ + | grep src | cut -d\( -f2 | cut -d\) -f1 | xargs -I {} wget {} \ No newline at end of file diff --git a/packages/web-forms/icomoon.json b/packages/web-forms/icomoon.json index a2b196a1e..51cd29841 100644 --- a/packages/web-forms/icomoon.json +++ b/packages/web-forms/icomoon.json @@ -532,6 +532,54 @@ "setIdx": 0, "setId": 0, "iconIdx": 22 + }, + { + "icon": { + "paths": [ + "M554 554v-256h-84v256h84zM554 726v-86h-84v86h84zM512 86q176 0 301 125t125 301-125 301-301 125-301-125-125-301 125-301 301-125z" + ], + "attrs": [], + "isMulticolor": false, + "isMulticolor2": false, + "tags": ["error"], + "grid": 24 + }, + "attrs": [], + "properties": { + "ligatures": "error", + "id": 46, + "order": 347, + "prevSize": 48, + "code": 59671, + "name": "error" + }, + "setIdx": 0, + "setId": 0, + "iconIdx": 23 + }, + { + "icon": { + "paths": [ + "M512 854q140 0 241-101t101-241-101-241-241-101-241 101-101 241 101 241 241 101zM512 86q176 0 301 125t125 301-125 301-301 125-301-125-125-301 125-301 301-125zM470 298h84v256h-84v-256zM470 640h84v86h-84v-86z" + ], + "attrs": [], + "isMulticolor": false, + "isMulticolor2": false, + "tags": ["error_outline"], + "grid": 24 + }, + "attrs": [], + "properties": { + "ligatures": "error_outline", + "id": 71, + "order": 373, + "prevSize": 48, + "code": 59672, + "name": "error_outline" + }, + "setIdx": 0, + "setId": 0, + "iconIdx": 24 } ], "height": 1024, diff --git a/packages/web-forms/package.json b/packages/web-forms/package.json index 15d33c0ed..cbd51ce94 100644 --- a/packages/web-forms/package.json +++ b/packages/web-forms/package.json @@ -28,8 +28,9 @@ }, "scripts": { "build": "npm-run-all -nl build:*", - "build:clean": "rimraf dist/", + "build:clean": "rimraf dist/ dist-demo/", "build:js": "vite build", + "build:demo": "vite build --mode demo --outDir dist-demo", "build-preview": "yarn build && yarn vite serve build-preview --port 5174", "dev": "vite", "test": "npm-run-all -nl test:*", @@ -51,14 +52,14 @@ "@faker-js/faker": "^8.4.1", "@getodk/xforms-engine": "0.2.0", "@playwright/test": "^1.45.1", + "@primevue/themes": "^4.0.4", "@types/ramda": "^0.30.1", "@vitejs/plugin-vue": "^5.0.5", "@vitejs/plugin-vue-jsx": "^4.0.0", "@vue/test-utils": "^2.4.6", "jsdom": "^24.1.0", "primeflex": "^3.3.1", - "primevue": "^3.53.0", - "primevue-sass-theme": "https://github.com/primefaces/primevue-sass-theme.git#3.52.0", + "primevue": "^4.0.4", "ramda": "^0.30.1", "sass": "^1.77.2", "vite": "^5.3.3", diff --git a/packages/web-forms/src/OdkWebFormDemo.vue b/packages/web-forms/src/OdkWebFormDemo.vue index a90d43e38..296cabbd6 100644 --- a/packages/web-forms/src/OdkWebFormDemo.vue +++ b/packages/web-forms/src/OdkWebFormDemo.vue @@ -23,12 +23,17 @@ const handleSubmit = () => { const showForm = (form: [string, string]) => { selectForm.value = form; history.pushState({form: form }, "", "/" + form[0]); + window.scrollTo(0,0); } interface PopStateEventWithForm extends PopStateEvent { state: {form: [string, string]}; } +if ('scrollRestoration' in history) { + history.scrollRestoration = 'manual'; +} + window.addEventListener("popstate", (event:PopStateEventWithForm) => { if(!event.state) { selectForm.value = null; @@ -49,9 +54,9 @@ if(location.pathname != '/'){ } -