Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-03-28 15:41:25 -05:00
Code Issues Activity

🐛 Fix labelled by on tab-panel component

Browse source
This commit is contained in:
Eva Marco 2024-08-21 12:59:00 +02:00
parent 89562d0231
commit 3f3c3a3df4
2 changed files with 12 additions and 43 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
frontend/src/app/main/ui/ds/tab_switcher.cljs
View file

@ -30,7 +30,9 @@
:tab-index (if selected nil -1)
:ref (fn [node]
(on-ref node id))
:data-id id})]
:data-id id
;; This prop is to be used for accessibility purposes only.
:id id})]
[:li
[:> :button props
@ -188,9 +190,11 @@
:selected selected
:on-click on-click}]]
[:section {:class (stl/css :tab-panel)
:tab-index 0
:role "tabpanel"}
(let [active-tab (get-tab tabs selected)]
(obj/get active-tab "content"))]]))
(let [active-tab (get-tab tabs selected)
content (obj/get active-tab "content")
id (obj/get active-tab "id")]
[:section {:class (stl/css :tab-panel)
:tab-index 0
:role "tabpanel"
:aria-labelledby id}
content])]))

37
frontend/src/app/main/ui/workspace/sidebar.cljs
View file

@ -51,7 +51,6 @@
mode-inspect? (= options-mode :inspect)
project (mf/deref refs/workspace-project)
section (cond (or mode-inspect? (contains? layout :layers)) :layers
(contains? layout :assets) :assets)
@ -148,38 +147,7 @@
:on-change-tab on-tab-change
:class (stl/css :left-sidebar-tabs)
:action-button-position "start"
:action-button (mf/html [:& collapse-button {:on-click handle-collapse}])}]
#_[:& tab-container
{:on-change-tab on-tab-change
:selected section
:collapsable true
:handle-collapse handle-collapse
:header-class (stl/css :tab-spacing)}
[:& tab-element {:id :layers
:title (tr "workspace.sidebar.layers")}
[:article {:class (stl/css :layers-tab)
:style #js {"--height" (str size-pages "px")}}
[:& sitemap {:layout layout
:toggle-pages toggle-pages
:show-pages? @show-pages?
:size size-pages}]
(when @show-pages?
[:div {:class (stl/css :resize-area-horiz)
:on-pointer-down on-pointer-down-pages
:on-lost-pointer-capture on-lost-pointer-capture-pages
:on-pointer-move on-pointer-move-pages}])
[:& layers-toolbox {:size-parent size
:size size-pages}]]]
(when-not ^boolean mode-inspect?
[:& tab-element {:id :assets
:title (tr "workspace.toolbar.assets")}
[:& assets-toolbox {:size (- size 58)}]])]])]]))
:action-button (mf/html [:& collapse-button {:on-click handle-collapse}])}]])]]))
;; --- Right Sidebar (Component)
@ -193,9 +161,6 @@
is-history? (contains? layout :document-history)
is-inspect? (= section :inspect)
;;expanded? (mf/deref refs/inspect-expanded)
;;prev-expanded? (hooks/use-previous expanded?)
current-section* (mf/use-state :info)
current-section (deref current-section*)