npm - @ably/ui - Versions diffs - 14.8.0-dev.bf71c2e → 14.8.0-dev.cf437ff - Mend

@ably/ui 14.8.0-dev.bf71c2e → 14.8.0-dev.cf437ff

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/core/Accordion.js +1 -1
package/core/Icon/computed-icons.js +1 -1
package/core/sprites.svg +1 -1
package/core/styles/properties.css +1 -0
package/core/styles/text.css +16 -0
package/index.d.ts +91 -3
package/package.json +1 -1
package/tailwind.config.js +1 -0
/package/core/icons/{icon-product-pub-sub-mono.svg → icon-product-pubsub-mono.svg} +0 -0

package/core/Accordion.js CHANGED Viewed

	@@ -1 +1 @@
1	- import React,{useMemo}from"react";import{AccordionContent,AccordionItem,AccordionTrigger,Accordion as RadixAccordion}from"@radix-ui/react-accordion";import clsx from"clsx";import Icon from"./Icon";import{themeClasses,isNonTransparentTheme,isStaticTheme}from"./Accordion/utils";const AccordionRow=({name,children,rowIcon,options,toggleIcons,theme,index,onClick})=>{const{selectable,sticky}=options\|\|{};const{text,bg,hoverBg,selectableBg,selectableText,border,toggleIconColor}=themeClasses[theme];const textClass=selectable&&selectableText\|\|text;return /#__PURE__/React.createElement(AccordionItem,{value:`accordion-item-${index}`,className:clsx({[`${border}`]:border&&!options?.hideBorders})},/#__PURE__/React.createElement(AccordionTrigger,{onClick:onClick,className:clsx({"flex w-full group/accordion-trigger py-16 ui-text-p1 font-bold text-left items-center gap-12 transition-colors":true,"px-16 mb-16 rounded-lg":isNonTransparentTheme(theme),"rounded-none":!isNonTransparentTheme(theme),"pointer-events-none focus:outline-none":isStaticTheme(theme),"focus:outline-gui-blue-focus":!isStaticTheme(theme),"sticky top-0":sticky,[`${bg} ${hoverBg} ${text}`]:true,[`${selectableBg} ${selectableText}`]:selectable,[options?.headerCSS??""]:true})},rowIcon?/#__PURE__/React.createElement(Icon,{name:rowIcon,color:textClass,size:options?.rowIconSize??"32px"}):null,/#__PURE__/React.createElement("span",null,name),!selectable&&!isStaticTheme(theme)?/#__PURE__/React.createElement("span",{className:"flex-1 justify-end flex items-center"},/#__PURE__/React.createElement(Icon,{additionalCSS:"group-data-[state=closed]/accordion-trigger:hidden",name:toggleIcons.open.name,color:toggleIconColor,size:options?.iconSize??"16px"}),/#__PURE__/React.createElement(Icon,{additionalCSS:"group-data-[state=open]/accordion-trigger:hidden",name:toggleIcons.closed.name,color:toggleIconColor,size:options?.iconSize??"16px"})):null),/#__PURE__/React.createElement(AccordionContent,{className:"ui-text-p2 overflow-hidden transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"},/#__PURE__/React.createElement("div",{className:"pb-16"},children)))};const Accordion=({data,theme="transparent",icons={closed:{name:"icon-gui-plus"},open:{name:"icon-gui-minus"}},options,...props})=>{const innerAccordion=data.map((item,index)=>/#__PURE__/React.createElement(AccordionRow,{key:item.name,name:item.name,rowIcon:item.icon,toggleIcons:icons,theme:theme,options:options,index:index,onClick:()=>{item.onClick?.(index)}},item.content));const openIndexes=useMemo(()=>{const indexValues=data.map((_,i)=>`accordion-item-${i}`);return options?.fullyOpen?indexValues:indexValues.filter((_,index)=>options?.defaultOpenIndexes?.includes(index))},[options?.defaultOpenIndexes,options?.fullyOpen,data.length]);return /#__PURE__/React.createElement("div",props,options?.autoClose?/#__PURE__/React.createElement(RadixAccordion,{type:"single"},innerAccordion):/#__PURE__/React.createElement(RadixAccordion,{type:"multiple",defaultValue:openIndexes},innerAccordion))};export default Accordion;
1	+ import React,{useMemo}from"react";import{AccordionContent,AccordionItem,AccordionTrigger,Accordion as RadixAccordion}from"@radix-ui/react-accordion";import clsx from"clsx";import Icon from"./Icon";import{themeClasses,isNonTransparentTheme,isStaticTheme}from"./Accordion/utils";const AccordionRow=({name,children,rowIcon,options,toggleIcons,theme,index,onClick})=>{const{selectable,sticky}=options\|\|{};const{text,bg,hoverBg,selectableBg,selectableText,border,toggleIconColor}=themeClasses[theme];const textClass=selectable&&selectableText\|\|text;return /#__PURE__/React.createElement(AccordionItem,{value:`accordion-item-${index}`,className:clsx({[`${border}`]:border&&!options?.hideBorders})},/#__PURE__/React.createElement(AccordionTrigger,{onClick:onClick,className:clsx({"flex w-full group/accordion-trigger py-16 ui-text-p1 font-bold text-left items-center gap-12 transition-colors":true,"px-16 mb-16 rounded-lg":isNonTransparentTheme(theme),"rounded-none":!isNonTransparentTheme(theme),"pointer-events-none focus:outline-none":isStaticTheme(theme),"focus:outline-gui-blue-focus":!isStaticTheme(theme),"sticky top-0":sticky,[`${bg} ${hoverBg} ${text}`]:true,[`${selectableBg} ${selectableText}`]:selectable,[options?.headerCSS??""]:true})},rowIcon?/#__PURE__/React.createElement(Icon,{name:rowIcon,color:textClass,size:options?.rowIconSize??"32px"}):null,/#__PURE__/React.createElement("span",null,name),!selectable&&!isStaticTheme(theme)?/#__PURE__/React.createElement("span",{className:"flex-1 justify-end flex items-center"},/#__PURE__/React.createElement(Icon,{additionalCSS:"group-data-[state=closed]/accordion-trigger:hidden",name:toggleIcons.open.name,color:toggleIconColor,size:options?.iconSize??"16px"}),/#__PURE__/React.createElement(Icon,{additionalCSS:"group-data-[state=open]/accordion-trigger:hidden",name:toggleIcons.closed.name,color:toggleIconColor,size:options?.iconSize??"16px"})):null),/#__PURE__/React.createElement(AccordionContent,{className:"ui-text-p2 overflow-hidden transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"},/#__PURE__/React.createElement("div",{className:"pb-16"},children)))};const Accordion=({data,theme="transparent",icons={closed:{name:"icon-gui-plus"},open:{name:"icon-gui-minus"}},options,...props})=>{const innerAccordion=data.map((item,index)=>/#__PURE__/React.createElement(AccordionRow,{key:item.name,name:item.name,rowIcon:item.icon,toggleIcons:icons,theme:theme,options:options,index:index,onClick:()=>{item.onClick?.(index)}},item.content));const openIndexes=useMemo(()=>{const indexValues=data.map((_,i)=>`accordion-item-${i}`);return options?.fullyOpen?indexValues:indexValues.filter((_,index)=>options?.defaultOpenIndexes?.includes(index))},[options?.defaultOpenIndexes,options?.fullyOpen,data.length]);return /#__PURE__/React.createElement("div",props,options?.autoClose?/#__PURE__/React.createElement(RadixAccordion,{type:"single",collapsible:true,defaultValue:openIndexes[0]},innerAccordion):/#__PURE__/React.createElement(RadixAccordion,{type:"multiple",defaultValue:openIndexes},innerAccordion))};export default Accordion;

package/core/Icon/computed-icons.js CHANGED Viewed

	@@ -1 +1 @@
1	- export const computedIcons={"display":["icon-display-48hrs","icon-display-ably-channels","icon-display-about-ably-col","icon-display-api-keys","icon-display-api","icon-display-architectural-guidance","icon-display-asset-tracking-col","icon-display-authentication","icon-display-avatar-stack","icon-display-browser","icon-display-calendar","icon-display-call-mobile","icon-display-careers-col","icon-display-case-studies-col","icon-display-chat-col","icon-display-chat-mono","icon-display-chat-stack-col","icon-display-chat-stack","icon-display-cloud-servers","icon-display-compare-tech-col","icon-display-connection-state-&-recovery","icon-display-consumer-groups","icon-display-custom-cname","icon-display-custom","icon-display-customers-col","icon-display-data-broadcast-col","icon-display-data-broadcast-mono","icon-display-data-synchronization-col","icon-display-dedicated-cluster","icon-display-deltas","icon-display-docs-col","icon-display-documentation","icon-display-dynamic-channel-groups","icon-display-edge-network","icon-display-elasticity","icon-display-equalisers-mono","icon-display-events-col","icon-display-exactly-once-delivery","icon-display-examples-col","icon-display-fan-out","icon-display-firehose","icon-display-gdpr","icon-display-general-comms","icon-display-granular-permissions","icon-display-hipaa-mono","icon-display-hipaa","icon-display-history","icon-display-integrations-col","icon-display-integrations","icon-display-it-support-access","icon-display-it-support-helpdesk","icon-display-kafka-at-the-edge-col","icon-display-laptop","icon-display-lightbulb-col","icon-display-live-chat","icon-display-live-updates-results-metrics-col","icon-display-map-pin","icon-display-message-batching","icon-display-message-persistence","icon-display-message-queues","icon-display-message","icon-display-multi-user-spaces-col","icon-display-observe-analytics","icon-display-padlock-closed","icon-display-platform","icon-display-play","icon-display-premium-support","icon-display-privacy-shield-framework","icon-display-private-link","icon-display-push-notifications-col","icon-display-push-notifications-mono","icon-display-push-notifications","icon-display-quickstart-guides-col","icon-display-resources-col","icon-display-rewind","icon-display-sdks-col","icon-display-send-received-messages","icon-display-servers","icon-display-shopping-cart","icon-display-sla","icon-display-soc2-type2-mono","icon-display-soc2-type2","icon-display-subscription-filters","icon-display-support-chat-mono","icon-display-system-metadata","icon-display-tech-account-comms","icon-display-tutorials-demos-col","icon-display-virtual-events-col","icon-display-virtual-events"],"gui":["icon-gui-ably-badge","icon-gui-arrow-bidirectional-horizontal","icon-gui-arrow-bidirectional-vertical","icon-gui-arrow-down","icon-gui-arrow-left","icon-gui-arrow-right","icon-gui-arrow-up","icon-gui-burger-menu","icon-gui-check-circled-fill-black","icon-gui-check-circled-fill","icon-gui-check-circled","icon-gui-checklist-checked","icon-gui-chevron-down","icon-gui-chevron-up","icon-gui-clock","icon-gui-close","icon-gui-copy","icon-gui-cross-circled-fill","icon-gui-cross-circled","icon-gui-dash-circled","icon-gui-disclosure-arrow","icon-gui-document-generic","icon-gui-enlarge","icon-gui-external-link","icon-gui-filter-flow-step-1","icon-gui-filter-flow-step-2","icon-gui-filter-flow-step-3","icon-gui-hand","icon-gui-history","icon-gui-info","icon-gui-link-arrow","icon-gui-link","icon-gui-live-chat","icon-gui-minus","icon-gui-partial","icon-gui-plus","icon-gui-quote-marks-solid","icon-gui-refresh","icon-gui-resources","icon-gui-search","icon-gui-tick","icon-gui-warning"],"other":["icon-other-quote"],"product":["icon-product-asset-tracking-mono","icon-product-asset-tracking","icon-product-chat-mono","icon-product-chat","icon-product-liveobjects","icon-product-livesync-mono","icon-product-livesync","icon-product-platform-mono","icon-product-~~pub~~-~~sub-~~mono","icon-product-pubsub","icon-product-spaces-mono","icon-product-spaces"],"social":["icon-social-discord","icon-social-facebook","icon-social-github","icon-social-glassdoor","icon-social-google","icon-social-linkedin","icon-social-stackoverflow","icon-social-twitter","icon-social-x","icon-social-youtube"],"tech":["icon-tech-amqp10","icon-tech-apache-kafka","icon-tech-apachepulsar","icon-tech-awskinesis","icon-tech-awslambda","icon-tech-awssqs","icon-tech-azureservicebus","icon-tech-cloudflareworkers","icon-tech-csharp","icon-tech-flutter","icon-tech-gcloudfunctions","icon-tech-go","icon-tech-ifttt","icon-tech-java","icon-tech-javascript","icon-tech-net","icon-tech-objectivec","icon-tech-php","icon-tech-python","icon-tech-react","icon-tech-ruby","icon-tech-swift","icon-tech-terraform","icon-tech-zapier"]};
1	+ export const computedIcons={"display":["icon-display-48hrs","icon-display-ably-channels","icon-display-about-ably-col","icon-display-api-keys","icon-display-api","icon-display-architectural-guidance","icon-display-asset-tracking-col","icon-display-authentication","icon-display-avatar-stack","icon-display-browser","icon-display-calendar","icon-display-call-mobile","icon-display-careers-col","icon-display-case-studies-col","icon-display-chat-col","icon-display-chat-mono","icon-display-chat-stack-col","icon-display-chat-stack","icon-display-cloud-servers","icon-display-compare-tech-col","icon-display-connection-state-&-recovery","icon-display-consumer-groups","icon-display-custom-cname","icon-display-custom","icon-display-customers-col","icon-display-data-broadcast-col","icon-display-data-broadcast-mono","icon-display-data-synchronization-col","icon-display-dedicated-cluster","icon-display-deltas","icon-display-docs-col","icon-display-documentation","icon-display-dynamic-channel-groups","icon-display-edge-network","icon-display-elasticity","icon-display-equalisers-mono","icon-display-events-col","icon-display-exactly-once-delivery","icon-display-examples-col","icon-display-fan-out","icon-display-firehose","icon-display-gdpr","icon-display-general-comms","icon-display-granular-permissions","icon-display-hipaa-mono","icon-display-hipaa","icon-display-history","icon-display-integrations-col","icon-display-integrations","icon-display-it-support-access","icon-display-it-support-helpdesk","icon-display-kafka-at-the-edge-col","icon-display-laptop","icon-display-lightbulb-col","icon-display-live-chat","icon-display-live-updates-results-metrics-col","icon-display-map-pin","icon-display-message-batching","icon-display-message-persistence","icon-display-message-queues","icon-display-message","icon-display-multi-user-spaces-col","icon-display-observe-analytics","icon-display-padlock-closed","icon-display-platform","icon-display-play","icon-display-premium-support","icon-display-privacy-shield-framework","icon-display-private-link","icon-display-push-notifications-col","icon-display-push-notifications-mono","icon-display-push-notifications","icon-display-quickstart-guides-col","icon-display-resources-col","icon-display-rewind","icon-display-sdks-col","icon-display-send-received-messages","icon-display-servers","icon-display-shopping-cart","icon-display-sla","icon-display-soc2-type2-mono","icon-display-soc2-type2","icon-display-subscription-filters","icon-display-support-chat-mono","icon-display-system-metadata","icon-display-tech-account-comms","icon-display-tutorials-demos-col","icon-display-virtual-events-col","icon-display-virtual-events"],"gui":["icon-gui-ably-badge","icon-gui-arrow-bidirectional-horizontal","icon-gui-arrow-bidirectional-vertical","icon-gui-arrow-down","icon-gui-arrow-left","icon-gui-arrow-right","icon-gui-arrow-up","icon-gui-burger-menu","icon-gui-check-circled-fill-black","icon-gui-check-circled-fill","icon-gui-check-circled","icon-gui-checklist-checked","icon-gui-chevron-down","icon-gui-chevron-up","icon-gui-clock","icon-gui-close","icon-gui-copy","icon-gui-cross-circled-fill","icon-gui-cross-circled","icon-gui-dash-circled","icon-gui-disclosure-arrow","icon-gui-document-generic","icon-gui-enlarge","icon-gui-external-link","icon-gui-filter-flow-step-1","icon-gui-filter-flow-step-2","icon-gui-filter-flow-step-3","icon-gui-hand","icon-gui-history","icon-gui-info","icon-gui-link-arrow","icon-gui-link","icon-gui-live-chat","icon-gui-minus","icon-gui-partial","icon-gui-plus","icon-gui-quote-marks-solid","icon-gui-refresh","icon-gui-resources","icon-gui-search","icon-gui-tick","icon-gui-warning"],"other":["icon-other-quote"],"product":["icon-product-asset-tracking-mono","icon-product-asset-tracking","icon-product-chat-mono","icon-product-chat","icon-product-liveobjects","icon-product-livesync-mono","icon-product-livesync","icon-product-platform-mono","icon-product-pubsub-mono","icon-product-pubsub","icon-product-spaces-mono","icon-product-spaces"],"social":["icon-social-discord","icon-social-facebook","icon-social-github","icon-social-glassdoor","icon-social-google","icon-social-linkedin","icon-social-stackoverflow","icon-social-twitter","icon-social-x","icon-social-youtube"],"tech":["icon-tech-amqp10","icon-tech-apache-kafka","icon-tech-apachepulsar","icon-tech-awskinesis","icon-tech-awslambda","icon-tech-awssqs","icon-tech-azureservicebus","icon-tech-cloudflareworkers","icon-tech-csharp","icon-tech-flutter","icon-tech-gcloudfunctions","icon-tech-go","icon-tech-ifttt","icon-tech-java","icon-tech-javascript","icon-tech-net","icon-tech-objectivec","icon-tech-php","icon-tech-python","icon-tech-react","icon-tech-ruby","icon-tech-swift","icon-tech-terraform","icon-tech-zapier"]};