mtrl 0.3.6 → 0.3.8
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.
- package/package.json +2 -2
- package/src/components/button/api.ts +16 -0
- package/src/components/button/types.ts +9 -0
- package/src/components/menu/api.ts +61 -22
- package/src/components/menu/config.ts +10 -8
- package/src/components/menu/features/anchor.ts +254 -19
- package/src/components/menu/features/controller.ts +724 -271
- package/src/components/menu/features/index.ts +11 -2
- package/src/components/menu/features/position.ts +353 -0
- package/src/components/menu/index.ts +5 -5
- package/src/components/menu/menu.ts +21 -61
- package/src/components/menu/types.ts +30 -16
- package/src/components/select/api.ts +78 -0
- package/src/components/select/config.ts +76 -0
- package/src/components/select/features.ts +331 -0
- package/src/components/select/index.ts +38 -0
- package/src/components/select/select.ts +73 -0
- package/src/components/select/types.ts +355 -0
- package/src/components/textfield/api.ts +78 -6
- package/src/components/textfield/features/index.ts +17 -0
- package/src/components/textfield/features/leading-icon.ts +127 -0
- package/src/components/textfield/features/placement.ts +149 -0
- package/src/components/textfield/features/prefix-text.ts +107 -0
- package/src/components/textfield/features/suffix-text.ts +100 -0
- package/src/components/textfield/features/supporting-text.ts +113 -0
- package/src/components/textfield/features/trailing-icon.ts +108 -0
- package/src/components/textfield/textfield.ts +51 -15
- package/src/components/textfield/types.ts +70 -0
- package/src/core/collection/adapters/base.ts +62 -0
- package/src/core/collection/collection.ts +300 -0
- package/src/core/collection/index.ts +57 -0
- package/src/core/collection/list-manager.ts +333 -0
- package/src/index.ts +4 -45
- package/src/styles/abstract/_variables.scss +18 -0
- package/src/styles/components/_button.scss +21 -5
- package/src/styles/components/{_chip.scss → _chips.scss} +118 -4
- package/src/styles/components/_menu.scss +97 -24
- package/src/styles/components/_select.scss +272 -0
- package/src/styles/components/_textfield.scss +233 -42
- package/src/styles/main.scss +2 -1
- package/src/components/textfield/features.ts +0 -322
- package/src/core/collection/adapters/base.js +0 -26
- package/src/core/collection/collection.js +0 -259
- package/src/core/collection/list-manager.js +0 -157
- /package/src/core/collection/adapters/{route.js → route.ts} +0 -0
|
@@ -1,157 +0,0 @@
|
|
|
1
|
-
// src/core/collection/list-manager.js
|
|
2
|
-
|
|
3
|
-
import { createRouteAdapter } from './adapters/route'
|
|
4
|
-
|
|
5
|
-
/**
|
|
6
|
-
* Creates a list manager for a specific collection
|
|
7
|
-
* @param {string} collection - Collection name
|
|
8
|
-
* @param {Object} config - Configuration options
|
|
9
|
-
* @param {Function} config.transform - Transform function for items
|
|
10
|
-
* @param {string} config.baseUrl - Base API URL
|
|
11
|
-
* @returns {Object} List manager methods
|
|
12
|
-
*/
|
|
13
|
-
export const createListManager = (collection, config = {}) => {
|
|
14
|
-
const {
|
|
15
|
-
transform = (item) => item,
|
|
16
|
-
baseUrl = 'http://localhost:4000/api'
|
|
17
|
-
} = config
|
|
18
|
-
|
|
19
|
-
// Initialize route adapter
|
|
20
|
-
const adapter = createRouteAdapter({
|
|
21
|
-
base: baseUrl,
|
|
22
|
-
endpoints: {
|
|
23
|
-
list: `/${collection}`
|
|
24
|
-
},
|
|
25
|
-
headers: {
|
|
26
|
-
'Content-Type': 'application/json'
|
|
27
|
-
}
|
|
28
|
-
})
|
|
29
|
-
|
|
30
|
-
// Load items with cursor pagination
|
|
31
|
-
const loadItems = async (params = {}) => {
|
|
32
|
-
try {
|
|
33
|
-
const response = await adapter.read(params)
|
|
34
|
-
|
|
35
|
-
return {
|
|
36
|
-
items: response.items.map(transform),
|
|
37
|
-
meta: response.meta
|
|
38
|
-
}
|
|
39
|
-
} catch (error) {
|
|
40
|
-
console.error(`Error loading ${collection}:`, error)
|
|
41
|
-
return {
|
|
42
|
-
items: [],
|
|
43
|
-
meta: {
|
|
44
|
-
cursor: null,
|
|
45
|
-
hasNext: false
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
|
|
51
|
-
// Utility to create a cursor-based page loader
|
|
52
|
-
const createPageLoader = (list, { onLoad, pageSize = 20 } = {}) => {
|
|
53
|
-
let currentCursor = null
|
|
54
|
-
let loading = false
|
|
55
|
-
const pageHistory = []
|
|
56
|
-
|
|
57
|
-
const load = async (cursor = null, addToHistory = true) => {
|
|
58
|
-
if (loading) return
|
|
59
|
-
|
|
60
|
-
loading = true
|
|
61
|
-
onLoad?.({ loading: true })
|
|
62
|
-
|
|
63
|
-
const { items, meta } = await loadItems({
|
|
64
|
-
limit: pageSize,
|
|
65
|
-
cursor
|
|
66
|
-
})
|
|
67
|
-
|
|
68
|
-
if (addToHistory && cursor) {
|
|
69
|
-
pageHistory.push(currentCursor)
|
|
70
|
-
}
|
|
71
|
-
currentCursor = meta.cursor
|
|
72
|
-
|
|
73
|
-
list.setItems(items)
|
|
74
|
-
loading = false
|
|
75
|
-
|
|
76
|
-
onLoad?.({
|
|
77
|
-
loading: false,
|
|
78
|
-
hasNext: meta.hasNext,
|
|
79
|
-
hasPrev: pageHistory.length > 0,
|
|
80
|
-
items
|
|
81
|
-
})
|
|
82
|
-
|
|
83
|
-
return {
|
|
84
|
-
hasNext: meta.hasNext,
|
|
85
|
-
hasPrev: pageHistory.length > 0
|
|
86
|
-
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
const loadNext = () => load(currentCursor)
|
|
90
|
-
|
|
91
|
-
const loadPrev = () => {
|
|
92
|
-
const previousCursor = pageHistory.pop()
|
|
93
|
-
return load(previousCursor, false)
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
return {
|
|
97
|
-
load,
|
|
98
|
-
loadNext,
|
|
99
|
-
loadPrev,
|
|
100
|
-
get loading () { return loading },
|
|
101
|
-
get cursor () { return currentCursor }
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
return {
|
|
106
|
-
loadItems,
|
|
107
|
-
createPageLoader
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
/**
|
|
112
|
-
* Transform functions for common collections
|
|
113
|
-
*/
|
|
114
|
-
export const transforms = {
|
|
115
|
-
track: (track) => ({
|
|
116
|
-
id: track._id,
|
|
117
|
-
headline: track.title || 'Untitled',
|
|
118
|
-
supportingText: track.artist || 'Unknown Artist',
|
|
119
|
-
meta: track.year?.toString() || ''
|
|
120
|
-
}),
|
|
121
|
-
|
|
122
|
-
playlist: (playlist) => ({
|
|
123
|
-
id: playlist._id,
|
|
124
|
-
headline: playlist.name || 'Untitled Playlist',
|
|
125
|
-
supportingText: `${playlist.tracks?.length || 0} tracks`,
|
|
126
|
-
meta: playlist.creator || ''
|
|
127
|
-
}),
|
|
128
|
-
|
|
129
|
-
country: (country) => ({
|
|
130
|
-
id: country._id,
|
|
131
|
-
headline: country.name || country.code,
|
|
132
|
-
supportingText: country.continent || '',
|
|
133
|
-
meta: country.code || ''
|
|
134
|
-
})
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
/**
|
|
138
|
-
* Usage example:
|
|
139
|
-
*
|
|
140
|
-
* const trackManager = createListManager('track', {
|
|
141
|
-
* transform: transforms.track
|
|
142
|
-
* })
|
|
143
|
-
*
|
|
144
|
-
* const loader = trackManager.createPageLoader(list, {
|
|
145
|
-
* onLoad: ({ loading, hasNext, items }) => {
|
|
146
|
-
* updateNavigation({ loading, hasNext })
|
|
147
|
-
* logEvent(`Loaded ${items.length} tracks`)
|
|
148
|
-
* }
|
|
149
|
-
* })
|
|
150
|
-
*
|
|
151
|
-
* // Initial load
|
|
152
|
-
* await loader.load()
|
|
153
|
-
*
|
|
154
|
-
* // Navigation
|
|
155
|
-
* nextButton.onclick = () => loader.loadNext()
|
|
156
|
-
* prevButton.onclick = () => loader.loadPrev()
|
|
157
|
-
*/
|
|
File without changes
|