@net-advantage/nabs-ui-toolbar 0.27.0 → 0.28.0

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.
@@ -3,4 +3,4 @@ Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});var e=(e,t)=>
3
3
  <%s {...props} />
4
4
  React keys must be passed directly to JSX without using spread:
5
5
  let props = %s;
6
- <%s key={someKey} {...props} />`,o,p,m,p),L[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.client.reference`),k=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,A=Object.prototype.hasOwnProperty,j=Array.isArray,M=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var N,P={},F=m.react_stack_bottom_frame.bind(m,o)(),I=M(i(o)),L={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)},e.jsxs=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)}})()})),o=e(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=i():t.exports=a()}))(),s=(0,t.forwardRef)(function({items:e,className:t=``,buttonClassName:i=``,iconClassName:a=``,labelClassName:s=``,onItemSelect:c,...l},u){return(0,o.jsx)(`div`,{ref:u,className:[`nabs-ui-toolbar`,t].filter(Boolean).join(` `),role:`toolbar`,...l,children:e.map(e=>{let t=e.icon,l=[`nabs-ui-toolbar__content`,n[r(e.labelPosition)]].filter(Boolean).join(` `),u=[`nabs-ui-toolbar__button`,i].filter(Boolean).join(` `),d=[`nabs-ui-toolbar__icon`,a].filter(Boolean).join(` `),f=[`nabs-ui-toolbar__label`,s].filter(Boolean).join(` `),p=typeof e.label==`string`?e.label:e.title;return(0,o.jsx)(`button`,{type:`button`,className:u,disabled:e.disabled,title:e.title,"aria-label":p,onClick:t=>{c?.({itemId:e.id,item:e,event:t})},children:(0,o.jsxs)(`span`,{className:l,children:[(0,o.jsx)(t,{className:d,"aria-hidden":`true`,focusable:`false`}),e.label?(0,o.jsx)(`span`,{className:f,children:e.label}):null]})},e.id)})})});s.displayName=`Toolbar`,exports.Toolbar=s;
6
+ <%s key={someKey} {...props} />`,o,p,m,p),L[p+o]=!0)}if(p=null,i!==void 0&&(r(i),p=``+i),s(n)&&(r(n.key),p=``+n.key),`key`in n)for(var h in i={},n)h!==`key`&&(i[h]=n[h]);else i=n;return p&&c(i,typeof e==`function`?e.displayName||e.name||`Unknown`:e),u(e,p,i,a(),l,d)}function f(e){p(e)?e._store&&(e._store.validated=1):typeof e==`object`&&e&&e.$$typeof===E&&(e._payload.status===`fulfilled`?p(e._payload.value)&&e._payload.value._store&&(e._payload.value._store.validated=1):e._store&&(e._store.validated=1))}function p(e){return typeof e==`object`&&!!e&&e.$$typeof===h}var m=require("react"),h=Symbol.for(`react.transitional.element`),g=Symbol.for(`react.portal`),_=Symbol.for(`react.fragment`),v=Symbol.for(`react.strict_mode`),y=Symbol.for(`react.profiler`),b=Symbol.for(`react.consumer`),x=Symbol.for(`react.context`),S=Symbol.for(`react.forward_ref`),C=Symbol.for(`react.suspense`),w=Symbol.for(`react.suspense_list`),T=Symbol.for(`react.memo`),E=Symbol.for(`react.lazy`),D=Symbol.for(`react.activity`),O=Symbol.for(`react.client.reference`),k=m.__CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE,A=Object.prototype.hasOwnProperty,j=Array.isArray,M=console.createTask?console.createTask:function(){return null};m={react_stack_bottom_frame:function(e){return e()}};var N,P={},F=m.react_stack_bottom_frame.bind(m,o)(),I=M(i(o)),L={};e.Fragment=_,e.jsx=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!1,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)},e.jsxs=function(e,t,n){var r=1e4>k.recentlyCreatedOwnerStacks++;return d(e,t,n,!0,r?Error(`react-stack-top-frame`):F,r?M(i(e)):I)}})()})),o=e(((e,t)=>{process.env.NODE_ENV===`production`?t.exports=i():t.exports=a()}))(),s=(0,t.forwardRef)(function({items:e,activeItemId:t,className:i=``,buttonClassName:a=``,iconClassName:s=``,labelClassName:c=``,onItemSelect:l,...u},d){return(0,o.jsx)(`div`,{ref:d,className:[`nabs-ui-toolbar`,i].filter(Boolean).join(` `),role:`toolbar`,...u,children:e.map(e=>{let i=e.icon,u=!!e.label,d=e.id===t,f=[`nabs-ui-toolbar__content`,n[r(e.labelPosition)]].filter(Boolean).join(` `),p=[`nabs-ui-toolbar__button`,d?`nabs-ui-toolbar__button--active`:``,u?``:`nabs-ui-toolbar__button--icon-only`,a].filter(Boolean).join(` `),m=[`nabs-ui-toolbar__icon`,s].filter(Boolean).join(` `),h=[`nabs-ui-toolbar__label`,c].filter(Boolean).join(` `),g=typeof e.label==`string`?e.label:e.title;return(0,o.jsx)(`button`,{type:`button`,className:p,disabled:e.disabled,title:e.title,"aria-label":g,onClick:t=>{l?.({itemId:e.id,item:e,event:t})},children:(0,o.jsxs)(`span`,{className:f,children:[i?(0,o.jsx)(i,{className:m,"aria-hidden":`true`,focusable:`false`}):null,e.label?(0,o.jsx)(`span`,{className:h,children:e.label}):null]})},e.id)})})});s.displayName=`Toolbar`,exports.Toolbar=s;
@@ -1,2 +1,2 @@
1
- .nabs-ui-toolbar{flex-wrap:wrap;align-items:center;gap:.6rem;display:inline-flex}.nabs-ui-toolbar__button{background:var(--nabs-ui-color-bg);border:1px solid var(--nabs-ui-color-border);color:inherit;cursor:pointer;font:inherit;border-radius:.65rem;justify-content:center;align-items:center;gap:.4rem;min-width:2.45rem;min-height:2.45rem;padding:.45rem .75rem;transition:transform .12s,box-shadow .12s,border-color .12s;display:inline-flex}.nabs-ui-toolbar__button:hover:not(:disabled){transform:translateY(-1px)}.nabs-ui-toolbar__button:disabled{cursor:not-allowed;opacity:.7}.nabs-ui-toolbar__content{align-items:center;gap:.45rem;display:inline-flex}.nabs-ui-toolbar__content--label-left{flex-direction:row-reverse}.nabs-ui-toolbar__content--label-right{flex-direction:row}.nabs-ui-toolbar__content--label-top{flex-direction:column-reverse}.nabs-ui-toolbar__content--label-bottom{flex-direction:column}.nabs-ui-toolbar__icon{flex:none;width:1.1rem;height:1.1rem;display:block}.nabs-ui-toolbar__label{white-space:nowrap;line-height:1}
1
+ .nabs-ui-toolbar{flex-wrap:wrap;align-items:center;gap:.1rem;min-height:3.65rem;padding:.4rem .45rem;display:inline-flex}.nabs-ui-toolbar__button{cursor:pointer;font:inherit;justify-content:center;align-items:center;gap:.25rem;min-width:2.75rem;min-height:2.75rem;padding:.35rem .8rem;transition:transform .12s,box-shadow .12s,border-color .12s,background-color .12s,color .12s;display:inline-flex}.nabs-ui-toolbar__button:hover:not(:disabled){transform:translateY(-1px)}.nabs-ui-toolbar__button:disabled{cursor:not-allowed}.nabs-ui-toolbar__button--icon-only{padding-inline:.55rem}.nabs-ui-toolbar__content{align-items:center;gap:.42rem;display:inline-flex}.nabs-ui-toolbar__content--label-left{flex-direction:row-reverse}.nabs-ui-toolbar__content--label-right{flex-direction:row}.nabs-ui-toolbar__content--label-top{flex-direction:column-reverse}.nabs-ui-toolbar__content--label-bottom{flex-direction:column}.nabs-ui-toolbar__icon{stroke-width:1.75px;flex:none;width:1.08rem;height:1.08rem;display:block}.nabs-ui-toolbar__label{white-space:nowrap;font-size:.95rem;font-weight:500;line-height:1}
2
2
  /*$vite$:1*/
@@ -189,35 +189,40 @@ var a = /* @__PURE__ */ t(((e) => {
189
189
  })();
190
190
  })), s = (/* @__PURE__ */ t(((e, t) => {
191
191
  process.env.NODE_ENV === "production" ? t.exports = a() : t.exports = o();
192
- })))(), c = e(function({ items: e, className: t = "", buttonClassName: n = "", iconClassName: a = "", labelClassName: o = "", onItemSelect: c, ...l }, u) {
192
+ })))(), c = e(function({ items: e, activeItemId: t, className: n = "", buttonClassName: a = "", iconClassName: o = "", labelClassName: c = "", onItemSelect: l, ...u }, d) {
193
193
  return /* @__PURE__ */ (0, s.jsx)("div", {
194
- ref: u,
195
- className: ["nabs-ui-toolbar", t].filter(Boolean).join(" "),
194
+ ref: d,
195
+ className: ["nabs-ui-toolbar", n].filter(Boolean).join(" "),
196
196
  role: "toolbar",
197
- ...l,
197
+ ...u,
198
198
  children: e.map((e) => {
199
- let t = e.icon, l = ["nabs-ui-toolbar__content", r[i(e.labelPosition)]].filter(Boolean).join(" "), u = ["nabs-ui-toolbar__button", n].filter(Boolean).join(" "), d = ["nabs-ui-toolbar__icon", a].filter(Boolean).join(" "), f = ["nabs-ui-toolbar__label", o].filter(Boolean).join(" "), p = typeof e.label == "string" ? e.label : e.title;
199
+ let n = e.icon, u = !!e.label, d = e.id === t, f = ["nabs-ui-toolbar__content", r[i(e.labelPosition)]].filter(Boolean).join(" "), p = [
200
+ "nabs-ui-toolbar__button",
201
+ d ? "nabs-ui-toolbar__button--active" : "",
202
+ u ? "" : "nabs-ui-toolbar__button--icon-only",
203
+ a
204
+ ].filter(Boolean).join(" "), m = ["nabs-ui-toolbar__icon", o].filter(Boolean).join(" "), h = ["nabs-ui-toolbar__label", c].filter(Boolean).join(" "), g = typeof e.label == "string" ? e.label : e.title;
200
205
  return /* @__PURE__ */ (0, s.jsx)("button", {
201
206
  type: "button",
202
- className: u,
207
+ className: p,
203
208
  disabled: e.disabled,
204
209
  title: e.title,
205
- "aria-label": p,
210
+ "aria-label": g,
206
211
  onClick: (t) => {
207
- c?.({
212
+ l?.({
208
213
  itemId: e.id,
209
214
  item: e,
210
215
  event: t
211
216
  });
212
217
  },
213
218
  children: /* @__PURE__ */ (0, s.jsxs)("span", {
214
- className: l,
215
- children: [/* @__PURE__ */ (0, s.jsx)(t, {
216
- className: d,
219
+ className: f,
220
+ children: [n ? /* @__PURE__ */ (0, s.jsx)(n, {
221
+ className: m,
217
222
  "aria-hidden": "true",
218
223
  focusable: "false"
219
- }), e.label ? /* @__PURE__ */ (0, s.jsx)("span", {
220
- className: f,
224
+ }) : null, e.label ? /* @__PURE__ */ (0, s.jsx)("span", {
225
+ className: h,
221
226
  children: e.label
222
227
  }) : null]
223
228
  })
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@net-advantage/nabs-ui-toolbar",
3
- "version": "0.27.0",
3
+ "version": "0.28.0",
4
4
  "description": "Reusable toolbar control for the Nabs UI library.",
5
5
  "type": "module",
6
6
  "main": "./dist/nabs-ui-toolbar.cjs",