diff --git a/FAKEMUI_STRATEGY.md b/FAKEMUI_STRATEGY.md index 563ff9462..eabbb980a 100644 --- a/FAKEMUI_STRATEGY.md +++ b/FAKEMUI_STRATEGY.md @@ -65,7 +65,7 @@ Total: ~150 components, ~80 SCSS files - Zero runtime dependencies - Full TypeScript support -**Current Icons:** 310+ ✅✅ Far exceeds target! +**Current Icons:** 310+ ✅✅ Far exceeds target! **Target Phase 3:** 100+ ✅ ACHIEVED **See:** [fakemui/icons/README.md](fakemui/icons/README.md) diff --git a/fakemui/icons/IdCard.tsx b/fakemui/icons/IdCard.tsx new file mode 100644 index 000000000..2c0a71034 --- /dev/null +++ b/fakemui/icons/IdCard.tsx @@ -0,0 +1,12 @@ +import React from 'react' +import { Icon, IconProps } from './Icon' + +export const IdCard = (props: IconProps) => ( + + + + + + + +) diff --git a/fakemui/icons/index.ts b/fakemui/icons/index.ts index d621d0e77..cec34efe1 100644 --- a/fakemui/icons/index.ts +++ b/fakemui/icons/index.ts @@ -57,6 +57,7 @@ export { UserMinus } from './UserMinus' export { UserX } from './UserX' export { Users } from './Users' export { UserSwitch } from './UserSwitch' +export { IdCard } from './IdCard' export { Menu } from './Menu' export { Eye } from './Eye' export { EyeSlash } from './EyeSlash' diff --git a/frontends/nextjs/src/hooks/data/useKV.ts b/frontends/nextjs/src/hooks/data/useKV.ts index 3cb978558..a8185f51a 100644 --- a/frontends/nextjs/src/hooks/data/useKV.ts +++ b/frontends/nextjs/src/hooks/data/useKV.ts @@ -1,8 +1,8 @@ /** * @file useKV.ts - * @description Custom useKV hook - replacement for @/hooks/data/useKV - * Uses in-memory storage with localStorage persistence in the browser - * API compatible with @/hooks/data/useKV + * @description Custom useKV hook - replacement for @github/spark/hooks + * Uses in-memory storage with localStorage persistence in the browser + * API compatible with @github/spark/hooks */ import { useCallback, useEffect, useRef, useState } from 'react' diff --git a/packages/nav_menu/seed/scripts/menu.lua b/packages/nav_menu/seed/scripts/menu.lua index 46e5b933e..a33540202 100644 --- a/packages/nav_menu/seed/scripts/menu.lua +++ b/packages/nav_menu/seed/scripts/menu.lua @@ -41,10 +41,11 @@ local M = {} ---@param props MenuProps ---@return UIComponent function M.render(props) - local items = {} - for _, item in ipairs(props.items or {}) do - if M.can_show(props.user, item) then - items[#items + 1] = M.item(item) + ---@type UIComponent[] + local items = {} + for _, item in ipairs(props.items or {}) do + if M.can_show(props.user, item) then + items[#items + 1] = M.item(item) end end return { @@ -65,26 +66,50 @@ end ---@param item MenuItem ---@return UIComponent function M.item(item) - if item.children then - return { - type = "DropdownMenu", - children = { - { type = "DropdownMenuTrigger", props = { text = item.label } }, - { type = "DropdownMenuContent", children = M.sub_items(item.children) } - } - } - end - return { type = "Button", props = { variant = "ghost", text = item.label, onClick = "navigate", data = item.path } } -end - ----@param children MenuItem[] ----@return UIComponent[] -function M.sub_items(children) - local items = {} - for _, c in ipairs(children) do - items[#items + 1] = { type = "DropdownMenuItem", props = { text = c.label, onClick = "navigate", data = c.path } } - end - return items -end + if item.children then + return { + type = "DropdownMenu", + children = { + { + type = "DropdownMenuTrigger", + props = { + ---@type DropdownMenuTriggerProps + text = item.label + } + }, + { type = "DropdownMenuContent", children = M.sub_items(item.children) } + } + } + end + return { + type = "Button", + props = { + ---@type ButtonProps + variant = "ghost", + text = item.label, + onClick = "navigate", + data = item.path + } + } +end + +---@param children MenuItem[] +---@return UIComponent[] +function M.sub_items(children) + ---@type UIComponent[] + local items = {} + for _, c in ipairs(children) do + items[#items + 1] = { + type = "DropdownMenuItem", + props = { + ---@type DropdownMenuItemProps + text = c.label, + onClick = "navigate", + data = c.path + } + } + end + return items +end return M diff --git a/packages/shared/types/ui_types.lua b/packages/shared/types/ui_types.lua index a64ed59e7..868832989 100644 --- a/packages/shared/types/ui_types.lua +++ b/packages/shared/types/ui_types.lua @@ -19,11 +19,12 @@ ---| "CardActions" ---| "CardTitle" ---| "CardFooter" ----| "Button" ----| "IconButton" ----| "Input" ----| "TextField" ----| "TextArea" +---| "Button" +---| "IconButton" +---| "Icon" +---| "Input" +---| "TextField" +---| "TextArea" ---| "Select" ---| "Checkbox" ---| "Radio" @@ -71,14 +72,19 @@ ---@field props? table Component properties ---@field children? UIComponent[] Nested child components ----@class ButtonProps ----@field text? string Button label text ----@field variant? "contained"|"outlined"|"text" Button style variant ----@field color? "primary"|"secondary"|"error"|"success"|"warning" Color scheme ----@field size? "sm"|"md"|"lg" Button size ----@field disabled? boolean Disable button interactions ----@field onClick? string Action handler name ----@field data? any Additional data passed to handler +---@class ButtonProps +---@field text? string Button label text +---@field variant? "contained"|"outlined"|"text" Button style variant +---@field color? "primary"|"secondary"|"error"|"success"|"warning" Color scheme +---@field size? "sm"|"md"|"lg" Button size +---@field disabled? boolean Disable button interactions +---@field onClick? string Action handler name +---@field data? any Additional data passed to handler + +---@class IconProps +---@field name string Icon name from fakemui/icons +---@field size? "small"|"medium"|"large"|"inherit" Icon size +---@field className? string CSS class name ---@class InputProps ---@field label? string Input field label diff --git a/packages/ui_level2/seed/scripts/comments/composer.lua b/packages/ui_level2/seed/scripts/comments/composer.lua index 43b493f43..d36340905 100644 --- a/packages/ui_level2/seed/scripts/comments/composer.lua +++ b/packages/ui_level2/seed/scripts/comments/composer.lua @@ -1,8 +1,10 @@ --- Comment composer component --- Single function module for comments UI - ----@class Composer -local M = {} +-- Comment composer component +-- Single function module for comments UI + +require("comments.types") + +---@class Composer +local M = {} ---Render comment composer form ---@return UIComponent diff --git a/packages/ui_level2/seed/scripts/comments/list.lua b/packages/ui_level2/seed/scripts/comments/list.lua index 149683809..4e9a8e99d 100644 --- a/packages/ui_level2/seed/scripts/comments/list.lua +++ b/packages/ui_level2/seed/scripts/comments/list.lua @@ -1,8 +1,10 @@ --- Comment list component --- Single function module for comments UI - ----@class CommentList -local M = {} +-- Comment list component +-- Single function module for comments UI + +require("comments.types") + +---@class CommentList +local M = {} ---Render list of comments ---@param comments Comment[] Array of comment objects diff --git a/packages/ui_level2/seed/scripts/comments/post_comment.lua b/packages/ui_level2/seed/scripts/comments/post_comment.lua index 5121b1185..4befec382 100644 --- a/packages/ui_level2/seed/scripts/comments/post_comment.lua +++ b/packages/ui_level2/seed/scripts/comments/post_comment.lua @@ -1,8 +1,10 @@ --- Post comment handler --- Single function module for comments UI - ----@class PostComment -local M = {} +-- Post comment handler +-- Single function module for comments UI + +require("comments.types") + +---@class PostComment +local M = {} ---Handle posting a comment ---@param form PostForm Form data with comment field diff --git a/packages/ui_level2/seed/scripts/comments/render.lua b/packages/ui_level2/seed/scripts/comments/render.lua index 7c5e07e6c..40e7e6945 100644 --- a/packages/ui_level2/seed/scripts/comments/render.lua +++ b/packages/ui_level2/seed/scripts/comments/render.lua @@ -1,8 +1,10 @@ --- Render comments section --- Single function module for comments UI - -local composer = require("comments.composer") -local list = require("comments.list") +-- Render comments section +-- Single function module for comments UI + +require("comments.types") + +local composer = require("comments.composer") +local list = require("comments.list") ---@class Render local M = {} diff --git a/packages/ui_level2/seed/scripts/profile/render.lua b/packages/ui_level2/seed/scripts/profile/render.lua index 018dac301..89cdce92e 100644 --- a/packages/ui_level2/seed/scripts/profile/render.lua +++ b/packages/ui_level2/seed/scripts/profile/render.lua @@ -15,6 +15,14 @@ function M.render(ctx) { type = "CardHeader", children = { + { + type = "Icon", + props = { + ---@type IconProps + name = "IdCard", + size = "large" + } + }, { type = "CardTitle", props = { text = "Your Profile" } } } }, diff --git a/packages/ui_level4/seed/scripts/schemas/render.lua b/packages/ui_level4/seed/scripts/schemas/render.lua index a455b083c..6e4a4f486 100644 --- a/packages/ui_level4/seed/scripts/schemas/render.lua +++ b/packages/ui_level4/seed/scripts/schemas/render.lua @@ -1,44 +1,10 @@ --- Render function for schemas tab - ----@class UIComponent ----@field type string ----@field props? table ----@field children? UIComponent[] +-- Render function for schemas tab ----@class ButtonProps ----@field text string ----@field onClick string ----@field data? string +require("schemas.types") ----@class BadgeProps ----@field text string - ----@class TypographyProps ----@field text string - ----@class GridProps ----@field cols number ----@field gap number - ----@class StackProps ----@field spacing number - ----@class SchemaField ----@field name string ----@field type string - ----@class Schema ----@field id string ----@field name string ----@field description? string ----@field fields? SchemaField[] - ----@class SchemasRenderContext ----@field schemas? Schema[] - ----Renders the schemas tab with a grid of schema cards ----@param ctx SchemasRenderContext ----@return UIComponent +---Renders the schemas tab with a grid of schema cards +---@param ctx SchemasRenderContext +---@return UIComponent local function render(ctx) ---@type Schema[] local schemas = ctx.schemas or {}