@isoftdata/svelte-user-configuration 2.0.2 → 2.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/PermissionList.svelte +34 -41
  2. package/dist/UserAccountInfo.svelte +1 -1
  3. package/package.json +81 -78
package/dist/PermissionList.svelte CHANGED
@@ -1,4 +1,5 @@
1
1
  <script lang="ts">
2
+ import type { ButtonColors } from '@isoftdata/utility-bootstrap'
2
3
  import type { i18n } from 'i18next'
3
4
  import type { Merge } from 'type-fest'
4
5
  import type { IconName, SiteLabel, HTMLDivAttributes } from './'
@@ -9,13 +10,16 @@
9
10
  import Icon from '@isoftdata/svelte-icon'
10
11
  import Button from '@isoftdata/svelte-button'
11
12
  import Select from '@isoftdata/svelte-select'
12
- import { getEventValue } from '@isoftdata/browser-event'
13
+ import { getEventValueEnum } from '@isoftdata/browser-event'
13
14
  import { Table, Td, type Column } from '@isoftdata/svelte-table'
14
15
  import { translate as defaultTranslate } from '@isoftdata/utility-string'
15
16
  import { SvelteSet, SvelteMap } from 'svelte/reactivity'
17
+ import { RadioButtonGroup } from '@isoftdata/svelte-checkbox'
18
+ import Badge from '@isoftdata/svelte-badge'
16
19
 
17
20
  const { t: translate } = getContext<i18n>('i18next') || { t: defaultTranslate }
18
21
 
22
+ type Scope = 'NONE' | 'SITE' | 'GLOBAL'
19
23
  type Permission = {
20
24
  id: number
21
25
  displayName: string
@@ -59,7 +63,7 @@
59
63
  let selectedPermissionValue: string | null = $state(null)
60
64
 
61
65
  const permissionColumns: ComputedPermissionColumns = getColumns(groupPermissionValueMap)
62
- const permissionValueList = {
66
+ const permissionValueList: Record<Scope, { label: string; value: Scope; color: ButtonColors }> = {
63
67
  NONE: { label: translate('common:permissionLevel.none', 'None'), value: 'NONE', color: 'danger' },
64
68
  SITE: {
65
69
  label: translate(`common:permissionLevel.${siteLabel.toLowerCase()}`, siteLabel),
@@ -68,6 +72,7 @@
68
72
  },
69
73
  GLOBAL: { label: translate('common:permissionLevel.global', 'Global'), value: 'GLOBAL', color: 'success' },
70
74
  }
75
+ const permissionValues = Object.values(permissionValueList)
71
76
 
72
77
  function getColumns(groupPermissionValueMap: PermissionValueMap | undefined): ComputedPermissionColumns {
73
78
  let columns: ComputedPermissionColumns = [
@@ -119,25 +124,16 @@
119
124
  }
120
125
  }
121
126
 
122
- const getButtonColor = (optionValue: string, permissionValue: PermissionValue) =>
123
- optionValue === permissionValue ? permissionValueList[optionValue].color : 'outline-secondary'
124
-
125
- const isValidPermissionValue = (value: string): value is PermissionValue =>
126
- Object.keys(permissionValueList).includes(value)
127
-
128
- async function updatePermissionValues(event: Event, permissionIds: SvelteSet<number>) {
129
- const newValue = getEventValue(event)
130
- if (isValidPermissionValue(newValue)) {
131
- const permissionIdsArray = Array.from(permissionIds)
132
- for (const id of permissionIdsArray) {
133
- permissionValueMap.set(id, newValue)
134
- }
135
- permissionValueMap = permissionValueMap
136
- await permissionValueChange?.({
137
- value: newValue,
138
- permissionIds: permissionIdsArray,
139
- })
127
+ async function updatePermissionValues(newValue: Scope, permissionIds: SvelteSet<number>) {
128
+ const permissionIdsArray = Array.from(permissionIds)
129
+ for (const id of permissionIdsArray) {
130
+ permissionValueMap.set(id, newValue)
140
131
  }
132
+ permissionValueMap = permissionValueMap
133
+ await permissionValueChange?.({
134
+ value: newValue,
135
+ permissionIds: permissionIdsArray,
136
+ })
141
137
  }
142
138
 
143
139
  function getComputedPermissions(
@@ -161,9 +157,7 @@
161
157
  })
162
158
  }
163
159
 
164
- let computedPermissions = $derived.by(() =>
165
- getComputedPermissions(permissions, permissionValueMap, groupPermissionValueMap),
166
- )
160
+ let computedPermissions = $derived(getComputedPermissions(permissions, permissionValueMap, groupPermissionValueMap))
167
161
 
168
162
  $inspect(computedPermissions)
169
163
  </script>
@@ -184,6 +178,7 @@
184
178
  <div class="card-body">
185
179
  <Table
186
180
  class="mb-0"
181
+ idProp="id"
187
182
  parentClass="mh-60vh overflow-y-auto"
188
183
  filterPlaceholder={translate('common:filterPermissions', 'Filter Permissions')}
189
184
  filterColumnClass="col-6 col-lg-4 align-self-end"
@@ -203,19 +198,12 @@
203
198
  class="btn-group btn-group-toggle"
204
199
  data-toggle="buttons"
205
200
  >
206
- {#each Object.values(permissionValueList) as permissionValue}
207
- <label class="btn btn-sm btn-{getButtonColor(permissionValue.value, permission.value)} cursor-pointer">
208
- <input
209
- class="btn-check"
210
- type="radio"
211
- autocomplete="off"
212
- name={permission.value}
213
- value={permissionValue.value}
214
- onchange={e => updatePermissionValues(e, new SvelteSet([permission.id]))}
215
- />
216
- {permissionValue.label}
217
- </label>
218
- {/each}
201
+ <RadioButtonGroup
202
+ options={permissionValues}
203
+ value={permission.value}
204
+ unselectedColor="secondary"
205
+ change={value => updatePermissionValues(value, new SvelteSet([permission.id]))}
206
+ ></RadioButtonGroup>
219
207
  </div>
220
208
  </Td>
221
209
  {#if groupPermissionValueMap}
@@ -223,16 +211,20 @@
223
211
  property="groupValue"
224
212
  class="px-4"
225
213
  >
226
- <span class="badge badge-pill bg-{permissionValueList[permission.groupValue ?? 'NONE'].color}"
227
- >{permissionValueList[permission.groupValue ?? 'NONE'].label}</span
214
+ <Badge
215
+ pill
216
+ color={permissionValueList[permission.groupValue ?? 'NONE'].color}
217
+ >{permissionValueList[permission.groupValue ?? 'NONE'].label}</Badge
228
218
  >
229
219
  </Td>
230
220
  <Td
231
221
  property="computedValue"
232
222
  class="px-4"
233
223
  >
234
- <span class="badge badge-pill bg-{permissionValueList[permission.computedValue ?? 'NONE'].color}"
235
- >{permissionValueList[permission.computedValue ?? 'NONE'].label}</span
224
+ <Badge
225
+ pill
226
+ color={permissionValueList[permission.computedValue ?? 'NONE'].color}
227
+ >{permissionValueList[permission.computedValue ?? 'NONE'].label}</Badge
236
228
  >
237
229
  </Td>
238
230
  {/if}
@@ -255,7 +247,8 @@
255
247
  labelClass="mr-2 me-2 p-0"
256
248
  disabled={selectedPermissionIds.size === 0}
257
249
  onchange={e => {
258
- updatePermissionValues(e, selectedPermissionIds)
250
+ const value = getEventValueEnum(e, 'NONE', 'SITE', 'GLOBAL')
251
+ updatePermissionValues(value, selectedPermissionIds)
259
252
  selectedPermissionIds.clear()
260
253
  selectedPermissionValue = null
261
254
  }}
package/dist/UserAccountInfo.svelte CHANGED
@@ -347,7 +347,7 @@
347
347
  iconClass="paper-plane"
348
348
  disabled={!canEditAccountInfo}
349
349
  onclick={() => {
350
- passwordRecoveryModal?.open(userAccount.workEmail, userAccount.lastPasswordResetDate)
350
+ passwordRecoveryModal?.open(userAccount.recoveryEmail, userAccount.lastPasswordResetDate)
351
351
  }}
352
352
  >
353
353
  {translate('configuration.user.sendResetToken', 'Send Reset Token')}...
package/package.json CHANGED
@@ -1,78 +1,81 @@
1
- {
2
- "name": "@isoftdata/svelte-user-configuration",
3
- "version": "2.0.2",
4
- "exports": {
5
- ".": {
6
- "types": "./dist/index.d.ts",
7
- "svelte": "./dist/index.js"
8
- }
9
- },
10
- "sideEffects": [
11
- "**/*.css"
12
- ],
13
- "files": [
14
- "dist",
15
- "!dist/**/*.test.*",
16
- "!dist/**/*.spec.*"
17
- ],
18
- "peerDependencies": {
19
- "svelte": "^5.23.2"
20
- },
21
- "devDependencies": {
22
- "@fortawesome/fontawesome-common-types": "^6.7.2",
23
- "@isoftdata/prettier-config": "^2.0.4",
24
- "@isoftdata/svelte-bootstrap-version-switcher": "^1.1.0",
25
- "@sveltejs/adapter-auto": "^6.0.0",
26
- "@sveltejs/kit": "^2.5.27",
27
- "@sveltejs/package": "^2.3.7",
28
- "@sveltejs/vite-plugin-svelte": "^5.0.3",
29
- "@types/eslint": "^9.6.0",
30
- "eslint": "^9.0.0",
31
- "eslint-config-prettier": "^9.1.0",
32
- "eslint-plugin-svelte": "^2.45.1",
33
- "globals": "^15.0.0",
34
- "i18next": "^24.2.1",
35
- "prettier": "^3.1.1",
36
- "prettier-plugin-svelte": "^3.2.6",
37
- "publint": "^0.2.0",
38
- "svelte": "^5.0.0",
39
- "svelte-check": "^4.0.0",
40
- "type-fest": "^4.33.0",
41
- "typescript": "^5.5.0",
42
- "typescript-eslint": "^8.0.0",
43
- "vite": "^6.2.5"
44
- },
45
- "svelte": "./dist/index.js",
46
- "types": "./dist/index.d.ts",
47
- "type": "module",
48
- "prettier": "@isoftdata/prettier-config",
49
- "dependencies": {
50
- "@isoftdata/browser-event": "^2.3.2",
51
- "@isoftdata/svelte-button": "^2.1.0",
52
- "@isoftdata/svelte-checkbox": "^2.0.1",
53
- "@isoftdata/svelte-icon": "^2.0.0",
54
- "@isoftdata/svelte-input": "^2.0.1",
55
- "@isoftdata/svelte-modal": "^2.0.4",
56
- "@isoftdata/svelte-password-fields": "^1.5.0",
57
- "@isoftdata/svelte-select": "^2.0.1",
58
- "@isoftdata/svelte-table": "^2.1.1",
59
- "@isoftdata/svelte-textarea": "^2.0.0",
60
- "@isoftdata/utility-string": "^2.1.0",
61
- "just-camel-case": "^6.2.0",
62
- "klona": "^2.0.6",
63
- "svelte": "^5.23.2"
64
- },
65
- "engines": {
66
- "pnpm": "10.x"
67
- },
68
- "scripts": {
69
- "dev": "vite dev",
70
- "build": "vite build && npm run package",
71
- "preview": "vite preview",
72
- "package": "svelte-kit sync && svelte-package && publint",
73
- "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
74
- "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
75
- "lint": "prettier --check . && eslint .",
76
- "format": "prettier --write ."
77
- }
78
- }
1
+ {
2
+ "name": "@isoftdata/svelte-user-configuration",
3
+ "version": "2.0.4",
4
+ "scripts": {
5
+ "dev": "vite dev",
6
+ "build": "vite build && npm run package",
7
+ "preview": "vite preview",
8
+ "package": "svelte-kit sync && svelte-package && publint",
9
+ "prepublishOnly": "npm run package",
10
+ "check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
11
+ "check:watch": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json --watch",
12
+ "lint": "prettier --check . && eslint .",
13
+ "format": "prettier --write ."
14
+ },
15
+ "exports": {
16
+ ".": {
17
+ "types": "./dist/index.d.ts",
18
+ "svelte": "./dist/index.js"
19
+ }
20
+ },
21
+ "sideEffects": [
22
+ "**/*.css"
23
+ ],
24
+ "files": [
25
+ "dist",
26
+ "!dist/**/*.test.*",
27
+ "!dist/**/*.spec.*"
28
+ ],
29
+ "peerDependencies": {
30
+ "svelte": "^5.23.2"
31
+ },
32
+ "devDependencies": {
33
+ "@fortawesome/fontawesome-common-types": "^6.7.2",
34
+ "@isoftdata/prettier-config": "^2.0.4",
35
+ "@isoftdata/svelte-bootstrap-version-switcher": "^1.1.0",
36
+ "@sveltejs/adapter-auto": "^6.0.0",
37
+ "@sveltejs/kit": "^2.5.27",
38
+ "@sveltejs/package": "^2.3.7",
39
+ "@sveltejs/vite-plugin-svelte": "^5.0.3",
40
+ "@types/eslint": "^9.6.0",
41
+ "eslint": "^9.0.0",
42
+ "eslint-config-prettier": "^9.1.0",
43
+ "eslint-plugin-svelte": "^2.45.1",
44
+ "globals": "^15.0.0",
45
+ "i18next": "^24.2.1",
46
+ "prettier": "^3.1.1",
47
+ "prettier-plugin-svelte": "^3.2.6",
48
+ "publint": "^0.2.0",
49
+ "svelte": "^5.0.0",
50
+ "svelte-check": "^4.0.0",
51
+ "type-fest": "^4.33.0",
52
+ "typescript": "^5.5.0",
53
+ "typescript-eslint": "^8.0.0",
54
+ "vite": "^6.2.5"
55
+ },
56
+ "svelte": "./dist/index.js",
57
+ "types": "./dist/index.d.ts",
58
+ "type": "module",
59
+ "prettier": "@isoftdata/prettier-config",
60
+ "dependencies": {
61
+ "@isoftdata/browser-event": "^2.3.2",
62
+ "@isoftdata/svelte-badge": "^1.0.0",
63
+ "@isoftdata/svelte-button": "^2.1.0",
64
+ "@isoftdata/svelte-checkbox": "^2.6.1",
65
+ "@isoftdata/svelte-icon": "^2.0.0",
66
+ "@isoftdata/svelte-input": "^2.0.1",
67
+ "@isoftdata/svelte-modal": "^2.0.4",
68
+ "@isoftdata/svelte-password-fields": "^1.5.0",
69
+ "@isoftdata/svelte-select": "^2.0.1",
70
+ "@isoftdata/svelte-table": "^2.8.0",
71
+ "@isoftdata/svelte-textarea": "^2.0.0",
72
+ "@isoftdata/utility-bootstrap": "^2.2.1",
73
+ "@isoftdata/utility-string": "^2.1.0",
74
+ "just-camel-case": "^6.2.0",
75
+ "klona": "^2.0.6",
76
+ "svelte": "^5.23.2"
77
+ },
78
+ "engines": {
79
+ "pnpm": "10.x"
80
+ }
81
+ }