@solibo/solibo-ui 2.0.1 → 2.0.2

package/dist/assets/index13.css

@@ -1 +1 @@
-._nav_xrgjg_3 a{display:block}._label_xrgjg_9{flex:1 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._item_xrgjg_17{align-items:center;border-radius:var(--shape-border-radius-radius-md);display:grid;grid-template-columns:auto minmax(0,1fr) auto auto}._item_xrgjg_17>a{display:grid;grid-column:1 / -1;grid-row:1;grid-template-columns:subgrid;margin-bottom:0}._item_xrgjg_17>a>[data-component=badge]{grid-column:3}._actions_xrgjg_36{grid-column:4;grid-row:1;justify-self:end;margin-right:var(--shape-spacing-2xs);margin-top:var(--shape-spacing-2xs);width:-moz-max-content;width:max-content;z-index:1}._actions_xrgjg_36:has([data-component=popover]){display:none}._item_xrgjg_17:hover ._actions_xrgjg_36,._item_xrgjg_17:focus-within ._actions_xrgjg_36{display:block}._item_xrgjg_17:hover ._actions_xrgjg_36 [data-component=popover],._item_xrgjg_17:focus-within ._actions_xrgjg_36 [data-component=popover]{visibility:visible}._highlighted_xrgjg_60>a{background:var(--colors-semantic-primary-primary-subtle);border-color:var(--colors-semantic-primary-primary-subtle-border);color:var(--colors-semantic-content-primary);font-weight:var(--font-font-weight-semibold)}._horizontal_xrgjg_64 a,._horizontal_xrgjg_64 li{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._sidebar_xrgjg_74 a{align-items:center;border:var(--scale-1) solid transparent;border-radius:var(--shape-border-radius-radius-md);color:var(--colors-semantic-content-secondary);display:flex;line-height:var(--utils-tokens-unit);overflow:hidden;padding:var(--shape-spacing-md) var(--shape-spacing-sm);text-decoration:none;text-overflow:ellipsis;white-space:nowrap}._sidebar_xrgjg_74 a [data-component=badge]{margin-left:auto}._sidebar_xrgjg_74 a[aria-current=page]{background:var(--colors-semantic-primary-primary-subtle);border-color:var(--colors-semantic-primary-primary-subtle-border);color:var(--colors-semantic-content-primary);font-weight:var(--font-font-weight-semibold)}._sidebar_xrgjg_74 a:has(~a){margin-bottom:var(--shape-spacing-2xs)}._sidebar_xrgjg_74 ._item_xrgjg_17>a{display:grid}._sidebar_xrgjg_74 input{margin:3px 0!important}._sidebar_xrgjg_74~._sidebar_xrgjg_74{border-top:solid 1px var(--colors-semantic-border-default);margin-top:var(--shape-spacing-lg);padding-top:var(--shape-spacing-2xs)}._nav_xrgjg_3._tabs_xrgjg_117._tabs_xrgjg_117{display:flex;gap:var(--utils-tokens-unit)}._nav_xrgjg_3._tabs_xrgjg_117._tabs_xrgjg_117 a,._nav_xrgjg_3._tabs_xrgjg_117._tabs_xrgjg_117 li{color:var(--colors-semantic-content-tertiary);display:inline-block;font-weight:var(--font-font-weight-semibold);padding:var(--scale-4) var(--scale-2) var(--scale-8) var(--scale-2);text-align:center;text-decoration:none}._nav_xrgjg_3._tabs_xrgjg_117._tabs_xrgjg_117 a[aria-current=page],._nav_xrgjg_3._tabs_xrgjg_117._tabs_xrgjg_117 li[aria-current=page]{border-bottom:var(--shape-border-width-default) solid var(--colors-semantic-content-primary);color:var(--colors-semantic-content-primary)}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137{-webkit-backdrop-filter:blur(var(--scale-8));backdrop-filter:blur(var(--scale-8));background-color:var(--colors-translucent);border:var(--scale-2) solid var(--colors-semantic-bg-surface);border-radius:var(--shape-border-radius-radius-2xl);box-shadow:var(--shape-box-shadow-sm-position-x) var(--shape-box-shadow-sm-position-y) var(--shape-box-shadow-sm-blur) var(--shape-box-shadow-sm-spread) var(--shape-box-shadow-sm-color);display:flex;left:50%;margin:0 auto;position:sticky;top:var(--utils-tokens-unit);transform:translate(-50%);width:-moz-fit-content;width:fit-content;z-index:2}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137:has(>:only-child){display:none}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137:before{background:var(--colors-purple-500);border-radius:var(--shape-border-radius-radius-2xl);content:"";inset-block:0;left:anchor(left);position:absolute;position-anchor:--current;transition:left var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),top var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),width var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);width:anchor-size(width);z-index:0}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a{border-radius:var(--scale-32);color:var(--colors-semantic-primary-primary);display:inline-block;font-weight:var(--font-font-weight-bold);padding:var(--utils-tokens-unit);position:relative;text-decoration:none;text-overflow:ellipsis;transition:color var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),padding var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);white-space:nowrap;z-index:2}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a[aria-current=page]{anchor-name:--current;color:var(--colors-semantic-bg-surface)}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a[aria-current=page]:hover{color:var(--colors-semantic-bg-surface)}@media (width <= 1024px){._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137{flex-direction:column}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a[aria-current=page]{background-color:var(--colors-purple-500)}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a[aria-current=page]:after{background-color:var(--colors-semantic-bg-surface);content:"";display:inline-block;height:var(--utils-tokens-unit);margin-left:var(--scale-8);-webkit-mask-image:var(--icon-svg);mask-image:var(--icon-svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;transition:transform var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);vertical-align:middle;width:var(--utils-tokens-unit)}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137 a:not([aria-current=page]){display:none}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137:before{display:none}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137[data-open=true] a{display:block}._nav_xrgjg_3._pills_xrgjg_137._pills_xrgjg_137[data-open=true] a[aria-current=page]:after{transform:rotateX(180deg)}}@supports not (position-anchor: --x){._pills_xrgjg_137:before{display:none}._pills_xrgjg_137 a[aria-current=page]{background:var(--colors-purple-500);color:var(--colors-semantic-bg-surface)}}._sidebar_xrgjg_74 a:hover:not([aria-current=page]),._sidebar_xrgjg_74 ._item_xrgjg_17:hover>a:not([aria-current=page]){background:var(--colors-semantic-interactive-hover-subtle);border-color:var(--colors-semantic-interactive-hover-subtle);color:var(--colors-semantic-content-primary)}
+._nav_rztyo_3 a{display:block}._label_rztyo_9{flex:1 1 auto;min-width:0;overflow:clip visible;text-overflow:ellipsis;white-space:nowrap}._item_rztyo_17{align-items:center;border-radius:var(--shape-border-radius-radius-md);display:grid;grid-template-columns:auto minmax(0,1fr) auto auto}._item_rztyo_17>a{display:grid;grid-column:1 / -1;grid-row:1;grid-template-columns:subgrid;margin-bottom:0}._item_rztyo_17>a>[data-component=badge]{grid-column:3}._actions_rztyo_36{grid-column:4;grid-row:1;justify-self:end;margin-right:var(--shape-spacing-2xs);margin-top:var(--shape-spacing-2xs);width:-moz-max-content;width:max-content;z-index:1}._actions_rztyo_36:has([data-component=popover]){display:none}._item_rztyo_17:hover ._actions_rztyo_36,._item_rztyo_17:focus-within ._actions_rztyo_36{display:block}._item_rztyo_17:hover ._actions_rztyo_36 [data-component=popover],._item_rztyo_17:focus-within ._actions_rztyo_36 [data-component=popover]{visibility:visible}._highlighted_rztyo_60>a{background:var(--colors-semantic-primary-primary-subtle);border-color:var(--colors-semantic-primary-primary-subtle-border);color:var(--colors-semantic-content-primary);font-weight:var(--font-font-weight-semibold)}._horizontal_rztyo_64 a,._horizontal_rztyo_64 li{display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}._sidebar_rztyo_74 a{align-items:center;border:var(--scale-1) solid transparent;border-radius:var(--shape-border-radius-radius-md);color:var(--colors-semantic-content-secondary);display:flex;line-height:var(--utils-tokens-unit);overflow:hidden;padding:var(--shape-spacing-md) var(--shape-spacing-sm);text-decoration:none;text-overflow:ellipsis;white-space:nowrap}._sidebar_rztyo_74 a [data-component=badge]{margin-left:auto}._sidebar_rztyo_74 a[aria-current=page]{background:var(--colors-semantic-primary-primary-subtle);border-color:var(--colors-semantic-primary-primary-subtle-border);color:var(--colors-semantic-content-primary);font-weight:var(--font-font-weight-semibold)}._sidebar_rztyo_74 a:has(~a){margin-bottom:var(--shape-spacing-2xs)}._sidebar_rztyo_74 ._item_rztyo_17>a{display:grid}._sidebar_rztyo_74>:is(ol,ul){margin-block:var(--shape-spacing-2xs) 0!important}._sidebar_rztyo_74>:is(ol,ul)>li{margin-bottom:0;padding-block:0}._sidebar_rztyo_74>:is(ol,ul)>li:has(+li){margin-bottom:var(--shape-spacing-2xs)}._sidebar_rztyo_74 input{margin:3px 0!important}._sidebar_rztyo_74~._sidebar_rztyo_74{border-top:solid 1px var(--colors-semantic-border-default);margin-top:var(--shape-spacing-lg);padding-top:var(--shape-spacing-2xs)}._nav_rztyo_3._tabs_rztyo_131._tabs_rztyo_131{display:flex;gap:var(--utils-tokens-unit)}._nav_rztyo_3._tabs_rztyo_131._tabs_rztyo_131 a,._nav_rztyo_3._tabs_rztyo_131._tabs_rztyo_131 li{color:var(--colors-semantic-content-tertiary);display:inline-block;font-weight:var(--font-font-weight-semibold);padding:var(--scale-4) var(--scale-2) var(--scale-8) var(--scale-2);text-align:center;text-decoration:none}._nav_rztyo_3._tabs_rztyo_131._tabs_rztyo_131 a[aria-current=page],._nav_rztyo_3._tabs_rztyo_131._tabs_rztyo_131 li[aria-current=page]{border-bottom:var(--shape-border-width-default) solid var(--colors-semantic-content-primary);color:var(--colors-semantic-content-primary)}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151{-webkit-backdrop-filter:blur(var(--scale-8));backdrop-filter:blur(var(--scale-8));background-color:var(--colors-translucent);border:var(--scale-2) solid var(--colors-semantic-bg-surface);border-radius:var(--shape-border-radius-radius-2xl);box-shadow:var(--shape-box-shadow-sm-position-x) var(--shape-box-shadow-sm-position-y) var(--shape-box-shadow-sm-blur) var(--shape-box-shadow-sm-spread) var(--shape-box-shadow-sm-color);display:flex;left:50%;margin:0 auto;position:sticky;top:var(--utils-tokens-unit);transform:translate(-50%);width:-moz-fit-content;width:fit-content;z-index:2}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151:has(>:only-child){display:none}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151:before{background:var(--colors-purple-500);border-radius:var(--shape-border-radius-radius-2xl);content:"";inset-block:0;left:anchor(left);position:absolute;position-anchor:--current;transition:left var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),top var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),width var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);width:anchor-size(width);z-index:0}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a{border-radius:var(--scale-32);color:var(--colors-semantic-primary-primary);display:inline-block;font-weight:var(--font-font-weight-bold);padding:var(--utils-tokens-unit);position:relative;text-decoration:none;text-overflow:ellipsis;transition:color var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function),padding var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);white-space:nowrap;z-index:2}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a[aria-current=page]{anchor-name:--current;color:var(--colors-semantic-bg-surface)}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a[aria-current=page]:hover{color:var(--colors-semantic-bg-surface)}@media (width <= 1024px){._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151{flex-direction:column}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a[aria-current=page]{background-color:var(--colors-purple-500)}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a[aria-current=page]:after{background-color:var(--colors-semantic-bg-surface);content:"";display:inline-block;height:var(--utils-tokens-unit);margin-left:var(--scale-8);-webkit-mask-image:var(--icon-svg);mask-image:var(--icon-svg);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;transition:transform var(--utils-tokens-transition-duration) var(--utils-tokens-transition-timing-function);vertical-align:middle;width:var(--utils-tokens-unit)}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151 a:not([aria-current=page]){display:none}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151:before{display:none}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151[data-open=true] a{display:block}._nav_rztyo_3._pills_rztyo_151._pills_rztyo_151[data-open=true] a[aria-current=page]:after{transform:rotateX(180deg)}}@supports not (position-anchor: --x){._pills_rztyo_151:before{display:none}._pills_rztyo_151 a[aria-current=page]{background:var(--colors-purple-500);color:var(--colors-semantic-bg-surface)}}._sidebar_rztyo_74 a:hover:not([aria-current=page]),._sidebar_rztyo_74 ._item_rztyo_17:hover>a:not([aria-current=page]){background:var(--colors-semantic-interactive-hover-subtle);border-color:var(--colors-semantic-interactive-hover-subtle);color:var(--colors-semantic-content-primary)}

package/dist/assets/index16.css

@@ -1 +1 @@
-._attachments_1tffk_1{align-items:flex-start;display:flex;flex-direction:column;gap:var(--scale-8);margin-bottom:var(--scale-4);margin-top:var(--scale-4);max-width:min(90%,var(--shape-width-max-lg))}._message-group_1tffk_11{align-items:flex-start;display:flex;flex-direction:column}._message-group_1tffk_11[data-message-type=default]>._attachments_1tffk_1{margin-left:var(--scale-16)}._message-group_1tffk_11>:first-child{margin-left:var(--scale-16)}._message-group_1tffk_11>time{color:var(--colors-semantic-content-tertiary);margin-left:var(--scale-20);margin-right:var(--scale-16)}._message-group_1tffk_11[data-message-type=system],._message-group_1tffk_11:has([data-component=collapsible]){padding:0 var(--shape-spacing-md);margin-left:20%;margin-right:5%}._message-group_1tffk_11[data-message-type=system]>div:first-child,._message-group_1tffk_11:has([data-component=collapsible])>div:first-child{margin-left:0}._message-group_1tffk_11:has([data-component=collapsible]) [data-message-type=system]{margin-left:0;max-width:100%;padding-inline:0}._message-group_1tffk_11[data-message-type=user]{align-items:flex-end}._message-group_1tffk_11[data-message-type=user]>._attachments_1tffk_1{align-items:flex-end;margin-right:var(--scale-16)}._message_1tffk_11{border:solid var(--shape-border-width-default) var(--colors-semantic-border-default);margin:var(--scale-4) 0;padding:var(--utils-tokens-unit);white-space:pre-wrap;word-break:break-word}._message_1tffk_11:is([data-type=default],[data-type=user],[data-appearance=file]){max-width:min(90%,var(--shape-width-max-lg));width:-moz-fit-content;width:fit-content}._message_1tffk_11[data-type=default]{background-color:var(--colors-semantic-bg-page);border-left:none;border-radius:0 var(--utils-tokens-unit) var(--utils-tokens-unit) 0;margin-inline:var(--message-edge-gap, 0) auto}._message_1tffk_11:is([data-type=minimal],[data-type=system]){border:none}._message_1tffk_11[data-type=minimal]{margin:var(--scale-8) 0 0 0;padding:0}._message_1tffk_11[data-appearance=file] ul{margin:0}._message_1tffk_11[data-type=user]{background-color:var(--colors-semantic-primary-primary-subtle);border-radius:var(--utils-tokens-unit) 0 0 var(--utils-tokens-unit);border-right:none;margin-inline:auto var(--message-edge-gap, 0)}._message_1tffk_11[data-type=user][data-appearance=file] ul{text-align:right}._message_1tffk_11[data-type=system]{border-bottom:solid var(--shape-border-width-default) var(--colors-semantic-border-strong);color:var(--colors-semantic-content-secondary);font-size:var(--typography-font-sizes-label-sm);padding:0;padding-bottom:var(--shape-spacing-xs);text-align:left}._message_1tffk_11[data-type=system] [data-component=icon]:first-of-type{height:var(--utils-tokens-icon-tiny);width:var(--utils-tokens-icon-tiny)}._message_1tffk_11[data-appearance=file]{--message-edge-gap: var(--scale-16);background-color:transparent;border:0;padding:0}._message_1tffk_11[data-appearance=document]{max-width:min(90%,var(--shape-width-max-lg));overflow:hidden;padding:0;width:100%}._message_1tffk_11 p:first-child{margin-top:0}._message_1tffk_11 p:last-child{margin-bottom:0}._message_1tffk_11 [data-component=collapsible] p{font-size:var(--typography-font-sizes-label-sm)}._timestamp_1tffk_144{color:var(--colors-semantic-content-secondary);font-size:var(--typography-font-sizes-caption)}._preview_1tffk_149{-webkit-box-orient:vertical;-webkit-line-clamp:2;display:-webkit-box;text-overflow:ellipsis}@media (width < 1024px){._message-group_1tffk_11[data-message-type=system],._message-group_1tffk_11:has([data-component=collapsible]){margin-left:10%;margin-right:5%}}@media (width < 480px){._message-group_1tffk_11[data-message-type=system],._message-group_1tffk_11:has([data-component=collapsible]){margin-inline:0}}
+._attachments_77ukg_1{align-items:flex-start;display:flex;flex-direction:column;gap:var(--scale-8);margin-bottom:var(--scale-4);margin-top:var(--scale-4);max-width:min(90%,var(--shape-width-max-lg))}._message-group_77ukg_11{align-items:flex-start;display:flex;flex-direction:column}._message-group_77ukg_11[data-message-type=default]>._attachments_77ukg_1{margin-left:var(--scale-16)}._message-group_77ukg_11>:first-child{margin-left:var(--scale-16)}._message-group_77ukg_11>time,._message-group_77ukg_11>._footer_77ukg_27{color:var(--colors-semantic-content-tertiary);margin-left:var(--scale-20);margin-right:var(--scale-16)}._message-group_77ukg_11>._footer_77ukg_27{align-items:center;display:flex;flex-wrap:wrap;gap:var(--scale-4) var(--scale-8)}._message-group_77ukg_11[data-message-type=system],._message-group_77ukg_11:has([data-component=collapsible]){padding:0 var(--shape-spacing-md);margin-left:20%;margin-right:5%}._message-group_77ukg_11[data-message-type=system]>div:first-child,._message-group_77ukg_11:has([data-component=collapsible])>div:first-child{margin-left:0}._message-group_77ukg_11:has([data-component=collapsible]) [data-message-type=system]{margin-left:0;max-width:100%;padding-inline:0}._message-group_77ukg_11[data-message-type=user]{align-items:flex-end}._message-group_77ukg_11[data-message-type=user]>._attachments_77ukg_1{align-items:flex-end;margin-right:var(--scale-16)}._message_77ukg_11{border:solid var(--shape-border-width-default) var(--colors-semantic-border-default);margin:var(--scale-4) 0;padding:var(--utils-tokens-unit);white-space:pre-wrap;word-break:break-word}._message_77ukg_11:is([data-type=default],[data-type=user],[data-appearance=file]){max-width:min(90%,var(--shape-width-max-lg));width:-moz-fit-content;width:fit-content}._message_77ukg_11[data-type=default]{background-color:var(--colors-semantic-bg-page);border-left:none;border-radius:0 var(--utils-tokens-unit) var(--utils-tokens-unit) 0;margin-inline:var(--message-edge-gap, 0) auto}._message_77ukg_11:is([data-type=minimal],[data-type=system]){border:none}._message_77ukg_11[data-type=minimal]{margin:var(--scale-8) 0 0 0;padding:0}._message_77ukg_11[data-appearance=file] ul{margin:0}._message_77ukg_11[data-type=user]{background-color:var(--colors-semantic-primary-primary-subtle);border-radius:var(--utils-tokens-unit) 0 0 var(--utils-tokens-unit);border-right:none;margin-inline:auto var(--message-edge-gap, 0)}._message_77ukg_11[data-type=user][data-appearance=file] ul{text-align:right}._message_77ukg_11[data-type=system]{border-bottom:solid var(--shape-border-width-default) var(--colors-semantic-border-strong);color:var(--colors-semantic-content-secondary);font-size:var(--typography-font-sizes-label-sm);padding:0;padding-bottom:var(--shape-spacing-xs);text-align:left}._message_77ukg_11[data-type=system] [data-component=icon]:first-of-type{height:var(--utils-tokens-icon-tiny);width:var(--utils-tokens-icon-tiny)}._message_77ukg_11[data-appearance=file]{--message-edge-gap: var(--scale-16);background-color:transparent;border:0;padding:0}._message_77ukg_11[data-appearance=document]{max-width:min(90%,var(--shape-width-max-lg));overflow:hidden;padding:0;width:100%}._message_77ukg_11 p:first-child{margin-top:0}._message_77ukg_11 p:last-child{margin-bottom:0}._message_77ukg_11 [data-component=collapsible] p{font-size:var(--typography-font-sizes-label-sm)}._timestamp_77ukg_152{color:var(--colors-semantic-content-secondary);font-size:var(--typography-font-sizes-caption)}._actions_77ukg_157{align-items:center;display:flex;gap:var(--scale-4)}._actions_77ukg_157 [data-component=button]{font-size:var(--typography-font-sizes-caption);min-height:0;padding-block:0}._preview_77ukg_169{-webkit-box-orient:vertical;-webkit-line-clamp:2;display:-webkit-box;text-overflow:ellipsis}@media (width < 1024px){._message-group_77ukg_11[data-message-type=system],._message-group_77ukg_11:has([data-component=collapsible]){margin-left:10%;margin-right:5%}}@media (width < 480px){._message-group_77ukg_11[data-message-type=system],._message-group_77ukg_11:has([data-component=collapsible]){margin-inline:0}}

package/dist/components/controls/index.cjs

@@ -1,2 +1,3 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index36.css');const b=require("react/jsx-runtime"),U=require("../../classix-5H4IWnMA.cjs"),m=require("react"),X=require("../button/index.cjs"),A=require("../../menu-popover-CM3v5s-5.cjs"),Y="_controls_t1re6_13",Z="_inline_t1re6_43",ee="_embedded_t1re6_48",te="_fixed_t1re6_49",ne="_adaptive_t1re6_60",ie="_measurement_t1re6_65",h={controls:Y,default:"_default_t1re6_28",inline:Z,embedded:ee,fixed:te,adaptive:ne,measurement:ie,"non-button-content":"_non-button-content_t1re6_99","overflow-trigger":"_overflow-trigger_t1re6_128"},re={primary:2,secondary:1,tertiary:0,simple:0},oe={default:h.default,embedded:h.embedded,fixed:h.fixed,inline:h.inline},de=d=>re[d.props.variant??"secondary"];function se({buttons:d,menuAccessibleLabel:i,triggerAccessibleLabel:n}){const x=d.map(o=>({button:o,isDanger:o.props.intent==="danger",value:o}));return b.jsx(A.MenuPopover,{triggerAccessibleLabel:n,"data-component":"overflowmenu",children:({close:o,initialFocus:r})=>b.jsx(A.MenuActionList,{actions:x,initialFocus:r,menuAccessibleLabel:i,onSelect:()=>o(),usesMenuSemantics:!0})})}const p=(d,i)=>{const n=Number.parseFloat(String(d[i]));return Number.isFinite(n)?n:0},ce=d=>{if(!d.trim().endsWith("px"))return;const i=Number.parseFloat(d);return Number.isFinite(i)?i:void 0},le=(d,i)=>{const n=d.parentElement;if(!n)return;const x=n.getBoundingClientRect(),o=getComputedStyle(n),r=x.width||n.clientWidth,C=x.left+p(o,"borderLeftWidth")+p(o,"paddingLeft"),M=x.left+r-p(o,"borderRightWidth")-p(o,"paddingRight"),_=Array.from(n.children).slice(0,Array.from(n.children).indexOf(d)),R=_.reduce((f,a)=>Math.max(f,a.getBoundingClientRect().right),C),c=_.length>0?p(o,"columnGap"):0,l=Math.max(0,M-R-c),W=(i==null?void 0:i.parent)===n?Math.max(0,r-i.parentWidth):0;return{availableWidth:W>0?Math.max(l,((i==null?void 0:i.availableWidth)??0)+W):l,parent:n,parentWidth:r}},ae=({children:d,className:i,maxVisibleButtons:n,overflow:x,overflowAccessibleLabel:o="More actions",variant:r="default",...C})=>{const M=m.Children.toArray(d),_=[],R=[];M.forEach(e=>{m.isValidElement(e)&&e.type===X.Button?_.push(e):R.push(e)});const c=_.map((e,s)=>({button:e,index:s,rank:de(e)})).sort((e,s)=>e.rank-s.rank||e.index-s.index).map(({button:e,index:s})=>m.cloneElement(e,{key:e.key??s})),l=r==="embedded"||r==="fixed"&&x==="menu",W=typeof n=="number"&&Number.isFinite(n)?Math.floor(n):0,f=r==="embedded"&&W>0?Math.min(c.length,W):c.length,a=m.useRef(null),N=m.useRef(void 0),j=m.useRef(null),B=m.useRef(null),[z,S]=m.useState(f),g=m.useCallback(()=>{var L,I,T;if(!l){S(f);return}const e=a.current,s=j.current;if(!e||!s)return;const w=Array.from(s.querySelectorAll('[data-component="button"]')),y=w.at(-1);if(!y)return;const v=w.slice(0,c.length).map(t=>t.getBoundingClientRect().width);if(v.length!==c.length)return;const u=getComputedStyle(e),G=p(u,"paddingLeft")+p(u,"paddingRight")+p(u,"borderLeftWidth")+p(u,"borderRightWidth"),$=ce(u.maxWidth),E=r==="embedded"?le(e,N.current):void 0;E&&(N.current=E);const H=(E==null?void 0:E.availableWidth)??((L=e.parentElement)==null?void 0:L.clientWidth)??0,J=((I=window.visualViewport)==null?void 0:I.width)??document.documentElement.clientWidth,O=Math.min(...[$,H,J].filter(t=>typeof t=="number"&&Number.isFinite(t)&&t>0));if(!Number.isFinite(O))return;const V=Math.max(0,O-G),q=((T=B.current)==null?void 0:T.getBoundingClientRect().width)??0,K=v.reduce((t,Q)=>t+Q,0);if(f===c.length&&q+K<=V){S(t=>t===f?t:f);return}let P=q+y.getBoundingClientRect().width,k=0;for(let t=0;t<f&&!(P+v[t]>V);t+=1)P+=v[t],k=t+1;S(t=>t===k?t:k)},[l,c.length,r,f]);if(m.useLayoutEffect(()=>{var s,w,y,v;if(g(),!l)return;const e=typeof ResizeObserver>"u"?void 0:new ResizeObserver(g);return a.current&&(e==null||e.observe(a.current)),(s=a.current)!=null&&s.parentElement&&(e==null||e.observe(a.current.parentElement)),r==="embedded"&&((w=a.current)!=null&&w.parentElement)&&Array.from(a.current.parentElement.children).forEach(u=>{u!==a.current&&(e==null||e.observe(u))}),B.current&&(e==null||e.observe(B.current)),window.addEventListener("resize",g),(y=window.visualViewport)==null||y.addEventListener("resize",g),(v=document.fonts)==null||v.ready.then(g),()=>{var u;e==null||e.disconnect(),window.removeEventListener("resize",g),(u=window.visualViewport)==null||u.removeEventListener("resize",g)}},[l,d,g,r]),M.length===0)return null;const D=l?c.slice(0,z):c,F=l?c.slice(z):[];return b.jsxs("div",{"data-component":"controls","data-dynamic-position":r==="fixed"?!0:void 0,"data-adaptive":l?!0:void 0,className:U.t(h.controls,oe[r],l&&h.adaptive,i),ref:a,...C,children:[l&&b.jsxs("div",{"aria-hidden":"true",className:h.measurement,ref:j,children:[c.map((e,s)=>m.cloneElement(e,{"aria-hidden":!0,id:void 0,key:`measure-${String(e.key??s)}`,onClick:void 0,ref:void 0,tabIndex:-1})),b.jsx(A.MenuPopover,{triggerAccessibleLabel:o,children:null})]}),r!=="embedded"&&R.length>0&&b.jsx("span",{className:h["non-button-content"],ref:B,children:R}),D,F.length>0&&b.jsx("span",{className:h["overflow-trigger"],children:b.jsx(se,{buttons:F,menuAccessibleLabel:o,triggerAccessibleLabel:o})})]})};exports.Controls=ae;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index36.css');const b=require("react/jsx-runtime"),Z=require("../../classix-5H4IWnMA.cjs"),l=require("react"),ee=require("../button/index.cjs"),A=require("../../menu-popover-CM3v5s-5.cjs"),te="_controls_t1re6_13",ne="_inline_t1re6_43",ie="_embedded_t1re6_48",re="_fixed_t1re6_49",oe="_adaptive_t1re6_60",se="_measurement_t1re6_65",h={controls:te,default:"_default_t1re6_28",inline:ne,embedded:ie,fixed:re,adaptive:oe,measurement:se,"non-button-content":"_non-button-content_t1re6_99","overflow-trigger":"_overflow-trigger_t1re6_128"},de={primary:2,secondary:1,tertiary:0,simple:0},ce={default:h.default,embedded:h.embedded,fixed:h.fixed,inline:h.inline},ae=s=>de[s.props.variant??"secondary"];function le({buttons:s,menuAccessibleLabel:i,triggerAccessibleLabel:n}){const x=s.map(o=>({button:o,isDanger:o.props.intent==="danger",value:o}));return b.jsx(A.MenuPopover,{triggerAccessibleLabel:n,"data-component":"overflowmenu",children:({close:o,initialFocus:r})=>b.jsx(A.MenuActionList,{actions:x,initialFocus:r,menuAccessibleLabel:i,onSelect:()=>o(),usesMenuSemantics:!0})})}const p=(s,i)=>{const n=Number.parseFloat(String(s[i]));return Number.isFinite(n)?n:0},ue=s=>{if(!s.trim().endsWith("px"))return;const i=Number.parseFloat(s);return Number.isFinite(i)?i:void 0},me=(s,i)=>{const n=s.parentElement;if(!n)return;const x=n.getBoundingClientRect(),o=getComputedStyle(n),r=x.width||n.clientWidth,S=x.left+p(o,"borderLeftWidth")+p(o,"paddingLeft"),M=x.left+r-p(o,"borderRightWidth")-p(o,"paddingRight"),_=Array.from(n.children).slice(0,Array.from(n.children).indexOf(s)),y=_.reduce((f,u)=>Math.max(f,u.getBoundingClientRect().right),S),c=_.length>0?p(o,"columnGap"):0,a=Math.max(0,M-y-c),R=(i==null?void 0:i.parent)===n?Math.max(0,r-i.parentWidth):0;return{availableWidth:R>0?Math.max(a,((i==null?void 0:i.availableWidth)??0)+R):a,parent:n,parentWidth:r}},fe=({children:s,className:i,maxVisibleButtons:n,overflow:x,overflowAccessibleLabel:o="More actions",variant:r="default",...S})=>{const M=l.Children.toArray(s),_=[],y=[];M.forEach(e=>{l.isValidElement(e)&&e.type===ee.Button?_.push(e):y.push(e)});const c=_.map((e,d)=>({button:e,index:d,rank:ae(e)})).sort((e,d)=>e.rank-d.rank||e.index-d.index).map(({button:e,index:d})=>l.cloneElement(e,{key:e.key??d})),a=r==="embedded"||r==="fixed"&&x==="menu",R=typeof n=="number"&&Number.isFinite(n)?Math.floor(n):0,f=r==="embedded"&&R>0?Math.min(c.length,R):c.length,u=l.useRef(null),N=l.useRef(void 0),z=l.useRef(null),E=l.useRef(null),[F,C]=l.useState(f),k=c.map(e=>String(e.key)).join(`
+`),[D,G]=l.useState(k);D!==k&&(G(k),C(f));const g=l.useCallback(()=>{var L,I,T;if(!a){C(f);return}const e=u.current,d=z.current;if(!e||!d)return;const W=Array.from(d.querySelectorAll('[data-component="button"]')),w=W.at(-1);if(!w)return;const v=W.slice(0,c.length).map(t=>t.getBoundingClientRect().width);if(v.length!==c.length)return;const m=getComputedStyle(e),H=p(m,"paddingLeft")+p(m,"paddingRight")+p(m,"borderLeftWidth")+p(m,"borderRightWidth"),J=ue(m.maxWidth),B=r==="embedded"?me(e,N.current):void 0;B&&(N.current=B);const Q=(B==null?void 0:B.availableWidth)??((L=e.parentElement)==null?void 0:L.clientWidth)??0,U=((I=window.visualViewport)==null?void 0:I.width)??document.documentElement.clientWidth,V=Math.min(...[J,Q,U].filter(t=>typeof t=="number"&&Number.isFinite(t)&&t>0));if(!Number.isFinite(V))return;const q=Math.max(0,V-H),P=((T=E.current)==null?void 0:T.getBoundingClientRect().width)??0,X=v.reduce((t,Y)=>t+Y,0);if(f===c.length&&P+X<=q){C(t=>t===f?t:f);return}let K=P+w.getBoundingClientRect().width,j=0;for(let t=0;t<f&&!(K+v[t]>q);t+=1)K+=v[t],j=t+1;C(t=>t===j?t:j)},[a,c.length,r,f]);if(l.useLayoutEffect(()=>{var d,W,w,v;if(g(),!a)return;const e=typeof ResizeObserver>"u"?void 0:new ResizeObserver(g);return u.current&&(e==null||e.observe(u.current)),(d=u.current)!=null&&d.parentElement&&(e==null||e.observe(u.current.parentElement)),r==="embedded"&&((W=u.current)!=null&&W.parentElement)&&Array.from(u.current.parentElement.children).forEach(m=>{m!==u.current&&(e==null||e.observe(m))}),E.current&&(e==null||e.observe(E.current)),window.addEventListener("resize",g),(w=window.visualViewport)==null||w.addEventListener("resize",g),(v=document.fonts)==null||v.ready.then(g),()=>{var m;e==null||e.disconnect(),window.removeEventListener("resize",g),(m=window.visualViewport)==null||m.removeEventListener("resize",g)}},[a,s,g,r]),M.length===0)return null;const $=a?c.slice(0,F):c,O=a?c.slice(F):[];return b.jsxs("div",{"data-component":"controls","data-dynamic-position":r==="fixed"?!0:void 0,"data-adaptive":a?!0:void 0,className:Z.t(h.controls,ce[r],a&&h.adaptive,i),ref:u,...S,children:[a&&b.jsxs("div",{"aria-hidden":"true",className:h.measurement,ref:z,children:[c.map((e,d)=>l.cloneElement(e,{"aria-hidden":!0,id:void 0,key:`measure-${String(e.key??d)}`,onClick:void 0,ref:void 0,tabIndex:-1})),b.jsx(A.MenuPopover,{triggerAccessibleLabel:o,children:null})]}),r!=="embedded"&&y.length>0&&b.jsx("span",{className:h["non-button-content"],ref:E,children:y}),$,O.length>0&&b.jsx("span",{className:h["overflow-trigger"],children:b.jsx(le,{buttons:O,menuAccessibleLabel:o,triggerAccessibleLabel:o})})]})};exports.Controls=fe;
 //# sourceMappingURL=index.cjs.map

package/dist/components/controls/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.intent === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      data-adaptive={adaptive ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","intent","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.intent === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n  const buttonKeys = sortedButtons.map((button) => String(button.key)).join('\\n');\n  const [measuredButtonKeys, setMeasuredButtonKeys] = useState(buttonKeys);\n\n  if (measuredButtonKeys !== buttonKeys) {\n    setMeasuredButtonKeys(buttonKeys);\n    setVisibleButtonCount(visibleButtonLimit);\n  }\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      data-adaptive={adaptive ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","intent","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","buttonKeys","join","measuredButtonKeys","setMeasuredButtonKeys","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}

package/dist/components/controls/index.js

@@ -1,30 +1,30 @@
 import { jsxs as G, jsx as v } from "react/jsx-runtime";
-import { t as Y } from "../../classix-DG18itHa.js";
-import { Children as Z, isValidElement as ee, cloneElement as P, useRef as M, useState as te, useCallback as ne, useLayoutEffect as ie } from "react";
-import { Button as re } from "../button/index.js";
-import { a as T, M as oe } from "../../menu-popover-DOkciab5.js";
-import '../../assets/index36.css';const de = "_controls_t1re6_13", se = "_inline_t1re6_43", ce = "_embedded_t1re6_48", ae = "_fixed_t1re6_49", le = "_adaptive_t1re6_60", ue = "_measurement_t1re6_65", f = {
-  controls: de,
+import { t as ne } from "../../classix-DG18itHa.js";
+import { Children as ie, isValidElement as re, cloneElement as P, useRef as C, useState as T, useCallback as oe, useLayoutEffect as de } from "react";
+import { Button as se } from "../button/index.js";
+import { a as $, M as ce } from "../../menu-popover-DOkciab5.js";
+import '../../assets/index36.css';const ae = "_controls_t1re6_13", le = "_inline_t1re6_43", ue = "_embedded_t1re6_48", me = "_fixed_t1re6_49", fe = "_adaptive_t1re6_60", he = "_measurement_t1re6_65", f = {
+  controls: ae,
   default: "_default_t1re6_28",
-  inline: se,
-  embedded: ce,
-  fixed: ae,
-  adaptive: le,
-  measurement: ue,
+  inline: le,
+  embedded: ue,
+  fixed: me,
+  adaptive: fe,
+  measurement: he,
   "non-button-content": "_non-button-content_t1re6_99",
   "overflow-trigger": "_overflow-trigger_t1re6_128"
-}, me = {
+}, pe = {
   primary: 2,
   secondary: 1,
   tertiary: 0,
   simple: 0
-}, fe = {
+}, ge = {
   default: f.default,
   embedded: f.embedded,
   fixed: f.fixed,
   inline: f.inline
-}, he = (d) => me[d.props.variant ?? "secondary"];
-function pe({
+}, be = (d) => pe[d.props.variant ?? "secondary"];
+function ve({
   buttons: d,
   menuAccessibleLabel: i,
   triggerAccessibleLabel: n
@@ -34,90 +34,93 @@ function pe({
     isDanger: o.props.intent === "danger",
     value: o
   }));
-  return /* @__PURE__ */ v(T, { triggerAccessibleLabel: n, "data-component": "overflowmenu", children: ({
+  return /* @__PURE__ */ v($, { triggerAccessibleLabel: n, "data-component": "overflowmenu", children: ({
     close: o,
     initialFocus: r
-  }) => /* @__PURE__ */ v(oe, { actions: g, initialFocus: r, menuAccessibleLabel: i, onSelect: () => o(), usesMenuSemantics: !0 }) });
+  }) => /* @__PURE__ */ v(ce, { actions: g, initialFocus: r, menuAccessibleLabel: i, onSelect: () => o(), usesMenuSemantics: !0 }) });
 }
 const h = (d, i) => {
   const n = Number.parseFloat(String(d[i]));
   return Number.isFinite(n) ? n : 0;
-}, ge = (d) => {
+}, _e = (d) => {
   if (!d.trim().endsWith("px")) return;
   const i = Number.parseFloat(d);
   return Number.isFinite(i) ? i : void 0;
-}, be = (d, i) => {
+}, We = (d, i) => {
   const n = d.parentElement;
   if (!n) return;
-  const g = n.getBoundingClientRect(), o = getComputedStyle(n), r = g.width || n.clientWidth, C = g.left + h(o, "borderLeftWidth") + h(o, "paddingLeft"), B = g.left + r - h(o, "borderRightWidth") - h(o, "paddingRight"), _ = Array.from(n.children).slice(0, Array.from(n.children).indexOf(d)), W = _.reduce((m, l) => Math.max(m, l.getBoundingClientRect().right), C), c = _.length > 0 ? h(o, "columnGap") : 0, a = Math.max(0, B - W - c), x = (i == null ? void 0 : i.parent) === n ? Math.max(0, r - i.parentWidth) : 0;
+  const g = n.getBoundingClientRect(), o = getComputedStyle(n), r = g.width || n.clientWidth, S = g.left + h(o, "borderLeftWidth") + h(o, "paddingLeft"), B = g.left + r - h(o, "borderRightWidth") - h(o, "paddingRight"), _ = Array.from(n.children).slice(0, Array.from(n.children).indexOf(d)), W = _.reduce((m, l) => Math.max(m, l.getBoundingClientRect().right), S), c = _.length > 0 ? h(o, "columnGap") : 0, a = Math.max(0, B - W - c), x = (i == null ? void 0 : i.parent) === n ? Math.max(0, r - i.parentWidth) : 0;
   return {
     availableWidth: x > 0 ? Math.max(a, ((i == null ? void 0 : i.availableWidth) ?? 0) + x) : a,
     parent: n,
     parentWidth: r
   };
-}, Re = ({
+}, Me = ({
   children: d,
   className: i,
   maxVisibleButtons: n,
   overflow: g,
   overflowAccessibleLabel: o = "More actions",
   variant: r = "default",
-  ...C
+  ...S
 }) => {
-  const B = Z.toArray(d), _ = [], W = [];
+  const B = ie.toArray(d), _ = [], W = [];
   B.forEach((e) => {
-    ee(e) && e.type === re ? _.push(e) : W.push(e);
+    re(e) && e.type === se ? _.push(e) : W.push(e);
   });
   const c = _.map((e, s) => ({
     button: e,
     index: s,
-    rank: he(e)
+    rank: be(e)
   })).sort((e, s) => e.rank - s.rank || e.index - s.index).map(({
     button: e,
     index: s
   }) => P(e, {
     key: e.key ?? s
-  })), a = r === "embedded" || r === "fixed" && g === "menu", x = typeof n == "number" && Number.isFinite(n) ? Math.floor(n) : 0, m = r === "embedded" && x > 0 ? Math.min(c.length, x) : c.length, l = M(null), A = M(void 0), N = M(null), E = M(null), [z, S] = te(m), p = ne(() => {
+  })), a = r === "embedded" || r === "fixed" && g === "menu", x = typeof n == "number" && Number.isFinite(n) ? Math.floor(n) : 0, m = r === "embedded" && x > 0 ? Math.min(c.length, x) : c.length, l = C(null), N = C(void 0), z = C(null), M = C(null), [F, E] = T(m), k = c.map((e) => String(e.key)).join(`
+`), [H, J] = T(k);
+  H !== k && (J(k), E(m));
+  const p = oe(() => {
     var I, q, D;
     if (!a) {
-      S(m);
+      E(m);
       return;
     }
-    const e = l.current, s = N.current;
+    const e = l.current, s = z.current;
     if (!e || !s) return;
-    const w = Array.from(s.querySelectorAll('[data-component="button"]')), R = w.at(-1);
-    if (!R) return;
-    const b = w.slice(0, c.length).map((t) => t.getBoundingClientRect().width);
+    const y = Array.from(s.querySelectorAll('[data-component="button"]')), w = y.at(-1);
+    if (!w) return;
+    const b = y.slice(0, c.length).map((t) => t.getBoundingClientRect().width);
     if (b.length !== c.length) return;
-    const u = getComputedStyle(e), H = h(u, "paddingLeft") + h(u, "paddingRight") + h(u, "borderLeftWidth") + h(u, "borderRightWidth"), J = ge(u.maxWidth), y = r === "embedded" ? be(e, A.current) : void 0;
-    y && (A.current = y);
-    const K = (y == null ? void 0 : y.availableWidth) ?? ((I = e.parentElement) == null ? void 0 : I.clientWidth) ?? 0, Q = ((q = window.visualViewport) == null ? void 0 : q.width) ?? document.documentElement.clientWidth, V = Math.min(...[J, K, Q].filter((t) => typeof t == "number" && Number.isFinite(t) && t > 0));
-    if (!Number.isFinite(V)) return;
-    const O = Math.max(0, V - H), L = ((D = E.current) == null ? void 0 : D.getBoundingClientRect().width) ?? 0, U = b.reduce((t, X) => t + X, 0);
-    if (m === c.length && L + U <= O) {
-      S((t) => t === m ? t : m);
+    const u = getComputedStyle(e), U = h(u, "paddingLeft") + h(u, "paddingRight") + h(u, "borderLeftWidth") + h(u, "borderRightWidth"), X = _e(u.maxWidth), R = r === "embedded" ? We(e, N.current) : void 0;
+    R && (N.current = R);
+    const Y = (R == null ? void 0 : R.availableWidth) ?? ((I = e.parentElement) == null ? void 0 : I.clientWidth) ?? 0, Z = ((q = window.visualViewport) == null ? void 0 : q.width) ?? document.documentElement.clientWidth, O = Math.min(...[X, Y, Z].filter((t) => typeof t == "number" && Number.isFinite(t) && t > 0));
+    if (!Number.isFinite(O)) return;
+    const j = Math.max(0, O - U), K = ((D = M.current) == null ? void 0 : D.getBoundingClientRect().width) ?? 0, ee = b.reduce((t, te) => t + te, 0);
+    if (m === c.length && K + ee <= j) {
+      E((t) => t === m ? t : m);
       return;
     }
-    let j = L + R.getBoundingClientRect().width, k = 0;
-    for (let t = 0; t < m && !(j + b[t] > O); t += 1)
-      j += b[t], k = t + 1;
-    S((t) => t === k ? t : k);
+    let L = K + w.getBoundingClientRect().width, A = 0;
+    for (let t = 0; t < m && !(L + b[t] > j); t += 1)
+      L += b[t], A = t + 1;
+    E((t) => t === A ? t : A);
   }, [a, c.length, r, m]);
-  if (ie(() => {
-    var s, w, R, b;
+  if (de(() => {
+    var s, y, w, b;
     if (p(), !a) return;
     const e = typeof ResizeObserver > "u" ? void 0 : new ResizeObserver(p);
-    return l.current && (e == null || e.observe(l.current)), (s = l.current) != null && s.parentElement && (e == null || e.observe(l.current.parentElement)), r === "embedded" && ((w = l.current) != null && w.parentElement) && Array.from(l.current.parentElement.children).forEach((u) => {
+    return l.current && (e == null || e.observe(l.current)), (s = l.current) != null && s.parentElement && (e == null || e.observe(l.current.parentElement)), r === "embedded" && ((y = l.current) != null && y.parentElement) && Array.from(l.current.parentElement.children).forEach((u) => {
       u !== l.current && (e == null || e.observe(u));
-    }), E.current && (e == null || e.observe(E.current)), window.addEventListener("resize", p), (R = window.visualViewport) == null || R.addEventListener("resize", p), (b = document.fonts) == null || b.ready.then(p), () => {
+    }), M.current && (e == null || e.observe(M.current)), window.addEventListener("resize", p), (w = window.visualViewport) == null || w.addEventListener("resize", p), (b = document.fonts) == null || b.ready.then(p), () => {
       var u;
       e == null || e.disconnect(), window.removeEventListener("resize", p), (u = window.visualViewport) == null || u.removeEventListener("resize", p);
     };
   }, [a, d, p, r]), B.length === 0)
     return null;
-  const $ = a ? c.slice(0, z) : c, F = a ? c.slice(z) : [];
-  return /* @__PURE__ */ G("div", { "data-component": "controls", "data-dynamic-position": r === "fixed" ? !0 : void 0, "data-adaptive": a ? !0 : void 0, className: Y(f.controls, fe[r], a && f.adaptive, i), ref: l, ...C, children: [
-    a && /* @__PURE__ */ G("div", { "aria-hidden": "true", className: f.measurement, ref: N, children: [
+  const Q = a ? c.slice(0, F) : c, V = a ? c.slice(F) : [];
+  return /* @__PURE__ */ G("div", { "data-component": "controls", "data-dynamic-position": r === "fixed" ? !0 : void 0, "data-adaptive": a ? !0 : void 0, className: ne(f.controls, ge[r], a && f.adaptive, i), ref: l, ...S, children: [
+    a && /* @__PURE__ */ G("div", { "aria-hidden": "true", className: f.measurement, ref: z, children: [
       c.map((e, s) => P(e, {
         "aria-hidden": !0,
         id: void 0,
@@ -126,14 +129,14 @@ const h = (d, i) => {
         ref: void 0,
         tabIndex: -1
       })),
-      /* @__PURE__ */ v(T, { triggerAccessibleLabel: o, children: null })
+      /* @__PURE__ */ v($, { triggerAccessibleLabel: o, children: null })
     ] }),
-    r !== "embedded" && W.length > 0 && /* @__PURE__ */ v("span", { className: f["non-button-content"], ref: E, children: W }),
-    $,
-    F.length > 0 && /* @__PURE__ */ v("span", { className: f["overflow-trigger"], children: /* @__PURE__ */ v(pe, { buttons: F, menuAccessibleLabel: o, triggerAccessibleLabel: o }) })
+    r !== "embedded" && W.length > 0 && /* @__PURE__ */ v("span", { className: f["non-button-content"], ref: M, children: W }),
+    Q,
+    V.length > 0 && /* @__PURE__ */ v("span", { className: f["overflow-trigger"], children: /* @__PURE__ */ v(ve, { buttons: V, menuAccessibleLabel: o, triggerAccessibleLabel: o }) })
   ] });
 };
 export {
-  Re as Controls
+  Me as Controls
 };
 //# sourceMappingURL=index.js.map

package/dist/components/controls/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.intent === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      data-adaptive={adaptive ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","intent","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../src/components/controls/index.tsx"],"sourcesContent":["import cx from 'classix';\nimport {\n  Children,\n  cloneElement,\n  isValidElement,\n  useCallback,\n  useLayoutEffect,\n  useRef,\n  useState,\n} from 'react';\n\nimport { Button, type ButtonProps } from '../button';\nimport { type MenuAction, MenuActionList } from '../menu/action-list';\nimport { MenuPopover } from '../menu/menu-popover';\nimport styles from './styles.module.css';\n\nconst buttonVariantOrder = {\n  primary: 2,\n  secondary: 1,\n  tertiary: 0,\n  simple: 0,\n} satisfies Record<NonNullable<ButtonProps['variant']>, number>;\n\nconst variants = {\n  default: styles.default,\n  embedded: styles.embedded,\n  fixed: styles.fixed,\n  inline: styles.inline,\n};\n\nexport type ControlsProps = React.HTMLAttributes<HTMLDivElement> & {\n  children?: React.ReactNode;\n  maxVisibleButtons?: number;\n  overflow?: 'menu';\n  overflowAccessibleLabel?: string;\n  variant?: keyof typeof variants;\n};\n\nconst getButtonRank = (button: React.ReactElement<ButtonProps>) =>\n  buttonVariantOrder[button.props.variant ?? 'secondary'];\n\nfunction OverflowMenu({\n  buttons,\n  menuAccessibleLabel,\n  triggerAccessibleLabel,\n}: {\n  buttons: React.ReactElement<ButtonProps>[];\n  menuAccessibleLabel: string;\n  triggerAccessibleLabel: string;\n}) {\n  const actions: MenuAction<React.ReactElement<ButtonProps>>[] = buttons.map((button) => ({\n    button,\n    isDanger: button.props.intent === 'danger',\n    value: button,\n  }));\n\n  return (\n    <MenuPopover triggerAccessibleLabel={triggerAccessibleLabel}>\n      {({ close, initialFocus }) => (\n        <MenuActionList\n          actions={actions}\n          initialFocus={initialFocus}\n          menuAccessibleLabel={menuAccessibleLabel}\n          onSelect={() => close()}\n          usesMenuSemantics\n        />\n      )}\n    </MenuPopover>\n  );\n}\n\nconst numericStyle = (style: CSSStyleDeclaration, property: keyof CSSStyleDeclaration) => {\n  const value = Number.parseFloat(String(style[property]));\n  return Number.isFinite(value) ? value : 0;\n};\n\nconst pixelStyle = (value: string) => {\n  if (!value.trim().endsWith('px')) return undefined;\n  const parsedValue = Number.parseFloat(value);\n  return Number.isFinite(parsedValue) ? parsedValue : undefined;\n};\n\ntype EmbeddedLayout = {\n  availableWidth: number;\n  parent: HTMLElement;\n  parentWidth: number;\n};\n\nconst availableWidthToRight = (\n  controls: HTMLDivElement,\n  previousLayout?: EmbeddedLayout\n): EmbeddedLayout | undefined => {\n  const parent = controls.parentElement;\n  if (!parent) return undefined;\n\n  const parentRect = parent.getBoundingClientRect();\n  const parentStyle = getComputedStyle(parent);\n  const parentWidth = parentRect.width || parent.clientWidth;\n  const contentLeft =\n    parentRect.left +\n    numericStyle(parentStyle, 'borderLeftWidth') +\n    numericStyle(parentStyle, 'paddingLeft');\n  const contentRight =\n    parentRect.left +\n    parentWidth -\n    numericStyle(parentStyle, 'borderRightWidth') -\n    numericStyle(parentStyle, 'paddingRight');\n  const precedingSiblings = Array.from(parent.children).slice(\n    0,\n    Array.from(parent.children).indexOf(controls)\n  );\n  const occupiedRight = precedingSiblings.reduce(\n    (right, sibling) => Math.max(right, sibling.getBoundingClientRect().right),\n    contentLeft\n  );\n  const gap = precedingSiblings.length > 0 ? numericStyle(parentStyle, 'columnGap') : 0;\n\n  const measuredAvailableWidth = Math.max(0, contentRight - occupiedRight - gap);\n  const parentWidthIncrease =\n    previousLayout?.parent === parent ? Math.max(0, parentWidth - previousLayout.parentWidth) : 0;\n\n  return {\n    availableWidth:\n      parentWidthIncrease > 0\n        ? Math.max(\n            measuredAvailableWidth,\n            (previousLayout?.availableWidth ?? 0) + parentWidthIncrease\n          )\n        : measuredAvailableWidth,\n    parent,\n    parentWidth,\n  };\n};\n\nexport const Controls = ({\n  children,\n  className,\n  maxVisibleButtons,\n  overflow,\n  overflowAccessibleLabel = 'More actions',\n  variant = 'default',\n  ...props\n}: ControlsProps) => {\n  const childArray = Children.toArray(children);\n  const buttons: React.ReactElement<ButtonProps>[] = [];\n  const nonButtons: React.ReactNode[] = [];\n\n  childArray.forEach((child) => {\n    if (isValidElement<ButtonProps>(child) && child.type === Button) {\n      buttons.push(child);\n    } else {\n      nonButtons.push(child);\n    }\n  });\n\n  const sortedButtons = buttons\n    .map((button, index) => ({ button, index, rank: getButtonRank(button) }))\n    .sort((a, b) => a.rank - b.rank || a.index - b.index)\n    .map(({ button, index }) =>\n      cloneElement(button, {\n        key: button.key ?? index,\n      })\n    );\n\n  const adaptive = variant === 'embedded' || (variant === 'fixed' && overflow === 'menu');\n  const normalizedMaxVisibleButtons =\n    typeof maxVisibleButtons === 'number' && Number.isFinite(maxVisibleButtons)\n      ? Math.floor(maxVisibleButtons)\n      : 0;\n  const visibleButtonLimit =\n    variant === 'embedded' && normalizedMaxVisibleButtons > 0\n      ? Math.min(sortedButtons.length, normalizedMaxVisibleButtons)\n      : sortedButtons.length;\n  const controlsRef = useRef<HTMLDivElement>(null);\n  const embeddedLayoutRef = useRef<EmbeddedLayout>(undefined);\n  const measurementRef = useRef<HTMLDivElement>(null);\n  const nonButtonsRef = useRef<HTMLSpanElement>(null);\n  const [visibleButtonCount, setVisibleButtonCount] = useState(visibleButtonLimit);\n  const buttonKeys = sortedButtons.map((button) => String(button.key)).join('\\n');\n  const [measuredButtonKeys, setMeasuredButtonKeys] = useState(buttonKeys);\n\n  if (measuredButtonKeys !== buttonKeys) {\n    setMeasuredButtonKeys(buttonKeys);\n    setVisibleButtonCount(visibleButtonLimit);\n  }\n\n  const updateOverflow = useCallback(() => {\n    if (!adaptive) {\n      setVisibleButtonCount(visibleButtonLimit);\n      return;\n    }\n\n    const controls = controlsRef.current;\n    const measurement = measurementRef.current;\n    if (!controls || !measurement) return;\n\n    const measurementButtons = Array.from(\n      measurement.querySelectorAll<HTMLElement>('[data-component=\"button\"]')\n    );\n    const trigger = measurementButtons.at(-1);\n    if (!trigger) return;\n\n    const buttonWidths = measurementButtons\n      .slice(0, sortedButtons.length)\n      .map((button) => button.getBoundingClientRect().width);\n    if (buttonWidths.length !== sortedButtons.length) return;\n\n    const style = getComputedStyle(controls);\n    const horizontalChrome =\n      numericStyle(style, 'paddingLeft') +\n      numericStyle(style, 'paddingRight') +\n      numericStyle(style, 'borderLeftWidth') +\n      numericStyle(style, 'borderRightWidth');\n    const configuredMaxWidth = pixelStyle(style.maxWidth);\n    const embeddedLayout =\n      variant === 'embedded'\n        ? availableWidthToRight(controls, embeddedLayoutRef.current)\n        : undefined;\n    if (embeddedLayout) embeddedLayoutRef.current = embeddedLayout;\n    const layoutWidth = embeddedLayout?.availableWidth ?? controls.parentElement?.clientWidth ?? 0;\n    const viewportWidth = window.visualViewport?.width ?? document.documentElement.clientWidth;\n    const outerAvailableWidth = Math.min(\n      ...[configuredMaxWidth, layoutWidth, viewportWidth].filter(\n        (width): width is number => typeof width === 'number' && Number.isFinite(width) && width > 0\n      )\n    );\n    if (!Number.isFinite(outerAvailableWidth)) return;\n\n    const availableWidth = Math.max(0, outerAvailableWidth - horizontalChrome);\n    const prefixWidth = nonButtonsRef.current?.getBoundingClientRect().width ?? 0;\n    const actionWidth = buttonWidths.reduce((total, width) => total + width, 0);\n\n    if (\n      visibleButtonLimit === sortedButtons.length &&\n      prefixWidth + actionWidth <= availableWidth\n    ) {\n      setVisibleButtonCount((current) =>\n        current === visibleButtonLimit ? current : visibleButtonLimit\n      );\n      return;\n    }\n\n    let usedWidth = prefixWidth + trigger.getBoundingClientRect().width;\n    let nextVisibleButtonCount = 0;\n    for (let index = 0; index < visibleButtonLimit; index += 1) {\n      if (usedWidth + buttonWidths[index] > availableWidth) break;\n      usedWidth += buttonWidths[index];\n      nextVisibleButtonCount = index + 1;\n    }\n\n    setVisibleButtonCount((current) =>\n      current === nextVisibleButtonCount ? current : nextVisibleButtonCount\n    );\n  }, [adaptive, sortedButtons.length, variant, visibleButtonLimit]);\n\n  useLayoutEffect(() => {\n    updateOverflow();\n\n    if (!adaptive) return undefined;\n\n    const observer =\n      typeof ResizeObserver === 'undefined' ? undefined : new ResizeObserver(updateOverflow);\n    if (controlsRef.current) observer?.observe(controlsRef.current);\n    if (controlsRef.current?.parentElement) observer?.observe(controlsRef.current.parentElement);\n    if (variant === 'embedded' && controlsRef.current?.parentElement) {\n      Array.from(controlsRef.current.parentElement.children).forEach((sibling) => {\n        if (sibling !== controlsRef.current) observer?.observe(sibling);\n      });\n    }\n    if (nonButtonsRef.current) observer?.observe(nonButtonsRef.current);\n\n    window.addEventListener('resize', updateOverflow);\n    window.visualViewport?.addEventListener('resize', updateOverflow);\n    void document.fonts?.ready.then(updateOverflow);\n\n    return () => {\n      observer?.disconnect();\n      window.removeEventListener('resize', updateOverflow);\n      window.visualViewport?.removeEventListener('resize', updateOverflow);\n    };\n  }, [adaptive, children, updateOverflow, variant]);\n\n  if (childArray.length === 0) {\n    return null;\n  }\n\n  const visibleButtons = adaptive ? sortedButtons.slice(0, visibleButtonCount) : sortedButtons;\n  const overflowedButtons = adaptive ? sortedButtons.slice(visibleButtonCount) : [];\n\n  return (\n    <div\n      data-component='controls'\n      data-dynamic-position={variant === 'fixed' ? true : undefined}\n      data-adaptive={adaptive ? true : undefined}\n      className={cx(styles.controls, variants[variant], adaptive && styles.adaptive, className)}\n      ref={controlsRef}\n      {...props}\n    >\n      {adaptive && (\n        <div\n          aria-hidden='true'\n          className={styles.measurement}\n          ref={measurementRef}\n        >\n          {sortedButtons.map((button, index) =>\n            cloneElement(button, {\n              'aria-hidden': true,\n              id: undefined,\n              key: `measure-${String(button.key ?? index)}`,\n              onClick: undefined,\n              ref: undefined,\n              tabIndex: -1,\n            })\n          )}\n          <MenuPopover triggerAccessibleLabel={overflowAccessibleLabel}>{null}</MenuPopover>\n        </div>\n      )}\n      {variant !== 'embedded' && nonButtons.length > 0 && (\n        <span\n          className={styles['non-button-content']}\n          ref={nonButtonsRef}\n        >\n          {nonButtons}\n        </span>\n      )}\n      {visibleButtons}\n      {overflowedButtons.length > 0 && (\n        <span className={styles['overflow-trigger']}>\n          <OverflowMenu\n            buttons={overflowedButtons}\n            menuAccessibleLabel={overflowAccessibleLabel}\n            triggerAccessibleLabel={overflowAccessibleLabel}\n          />\n        </span>\n      )}\n    </div>\n  );\n};\n"],"names":["buttonVariantOrder","primary","secondary","tertiary","simple","variants","default","styles","embedded","fixed","inline","getButtonRank","button","props","variant","OverflowMenu","buttons","menuAccessibleLabel","triggerAccessibleLabel","actions","map","isDanger","intent","value","jsx","MenuPopover","close","initialFocus","MenuActionList","numericStyle","style","property","Number","parseFloat","String","isFinite","pixelStyle","trim","endsWith","parsedValue","undefined","availableWidthToRight","controls","previousLayout","parent","parentElement","parentRect","getBoundingClientRect","parentStyle","getComputedStyle","parentWidth","width","clientWidth","contentLeft","left","contentRight","precedingSiblings","Array","from","children","slice","indexOf","occupiedRight","reduce","right","sibling","Math","max","gap","length","measuredAvailableWidth","parentWidthIncrease","availableWidth","Controls","className","maxVisibleButtons","overflow","overflowAccessibleLabel","childArray","Children","toArray","nonButtons","forEach","child","isValidElement","type","Button","push","sortedButtons","index","rank","sort","a","b","cloneElement","key","adaptive","normalizedMaxVisibleButtons","floor","visibleButtonLimit","min","controlsRef","useRef","embeddedLayoutRef","measurementRef","nonButtonsRef","visibleButtonCount","setVisibleButtonCount","useState","buttonKeys","join","measuredButtonKeys","setMeasuredButtonKeys","updateOverflow","useCallback","current","measurement","measurementButtons","querySelectorAll","trigger","at","buttonWidths","horizontalChrome","configuredMaxWidth","maxWidth","embeddedLayout","layoutWidth","viewportWidth","window","visualViewport","document","documentElement","outerAvailableWidth","filter","prefixWidth","actionWidth","total","usedWidth","nextVisibleButtonCount","useLayoutEffect","observer","ResizeObserver","observe","addEventListener","fonts","ready","then","disconnect","removeEventListener","visibleButtons","overflowedButtons","jsxs","cx","id","onClick","ref","tabIndex"],"mappings":";;;;;;;;;;;;;;;GAgBMA,KAAqB;AAAA,EACzBC,SAAS;AAAA,EACTC,WAAW;AAAA,EACXC,UAAU;AAAA,EACVC,QAAQ;AACV,GAEMC,KAAW;AAAA,EACfC,SAASC,EAAOD;AAAAA,EAChBE,UAAUD,EAAOC;AAAAA,EACjBC,OAAOF,EAAOE;AAAAA,EACdC,QAAQH,EAAOG;AACjB,GAUMC,KAAgBA,CAACC,MACrBZ,GAAmBY,EAAOC,MAAMC,WAAW,WAAW;AAExD,SAASC,GAAa;AAAA,EACpBC,SAAAA;AAAAA,EACAC,qBAAAA;AAAAA,EACAC,wBAAAA;AAKF,GAAG;AACD,QAAMC,IAAyDH,EAAQI,IAAKR,CAAAA,OAAY;AAAA,IACtFA,QAAAA;AAAAA,IACAS,UAAUT,EAAOC,MAAMS,WAAW;AAAA,IAClCC,OAAOX;AAAAA,EAAAA,EACP;AAEF,SACE,gBAAAY,EAACC,GAAA,EAAY,wBAAAP,GAA+C,kBAAA,gBACzD,UAAA,CAAC;AAAA,IAAEQ,OAAAA;AAAAA,IAAOC,cAAAA;AAAAA,EAAAA,MACT,gBAAAH,EAACI,IAAA,EACC,SAAAT,GACA,cAAAQ,GACA,qBAAAV,GACA,UAAU,MAAMS,EAAAA,GAChB,mBAAiB,GAAA,CAAA,EAAA,CAGvB;AAEJ;AAEA,MAAMG,IAAeA,CAACC,GAA4BC,MAAwC;AACxF,QAAMR,IAAQS,OAAOC,WAAWC,OAAOJ,EAAMC,CAAQ,CAAC,CAAC;AACvD,SAAOC,OAAOG,SAASZ,CAAK,IAAIA,IAAQ;AAC1C,GAEMa,KAAaA,CAACb,MAAkB;AACpC,MAAI,CAACA,EAAMc,KAAAA,EAAOC,SAAS,IAAI,EAAG;AAClC,QAAMC,IAAcP,OAAOC,WAAWV,CAAK;AAC3C,SAAOS,OAAOG,SAASI,CAAW,IAAIA,IAAcC;AACtD,GAQMC,KAAwBA,CAC5BC,GACAC,MAC+B;AAC/B,QAAMC,IAASF,EAASG;AACxB,MAAI,CAACD,EAAQ;AAEb,QAAME,IAAaF,EAAOG,sBAAAA,GACpBC,IAAcC,iBAAiBL,CAAM,GACrCM,IAAcJ,EAAWK,SAASP,EAAOQ,aACzCC,IACJP,EAAWQ,OACXzB,EAAamB,GAAa,iBAAiB,IAC3CnB,EAAamB,GAAa,aAAa,GACnCO,IACJT,EAAWQ,OACXJ,IACArB,EAAamB,GAAa,kBAAkB,IAC5CnB,EAAamB,GAAa,cAAc,GACpCQ,IAAoBC,MAAMC,KAAKd,EAAOe,QAAQ,EAAEC,MACpD,GACAH,MAAMC,KAAKd,EAAOe,QAAQ,EAAEE,QAAQnB,CAAQ,CAC9C,GACMoB,IAAgBN,EAAkBO,OACtC,CAACC,GAAOC,MAAYC,KAAKC,IAAIH,GAAOC,EAAQlB,sBAAAA,EAAwBiB,KAAK,GACzEX,CACF,GACMe,IAAMZ,EAAkBa,SAAS,IAAIxC,EAAamB,GAAa,WAAW,IAAI,GAE9EsB,IAAyBJ,KAAKC,IAAI,GAAGZ,IAAeO,IAAgBM,CAAG,GACvEG,KACJ5B,KAAAA,gBAAAA,EAAgBC,YAAWA,IAASsB,KAAKC,IAAI,GAAGjB,IAAcP,EAAeO,WAAW,IAAI;AAE9F,SAAO;AAAA,IACLsB,gBACED,IAAsB,IAClBL,KAAKC,IACHG,KACC3B,KAAAA,gBAAAA,EAAgB6B,mBAAkB,KAAKD,CAC1C,IACAD;AAAAA,IACN1B,QAAAA;AAAAA,IACAM,aAAAA;AAAAA,EAAAA;AAEJ,GAEauB,KAAWA,CAAC;AAAA,EACvBd,UAAAA;AAAAA,EACAe,WAAAA;AAAAA,EACAC,mBAAAA;AAAAA,EACAC,UAAAA;AAAAA,EACAC,yBAAAA,IAA0B;AAAA,EAC1B/D,SAAAA,IAAU;AAAA,EACV,GAAGD;AACU,MAAM;AACnB,QAAMiE,IAAaC,GAASC,QAAQrB,CAAQ,GACtC3C,IAA6C,CAAA,GAC7CiE,IAAgC,CAAA;AAEtCH,EAAAA,EAAWI,QAASC,CAAAA,MAAU;AAC5B,IAAIC,GAA4BD,CAAK,KAAKA,EAAME,SAASC,KACvDtE,EAAQuE,KAAKJ,CAAK,IAElBF,EAAWM,KAAKJ,CAAK;AAAA,EAEzB,CAAC;AAED,QAAMK,IAAgBxE,EACnBI,IAAI,CAACR,GAAQ6E,OAAW;AAAA,IAAE7E,QAAAA;AAAAA,IAAQ6E,OAAAA;AAAAA,IAAOC,MAAM/E,GAAcC,CAAM;AAAA,EAAA,EAAI,EACvE+E,KAAK,CAACC,GAAGC,MAAMD,EAAEF,OAAOG,EAAEH,QAAQE,EAAEH,QAAQI,EAAEJ,KAAK,EACnDrE,IAAI,CAAC;AAAA,IAAER,QAAAA;AAAAA,IAAQ6E,OAAAA;AAAAA,EAAAA,MACdK,EAAalF,GAAQ;AAAA,IACnBmF,KAAKnF,EAAOmF,OAAON;AAAAA,EAAAA,CACpB,CACH,GAEIO,IAAWlF,MAAY,cAAeA,MAAY,WAAW8D,MAAa,QAC1EqB,IACJ,OAAOtB,KAAsB,YAAY3C,OAAOG,SAASwC,CAAiB,IACtET,KAAKgC,MAAMvB,CAAiB,IAC5B,GACAwB,IACJrF,MAAY,cAAcmF,IAA8B,IACpD/B,KAAKkC,IAAIZ,EAAcnB,QAAQ4B,CAA2B,IAC1DT,EAAcnB,QACdgC,IAAcC,EAAuB,IAAI,GACzCC,IAAoBD,EAAuB9D,MAAS,GACpDgE,IAAiBF,EAAuB,IAAI,GAC5CG,IAAgBH,EAAwB,IAAI,GAC5C,CAACI,GAAoBC,CAAqB,IAAIC,EAAST,CAAkB,GACzEU,IAAarB,EAAcpE,IAAKR,CAAAA,MAAWsB,OAAOtB,EAAOmF,GAAG,CAAC,EAAEe,KAAK;AAAA,CAAI,GACxE,CAACC,GAAoBC,CAAqB,IAAIJ,EAASC,CAAU;AAEvE,EAAIE,MAAuBF,MACzBG,EAAsBH,CAAU,GAChCF,EAAsBR,CAAkB;AAG1C,QAAMc,IAAiBC,GAAY,MAAM;;AACvC,QAAI,CAAClB,GAAU;AACbW,MAAAA,EAAsBR,CAAkB;AACxC;AAAA,IACF;AAEA,UAAMzD,IAAW2D,EAAYc,SACvBC,IAAcZ,EAAeW;AACnC,QAAI,CAACzE,KAAY,CAAC0E,EAAa;AAE/B,UAAMC,IAAqB5D,MAAMC,KAC/B0D,EAAYE,iBAA8B,2BAA2B,CACvE,GACMC,IAAUF,EAAmBG,GAAG,EAAE;AACxC,QAAI,CAACD,EAAS;AAEd,UAAME,IAAeJ,EAClBzD,MAAM,GAAG4B,EAAcnB,MAAM,EAC7BjD,IAAKR,CAAAA,MAAWA,EAAOmC,sBAAAA,EAAwBI,KAAK;AACvD,QAAIsE,EAAapD,WAAWmB,EAAcnB,OAAQ;AAElD,UAAMvC,IAAQmB,iBAAiBP,CAAQ,GACjCgF,IACJ7F,EAAaC,GAAO,aAAa,IACjCD,EAAaC,GAAO,cAAc,IAClCD,EAAaC,GAAO,iBAAiB,IACrCD,EAAaC,GAAO,kBAAkB,GAClC6F,IAAqBvF,GAAWN,EAAM8F,QAAQ,GAC9CC,IACJ/G,MAAY,aACR2B,GAAsBC,GAAU6D,EAAkBY,OAAO,IACzD3E;AACN,IAAIqF,QAAkCV,UAAUU;AAChD,UAAMC,KAAcD,KAAAA,gBAAAA,EAAgBrD,qBAAkB9B,IAAAA,EAASG,kBAATH,gBAAAA,EAAwBU,gBAAe,GACvF2E,MAAgBC,IAAAA,OAAOC,mBAAPD,gBAAAA,EAAuB7E,UAAS+E,SAASC,gBAAgB/E,aACzEgF,IAAsBlE,KAAKkC,IAC/B,GAAG,CAACuB,GAAoBG,GAAaC,CAAa,EAAEM,OAClD,CAAClF,MAA2B,OAAOA,KAAU,YAAYnB,OAAOG,SAASgB,CAAK,KAAKA,IAAQ,CAC7F,CACF;AACA,QAAI,CAACnB,OAAOG,SAASiG,CAAmB,EAAG;AAE3C,UAAM5D,IAAiBN,KAAKC,IAAI,GAAGiE,IAAsBV,CAAgB,GACnEY,MAAc7B,IAAAA,EAAcU,YAAdV,gBAAAA,EAAuB1D,wBAAwBI,UAAS,GACtEoF,KAAcd,EAAa1D,OAAO,CAACyE,GAAOrF,OAAUqF,IAAQrF,IAAO,CAAC;AAE1E,QACEgD,MAAuBX,EAAcnB,UACrCiE,IAAcC,MAAe/D,GAC7B;AACAmC,MAAAA,EAAuBQ,CAAAA,MACrBA,MAAYhB,IAAqBgB,IAAUhB,CAC7C;AACA;AAAA,IACF;AAEA,QAAIsC,IAAYH,IAAcf,EAAQxE,sBAAAA,EAAwBI,OAC1DuF,IAAyB;AAC7B,aAASjD,IAAQ,GAAGA,IAAQU,KACtBsC,EAAAA,IAAYhB,EAAahC,CAAK,IAAIjB,IADQiB,KAAS;AAEvDgD,MAAAA,KAAahB,EAAahC,CAAK,GAC/BiD,IAAyBjD,IAAQ;AAGnCkB,IAAAA,EAAuBQ,CAAAA,MACrBA,MAAYuB,IAAyBvB,IAAUuB,CACjD;AAAA,EACF,GAAG,CAAC1C,GAAUR,EAAcnB,QAAQvD,GAASqF,CAAkB,CAAC;AA6BhE,MA3BAwC,GAAgB,MAAM;;AAGpB,QAFA1B,EAAAA,GAEI,CAACjB,EAAU;AAEf,UAAM4C,IACJ,OAAOC,iBAAmB,MAAcrG,SAAY,IAAIqG,eAAe5B,CAAc;AACvF,WAAIZ,EAAYc,YAASyB,KAAAA,QAAAA,EAAUE,QAAQzC,EAAYc,YACnDd,IAAAA,EAAYc,YAAZd,QAAAA,EAAqBxD,iCAAyBiG,QAAQzC,EAAYc,QAAQtE,iBAC1E/B,MAAY,gBAAcuF,IAAAA,EAAYc,YAAZd,QAAAA,EAAqBxD,kBACjDY,MAAMC,KAAK2C,EAAYc,QAAQtE,cAAcc,QAAQ,EAAEuB,QAASjB,CAAAA,MAAY;AAC1E,MAAIA,MAAYoC,EAAYc,YAASyB,KAAAA,QAAAA,EAAUE,QAAQ7E;AAAAA,IACzD,CAAC,GAECwC,EAAcU,YAASyB,KAAAA,QAAAA,EAAUE,QAAQrC,EAAcU,WAE3Da,OAAOe,iBAAiB,UAAU9B,CAAc,IAChDe,IAAAA,OAAOC,mBAAPD,QAAAA,EAAuBe,iBAAiB,UAAU9B,KAC7CiB,IAAAA,SAASc,UAATd,QAAAA,EAAgBe,MAAMC,KAAKjC,IAEzB,MAAM;;AACX2B,MAAAA,KAAAA,QAAAA,EAAUO,cACVnB,OAAOoB,oBAAoB,UAAUnC,CAAc,IACnDe,IAAAA,OAAOC,mBAAPD,QAAAA,EAAuBoB,oBAAoB,UAAUnC;AAAAA,IACvD;AAAA,EACF,GAAG,CAACjB,GAAUrC,GAAUsD,GAAgBnG,CAAO,CAAC,GAE5CgE,EAAWT,WAAW;AACxB,WAAO;AAGT,QAAMgF,IAAiBrD,IAAWR,EAAc5B,MAAM,GAAG8C,CAAkB,IAAIlB,GACzE8D,IAAoBtD,IAAWR,EAAc5B,MAAM8C,CAAkB,IAAI,CAAA;AAE/E,SACE,gBAAA6C,EAAC,OAAA,EACC,kBAAe,YACf,yBAAuBzI,MAAY,UAAU,KAAO0B,QACpD,iBAAewD,IAAW,KAAOxD,QACjC,WAAWgH,GAAGjJ,EAAOmC,UAAUrC,GAASS,CAAO,GAAGkF,KAAYzF,EAAOyF,UAAUtB,CAAS,GACxF,KAAK2B,GACL,GAAIxF,GAEHmF,UAAAA;AAAAA,IAAAA,KACC,gBAAAuD,EAAC,SACC,eAAY,QACZ,WAAWhJ,EAAO6G,aAClB,KAAKZ,GAEJhB,UAAAA;AAAAA,MAAAA,EAAcpE,IAAI,CAACR,GAAQ6E,MAC1BK,EAAalF,GAAQ;AAAA,QACnB,eAAe;AAAA,QACf6I,IAAIjH;AAAAA,QACJuD,KAAK,WAAW7D,OAAOtB,EAAOmF,OAAON,CAAK,CAAC;AAAA,QAC3CiE,SAASlH;AAAAA,QACTmH,KAAKnH;AAAAA,QACLoH,UAAU;AAAA,MAAA,CACX,CACH;AAAA,MACA,gBAAApI,EAACC,GAAA,EAAY,wBAAwBoD,GAA0B,UAAA,KAAA,CAAK;AAAA,IAAA,GACtE;AAAA,IAED/D,MAAY,cAAcmE,EAAWZ,SAAS,KAC7C,gBAAA7C,EAAC,QAAA,EACC,WAAWjB,EAAO,oBAAoB,GACtC,KAAKkG,GAEJxB,UAAAA,GACH;AAAA,IAEDoE;AAAAA,IACAC,EAAkBjF,SAAS,KAC1B,gBAAA7C,EAAC,QAAA,EAAK,WAAWjB,EAAO,kBAAkB,GACxC,UAAA,gBAAAiB,EAACT,MACC,SAASuI,GACT,qBAAqBzE,GACrB,wBAAwBA,GAAwB,EAAA,CAEpD;AAAA,EAAA,GAEJ;AAEJ;"}

package/dist/components/message/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),x=require("../../classix-5H4IWnMA.cjs"),j=require("../avatar/index.cjs"),h=require("../icon/index.cjs"),k="_attachments_1tffk_1",w="_message_1tffk_11",S="_timestamp_1tffk_144",b="_preview_1tffk_149",t={attachments:k,"message-group":"_message-group_1tffk_11",message:w,timestamp:S,preview:b},q=({appearance:o="default",attachments:m,author:a,authorColor:r,authorImageUrl:l,authorLink:d,authorRole:g,content:_,iconName:p="Info",id:f,preview:u,timestamp:i,timestampText:v,type:s="default"})=>{const n=i?new Date(i):void 0,c=n?e.jsx("time",{className:t.timestamp,dateTime:n.toISOString(),children:v??n.toLocaleString()}):null;return e.jsxs("div",{className:t["message-group"],"data-message-type":s,"data-component":"message",children:[a&&e.jsx(j.Avatar,{accessibleLabel:a,color:r,imageUrl:l,link:d,name:a,role:g}),s==="system"&&c,e.jsxs("div",{className:x.t(t.message,u&&t.preview),"data-appearance":o,"data-id":f,"data-type":s,children:[s=="system"&&e.jsx(h.Icon,{gap:"right",name:p}),_]}),m&&e.jsx("div",{className:t.attachments,children:m}),s!=="system"&&c]})};exports.Message=q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index16.css');const e=require("react/jsx-runtime"),f=require("../../classix-5H4IWnMA.cjs"),h=require("../avatar/index.cjs"),k=require("../icon/index.cjs"),N="_attachments_77ukg_1",w="_footer_77ukg_27",S="_message_77ukg_11",b="_timestamp_77ukg_152",q="_actions_77ukg_157",y="_preview_77ukg_169",s={attachments:N,"message-group":"_message-group_77ukg_11",footer:w,message:S,timestamp:b,actions:q,preview:y},I=({actions:c,appearance:r="default",attachments:i,author:a,authorColor:g,authorImageUrl:l,authorLink:d,authorRole:_,content:u,iconName:p="Info",id:v,preview:x,timestamp:m,timestampText:j,type:t="default"})=>{const n=m?new Date(m):void 0,o=n?e.jsx("time",{className:s.timestamp,dateTime:n.toISOString(),children:j??n.toLocaleString()}):null;return e.jsxs("div",{className:s["message-group"],"data-message-type":t,"data-component":"message",children:[a&&e.jsx(h.Avatar,{accessibleLabel:a,color:g,imageUrl:l,link:d,name:a,role:_}),t==="system"&&o,e.jsxs("div",{className:f.t(s.message,x&&s.preview),"data-appearance":r,"data-id":v,"data-type":t,children:[t=="system"&&e.jsx(k.Icon,{gap:"right",name:p}),u]}),i&&e.jsx("div",{className:s.attachments,children:i}),t!=="system"&&(c?e.jsxs("div",{className:s.footer,children:[o,e.jsx("div",{className:s.actions,"data-message-actions":!0,children:c})]}):o)]})};exports.Message=I;
 //# sourceMappingURL=index.cjs.map

package/dist/components/message/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' && timestampElement}\n    </div>\n  );\n};\n"],"names":["Message","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon"],"mappings":"wZAyBaA,EAAUA,CAAC,CACtBC,WAAAA,EAAa,UACbC,YAAAA,EACAC,OAAAA,EACAC,YAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,SAAAA,EAAW,OACXC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,cAAAA,EACAC,KAAAA,EAAO,SACO,IAAM,CACpB,MAAMC,EAAOH,EAAY,IAAII,KAAKJ,CAAS,EAAIK,OACzCC,EAAmBH,EACvBI,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAOR,UAClB,SAAUG,EAAKM,cAEdR,SAAAA,GAAiBE,EAAKO,eAAAA,EACzB,EACE,KAEJ,OACEC,OAAC,OACC,UAAWH,EAAO,eAAe,EACjC,oBAAmBN,EAAK,iBAAA,UAEvBX,SAAAA,CAAAA,GACCgB,EAAAA,IAACK,EAAAA,OAAA,CACC,gBAAiBrB,EACjB,MAAOC,EACP,SAAUC,EACV,KAAMC,EACN,KAAMH,EACN,KAAMI,EAAW,EAGpBO,IAAS,UAAYI,EACtBK,EAAAA,KAAC,MAAA,CACC,UAAWE,EAAAA,EAAGL,EAAOM,QAASf,GAAWS,EAAOT,OAAO,EACvD,kBAAiBV,EACjB,UAASS,EACT,YAAWI,EAEVA,SAAAA,CAAAA,GAAQ,UACPK,EAAAA,IAACQ,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMlB,EAAS,EAGlBD,CAAAA,EACH,EACCN,GAAeiB,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAOlB,YAAcA,SAAAA,EAAY,EAChEY,IAAS,UAAYI,CAAAA,EACxB,CAEJ"}
+{"version":3,"file":"index.cjs","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  /** Controls shown under the message, e.g. a delete button for the author's own message. */\n  actions?: React.ReactNode;\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  actions,\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' &&\n        (actions ? (\n          <div className={styles.footer}>\n            {timestampElement}\n            <div\n              className={styles.actions}\n              data-message-actions\n            >\n              {actions}\n            </div>\n          </div>\n        ) : (\n          timestampElement\n        ))}\n    </div>\n  );\n};\n"],"names":["Message","actions","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon","footer"],"mappings":"udA2BaA,EAAUA,CAAC,CACtBC,QAAAA,EACAC,WAAAA,EAAa,UACbC,YAAAA,EACAC,OAAAA,EACAC,YAAAA,EACAC,eAAAA,EACAC,WAAAA,EACAC,WAAAA,EACAC,QAAAA,EACAC,SAAAA,EAAW,OACXC,GAAAA,EACAC,QAAAA,EACAC,UAAAA,EACAC,cAAAA,EACAC,KAAAA,EAAO,SACO,IAAM,CACpB,MAAMC,EAAOH,EAAY,IAAII,KAAKJ,CAAS,EAAIK,OACzCC,EAAmBH,EACvBI,EAAAA,IAAC,OAAA,CACC,UAAWC,EAAOR,UAClB,SAAUG,EAAKM,cAEdR,SAAAA,GAAiBE,EAAKO,eAAAA,EACzB,EACE,KAEJ,OACEC,OAAC,OACC,UAAWH,EAAO,eAAe,EACjC,oBAAmBN,EAAK,iBAAA,UAEvBX,SAAAA,CAAAA,GACCgB,EAAAA,IAACK,EAAAA,OAAA,CACC,gBAAiBrB,EACjB,MAAOC,EACP,SAAUC,EACV,KAAMC,EACN,KAAMH,EACN,KAAMI,EAAW,EAGpBO,IAAS,UAAYI,EACtBK,EAAAA,KAAC,MAAA,CACC,UAAWE,EAAAA,EAAGL,EAAOM,QAASf,GAAWS,EAAOT,OAAO,EACvD,kBAAiBV,EACjB,UAASS,EACT,YAAWI,EAEVA,SAAAA,CAAAA,GAAQ,UACPK,EAAAA,IAACQ,EAAAA,KAAA,CACC,IAAI,QACJ,KAAMlB,EAAS,EAGlBD,CAAAA,EACH,EACCN,GAAeiB,EAAAA,IAAC,MAAA,CAAI,UAAWC,EAAOlB,YAAcA,SAAAA,EAAY,EAChEY,IAAS,WACPd,SACE,MAAA,CAAI,UAAWoB,EAAOQ,OACpBV,SAAAA,CAAAA,QACA,MAAA,CACC,UAAWE,EAAOpB,QAClB,uBAAoB,GAEnBA,SAAAA,CAAAA,CACH,CAAA,CAAA,CACF,EAEAkB,EAAAA,EAEN,CAEJ"}

package/dist/components/message/index.js

@@ -1,42 +1,48 @@
-import { jsx as t, jsxs as r } from "react/jsx-runtime";
-import { t as u } from "../../classix-DG18itHa.js";
+import { jsx as a, jsxs as i } from "react/jsx-runtime";
+import { t as N } from "../../classix-DG18itHa.js";
 import { Avatar as w } from "../avatar/index.js";
-import { Icon as N } from "../icon/index.js";
-import '../../assets/index16.css';const x = "_attachments_1tffk_1", I = "_message_1tffk_11", S = "_timestamp_1tffk_144", b = "_preview_1tffk_149", s = {
-  attachments: x,
-  "message-group": "_message-group_1tffk_11",
-  message: I,
-  timestamp: S,
-  preview: b
-}, D = ({
-  appearance: c = "default",
-  attachments: i,
-  author: a,
+import { Icon as x } from "../icon/index.js";
+import '../../assets/index16.css';const I = "_attachments_77ukg_1", S = "_footer_77ukg_27", b = "_message_77ukg_11", j = "_timestamp_77ukg_152", y = "_actions_77ukg_157", L = "_preview_77ukg_169", e = {
+  attachments: I,
+  "message-group": "_message-group_77ukg_11",
+  footer: S,
+  message: b,
+  timestamp: j,
+  actions: y,
+  preview: L
+}, O = ({
+  actions: n,
+  appearance: g = "default",
+  attachments: c,
+  author: t,
   authorColor: l,
   authorImageUrl: d,
-  authorLink: g,
+  authorLink: _,
   authorRole: p,
-  content: f,
-  iconName: _ = "Info",
+  content: u,
+  iconName: f = "Info",
   id: v,
   preview: h,
-  timestamp: n,
+  timestamp: r,
   timestampText: k,
-  type: e = "default"
+  type: s = "default"
 }) => {
-  const m = n ? new Date(n) : void 0, o = m ? /* @__PURE__ */ t("time", { className: s.timestamp, dateTime: m.toISOString(), children: k ?? m.toLocaleString() }) : null;
-  return /* @__PURE__ */ r("div", { className: s["message-group"], "data-message-type": e, "data-component": "message", children: [
-    a && /* @__PURE__ */ t(w, { accessibleLabel: a, color: l, imageUrl: d, link: g, name: a, role: p }),
-    e === "system" && o,
-    /* @__PURE__ */ r("div", { className: u(s.message, h && s.preview), "data-appearance": c, "data-id": v, "data-type": e, children: [
-      e == "system" && /* @__PURE__ */ t(N, { gap: "right", name: _ }),
-      f
+  const m = r ? new Date(r) : void 0, o = m ? /* @__PURE__ */ a("time", { className: e.timestamp, dateTime: m.toISOString(), children: k ?? m.toLocaleString() }) : null;
+  return /* @__PURE__ */ i("div", { className: e["message-group"], "data-message-type": s, "data-component": "message", children: [
+    t && /* @__PURE__ */ a(w, { accessibleLabel: t, color: l, imageUrl: d, link: _, name: t, role: p }),
+    s === "system" && o,
+    /* @__PURE__ */ i("div", { className: N(e.message, h && e.preview), "data-appearance": g, "data-id": v, "data-type": s, children: [
+      s == "system" && /* @__PURE__ */ a(x, { gap: "right", name: f }),
+      u
     ] }),
-    i && /* @__PURE__ */ t("div", { className: s.attachments, children: i }),
-    e !== "system" && o
+    c && /* @__PURE__ */ a("div", { className: e.attachments, children: c }),
+    s !== "system" && (n ? /* @__PURE__ */ i("div", { className: e.footer, children: [
+      o,
+      /* @__PURE__ */ a("div", { className: e.actions, "data-message-actions": !0, children: n })
+    ] }) : o)
   ] });
 };
 export {
-  D as Message
+  O as Message
 };
 //# sourceMappingURL=index.js.map

package/dist/components/message/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' && timestampElement}\n    </div>\n  );\n};\n"],"names":["Message","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon"],"mappings":";;;;;;;;;;GAyBaA,IAAUA,CAAC;AAAA,EACtBC,YAAAA,IAAa;AAAA,EACbC,aAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,IAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,MAAAA,IAAO;AACO,MAAM;AACpB,QAAMC,IAAOH,IAAY,IAAII,KAAKJ,CAAS,IAAIK,QACzCC,IAAmBH,IACvB,gBAAAI,EAAC,QAAA,EACC,WAAWC,EAAOR,WAClB,UAAUG,EAAKM,eAEdR,UAAAA,KAAiBE,EAAKO,eAAAA,GACzB,IACE;AAEJ,SACE,gBAAAC,EAAC,SACC,WAAWH,EAAO,eAAe,GACjC,qBAAmBN,GAAK,kBAAA,WAEvBX,UAAAA;AAAAA,IAAAA,KACC,gBAAAgB,EAACK,GAAA,EACC,iBAAiBrB,GACjB,OAAOC,GACP,UAAUC,GACV,MAAMC,GACN,MAAMH,GACN,MAAMI,GAAW;AAAA,IAGpBO,MAAS,YAAYI;AAAAA,IACtB,gBAAAK,EAAC,OAAA,EACC,WAAWE,EAAGL,EAAOM,SAASf,KAAWS,EAAOT,OAAO,GACvD,mBAAiBV,GACjB,WAASS,GACT,aAAWI,GAEVA,UAAAA;AAAAA,MAAAA,KAAQ,YACP,gBAAAK,EAACQ,GAAA,EACC,KAAI,SACJ,MAAMlB,GAAS;AAAA,MAGlBD;AAAAA,IAAAA,GACH;AAAA,IACCN,KAAe,gBAAAiB,EAAC,OAAA,EAAI,WAAWC,EAAOlB,aAAcA,UAAAA,GAAY;AAAA,IAChEY,MAAS,YAAYI;AAAAA,EAAAA,GACxB;AAEJ;"}
+{"version":3,"file":"index.js","sources":["../../../src/components/message/index.tsx"],"sourcesContent":["import cx from 'classix';\n\nimport type { IconName } from '@/components/icon';\n\nimport { Avatar, type AvatarColor } from '../avatar';\nimport { Icon } from '../icon';\nimport styles from './styles.module.css';\n\nexport type MessageOptions = {\n  /** Controls shown under the message, e.g. a delete button for the author's own message. */\n  actions?: React.ReactNode;\n  appearance?: 'default' | 'document' | 'file';\n  attachments?: React.ReactNode;\n  author?: string;\n  authorColor?: AvatarColor;\n  authorImageUrl?: string;\n  authorLink?: string;\n  authorRole?: string;\n  content: React.ReactNode;\n  iconName?: IconName;\n  id: string;\n  preview?: boolean;\n  timestamp?: Date | string;\n  timestampText?: React.ReactNode;\n  type?: 'default' | 'minimal' | 'system' | 'user';\n};\n\nexport const Message = ({\n  actions,\n  appearance = 'default',\n  attachments,\n  author,\n  authorColor,\n  authorImageUrl,\n  authorLink,\n  authorRole,\n  content,\n  iconName = 'Info',\n  id,\n  preview,\n  timestamp,\n  timestampText,\n  type = 'default',\n}: MessageOptions) => {\n  const date = timestamp ? new Date(timestamp) : undefined;\n  const timestampElement = date ? (\n    <time\n      className={styles.timestamp}\n      dateTime={date.toISOString()}\n    >\n      {timestampText ?? date.toLocaleString()}\n    </time>\n  ) : null;\n\n  return (\n    <div\n      className={styles['message-group']}\n      data-message-type={type}\n    >\n      {author && (\n        <Avatar\n          accessibleLabel={author}\n          color={authorColor}\n          imageUrl={authorImageUrl}\n          link={authorLink}\n          name={author}\n          role={authorRole}\n        />\n      )}\n      {type === 'system' && timestampElement}\n      <div\n        className={cx(styles.message, preview && styles.preview)}\n        data-appearance={appearance}\n        data-id={id}\n        data-type={type}\n      >\n        {type == 'system' && (\n          <Icon\n            gap='right'\n            name={iconName}\n          />\n        )}\n        {content}\n      </div>\n      {attachments && <div className={styles.attachments}>{attachments}</div>}\n      {type !== 'system' &&\n        (actions ? (\n          <div className={styles.footer}>\n            {timestampElement}\n            <div\n              className={styles.actions}\n              data-message-actions\n            >\n              {actions}\n            </div>\n          </div>\n        ) : (\n          timestampElement\n        ))}\n    </div>\n  );\n};\n"],"names":["Message","actions","appearance","attachments","author","authorColor","authorImageUrl","authorLink","authorRole","content","iconName","id","preview","timestamp","timestampText","type","date","Date","undefined","timestampElement","jsx","styles","toISOString","toLocaleString","jsxs","Avatar","cx","message","Icon","footer"],"mappings":";;;;;;;;;;;;GA2BaA,IAAUA,CAAC;AAAA,EACtBC,SAAAA;AAAAA,EACAC,YAAAA,IAAa;AAAA,EACbC,aAAAA;AAAAA,EACAC,QAAAA;AAAAA,EACAC,aAAAA;AAAAA,EACAC,gBAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,YAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,UAAAA,IAAW;AAAA,EACXC,IAAAA;AAAAA,EACAC,SAAAA;AAAAA,EACAC,WAAAA;AAAAA,EACAC,eAAAA;AAAAA,EACAC,MAAAA,IAAO;AACO,MAAM;AACpB,QAAMC,IAAOH,IAAY,IAAII,KAAKJ,CAAS,IAAIK,QACzCC,IAAmBH,IACvB,gBAAAI,EAAC,QAAA,EACC,WAAWC,EAAOR,WAClB,UAAUG,EAAKM,eAEdR,UAAAA,KAAiBE,EAAKO,eAAAA,GACzB,IACE;AAEJ,SACE,gBAAAC,EAAC,SACC,WAAWH,EAAO,eAAe,GACjC,qBAAmBN,GAAK,kBAAA,WAEvBX,UAAAA;AAAAA,IAAAA,KACC,gBAAAgB,EAACK,GAAA,EACC,iBAAiBrB,GACjB,OAAOC,GACP,UAAUC,GACV,MAAMC,GACN,MAAMH,GACN,MAAMI,GAAW;AAAA,IAGpBO,MAAS,YAAYI;AAAAA,IACtB,gBAAAK,EAAC,OAAA,EACC,WAAWE,EAAGL,EAAOM,SAASf,KAAWS,EAAOT,OAAO,GACvD,mBAAiBV,GACjB,WAASS,GACT,aAAWI,GAEVA,UAAAA;AAAAA,MAAAA,KAAQ,YACP,gBAAAK,EAACQ,GAAA,EACC,KAAI,SACJ,MAAMlB,GAAS;AAAA,MAGlBD;AAAAA,IAAAA,GACH;AAAA,IACCN,KAAe,gBAAAiB,EAAC,OAAA,EAAI,WAAWC,EAAOlB,aAAcA,UAAAA,GAAY;AAAA,IAChEY,MAAS,aACPd,sBACE,OAAA,EAAI,WAAWoB,EAAOQ,QACpBV,UAAAA;AAAAA,MAAAA;AAAAA,wBACA,OAAA,EACC,WAAWE,EAAOpB,SAClB,wBAAoB,IAEnBA,UAAAA,EAAAA,CACH;AAAA,IAAA,EAAA,CACF,IAEAkB;AAAAA,EAAAA,GAEN;AAEJ;"}

package/dist/components/nav/index.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index13.css');const l=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),u=require("react"),b=require("../../icons-Dv_p0bUF.cjs"),m="_nav_xrgjg_3",v="_label_xrgjg_9",p="_item_xrgjg_17",x="_actions_xrgjg_36",j="_highlighted_xrgjg_60",f="_horizontal_xrgjg_64",N="_sidebar_xrgjg_74",w="_tabs_xrgjg_117",q="_pills_xrgjg_137",t={nav:m,label:v,item:p,actions:x,highlighted:j,horizontal:f,sidebar:N,tabs:w,pills:q},y={default:t.default,pills:t.pills,sidebar:t.sidebar,tabs:t.tabs},z=({className:a,...e})=>l.jsx("span",{className:r.t(a,t.label),...e,"data-component":"navlabel"}),S=({actions:a,children:e,className:o,highlighted:n=!1,...s})=>l.jsxs("div",{className:r.t(t.item,n&&t.highlighted,o),"data-nav-item":!0,...s,"data-component":"navitem",children:[e,a&&l.jsx("span",{className:t.actions,children:a})]}),C=({animation:a,children:e,className:o,horizontal:n=!1,variant:s="default",...g})=>{const[d,c]=u.useState(!1),_={"--icon-svg":b.iconSVG("CaretDown")};return l.jsx("nav",{className:r.t(o,n&&t.horizontal,t.nav,y[s]),"data-animation":a,"data-open":d?"true":"false","data-orientation":n?"horizontal":"vertical",onBlurCapture:i=>{if(s!=="pills"||window.innerWidth>960)return;const h=i.relatedTarget;i.currentTarget.contains(h)||c(!1)},onClick:()=>{s!=="pills"||window.innerWidth>960||c(i=>!i)},style:_,...g,"data-component":"nav",children:e})};exports.Nav=C;exports.NavItem=S;exports.NavLabel=z;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('../../assets/index13.css');const i=require("react/jsx-runtime"),r=require("../../classix-5H4IWnMA.cjs"),b=require("react"),m=require("../../icons-Dv_p0bUF.cjs"),v="_nav_rztyo_3",p="_label_rztyo_9",g="_item_rztyo_17",y="_actions_rztyo_36",z="_highlighted_rztyo_60",f="_horizontal_rztyo_64",N="_sidebar_rztyo_74",x="_tabs_rztyo_131",j="_pills_rztyo_151",t={nav:v,label:p,item:g,actions:y,highlighted:z,horizontal:f,sidebar:N,tabs:x,pills:j},w={default:t.default,pills:t.pills,sidebar:t.sidebar,tabs:t.tabs},q=({className:a,...e})=>i.jsx("span",{className:r.t(a,t.label),...e,"data-component":"navlabel"}),S=({actions:a,children:e,className:l,highlighted:n=!1,...s})=>i.jsxs("div",{className:r.t(t.item,n&&t.highlighted,l),"data-nav-item":!0,...s,"data-component":"navitem",children:[e,a&&i.jsx("span",{className:t.actions,children:a})]}),C=({animation:a,children:e,className:l,horizontal:n=!1,variant:s="default",...d})=>{const[_,c]=b.useState(!1),h={"--icon-svg":m.iconSVG("CaretDown")};return i.jsx("nav",{className:r.t(l,n&&t.horizontal,t.nav,w[s]),"data-animation":a,"data-open":_?"true":"false","data-orientation":n?"horizontal":"vertical",onBlurCapture:o=>{if(s!=="pills"||window.innerWidth>960)return;const u=o.relatedTarget;o.currentTarget.contains(u)||c(!1)},onClick:()=>{s!=="pills"||window.innerWidth>960||c(o=>!o)},style:h,...d,"data-component":"nav",children:e})};exports.Nav=C;exports.NavItem=S;exports.NavLabel=q;
 //# sourceMappingURL=index.cjs.map

package/dist/components/nav/index.js

@@ -1,18 +1,18 @@
-import { jsx as l, jsxs as h } from "react/jsx-runtime";
+import { jsx as l, jsxs as p } from "react/jsx-runtime";
 import { t as r } from "../../classix-DG18itHa.js";
-import { useState as p } from "react";
-import { i as b } from "../../icons-dUP7sKyt.js";
-import '../../assets/index13.css';const f = "_nav_xrgjg_3", v = "_label_xrgjg_9", x = "_item_xrgjg_17", u = "_actions_xrgjg_36", j = "_highlighted_xrgjg_60", N = "_horizontal_xrgjg_64", w = "_sidebar_xrgjg_74", z = "_tabs_xrgjg_117", C = "_pills_xrgjg_137", t = {
-  nav: f,
-  label: v,
-  item: x,
-  actions: u,
-  highlighted: j,
+import { useState as b } from "react";
+import { i as f } from "../../icons-dUP7sKyt.js";
+import '../../assets/index13.css';const v = "_nav_rztyo_3", z = "_label_rztyo_9", u = "_item_rztyo_17", g = "_actions_rztyo_36", y = "_highlighted_rztyo_60", N = "_horizontal_rztyo_64", w = "_sidebar_rztyo_74", x = "_tabs_rztyo_131", C = "_pills_rztyo_151", t = {
+  nav: v,
+  label: z,
+  item: u,
+  actions: g,
+  highlighted: y,
   horizontal: N,
   sidebar: w,
-  tabs: z,
+  tabs: x,
   pills: C
-}, y = {
+}, j = {
   default: t.default,
   pills: t.pills,
   sidebar: t.sidebar,
@@ -23,30 +23,30 @@ import '../../assets/index13.css';const f = "_nav_xrgjg_3", v = "_label_xrgjg_9"
 }) => /* @__PURE__ */ l("span", { className: r(a, t.label), ...n, "data-component": "navlabel" }), B = ({
   actions: a,
   children: n,
-  className: o,
-  highlighted: e = !1,
-  ...s
-}) => /* @__PURE__ */ h("div", { className: r(t.item, e && t.highlighted, o), "data-nav-item": !0, ...s, "data-component": "navitem", children: [
+  className: i,
+  highlighted: s = !1,
+  ...o
+}) => /* @__PURE__ */ p("div", { className: r(t.item, s && t.highlighted, i), "data-nav-item": !0, ...o, "data-component": "navitem", children: [
   n,
   a && /* @__PURE__ */ l("span", { className: t.actions, children: a })
 ] }), D = ({
   animation: a,
   children: n,
-  className: o,
-  horizontal: e = !1,
-  variant: s = "default",
-  ...g
+  className: i,
+  horizontal: s = !1,
+  variant: o = "default",
+  ...d
 }) => {
-  const [d, c] = p(!1), _ = {
-    "--icon-svg": b("CaretDown")
+  const [_, c] = b(!1), m = {
+    "--icon-svg": f("CaretDown")
   };
-  return /* @__PURE__ */ l("nav", { className: r(o, e && t.horizontal, t.nav, y[s]), "data-animation": a, "data-open": d ? "true" : "false", "data-orientation": e ? "horizontal" : "vertical", onBlurCapture: (i) => {
-    if (s !== "pills" || window.innerWidth > 960) return;
-    const m = i.relatedTarget;
-    i.currentTarget.contains(m) || c(!1);
+  return /* @__PURE__ */ l("nav", { className: r(i, s && t.horizontal, t.nav, j[o]), "data-animation": a, "data-open": _ ? "true" : "false", "data-orientation": s ? "horizontal" : "vertical", onBlurCapture: (e) => {
+    if (o !== "pills" || window.innerWidth > 960) return;
+    const h = e.relatedTarget;
+    e.currentTarget.contains(h) || c(!1);
   }, onClick: () => {
-    s !== "pills" || window.innerWidth > 960 || c((i) => !i);
-  }, style: _, ...g, "data-component": "nav", children: n });
+    o !== "pills" || window.innerWidth > 960 || c((e) => !e);
+  }, style: m, ...d, "data-component": "nav", children: n });
 };
 export {
   D as Nav,

package/dist/index.d.ts

@@ -649,11 +649,13 @@ declare type MenuSharedProps = {
     onItemSelect?: (item: MenuItem) => void;
 };
 
-export declare const Message: ({ appearance, attachments, author, authorColor, authorImageUrl, authorLink, authorRole, content, iconName, id, preview, timestamp, timestampText, type, }: MessageOptions) => JSX.Element;
+export declare const Message: ({ actions, appearance, attachments, author, authorColor, authorImageUrl, authorLink, authorRole, content, iconName, id, preview, timestamp, timestampText, type, }: MessageOptions) => JSX.Element;
 
 declare type MessageItem = MessageOptions;
 
 export declare type MessageOptions = {
+    /** Controls shown under the message, e.g. a delete button for the author's own message. */
+    actions?: React.ReactNode;
     appearance?: 'default' | 'document' | 'file';
     attachments?: React.ReactNode;
     author?: string;

package/dist/tokens.json

@@ -363,7 +363,7 @@
     },
     "com.solibo": {
       "packageName": "@solibo/solibo-ui",
-      "packageVersion": "2.0.1"
+      "packageVersion": "2.0.2"
     }
   },
   "$name": "TEST Solibo UI Tokens (Copy)",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@solibo/solibo-ui",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "type": "module",
   "scripts": {
     "dev": "pnpm run tokens:build && vite build --watch",