@ndla/primitives 1.0.128-alpha.0 → 1.0.129-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/es/Accordion.mjs.map +1 -1
  2. package/es/ArticleLists.mjs +7 -0
  3. package/es/ArticleLists.mjs.map +1 -1
  4. package/es/Card/Card.mjs.map +1 -1
  5. package/es/Checkbox.mjs.map +1 -1
  6. package/es/Combobox.mjs.map +1 -1
  7. package/es/DatePicker.mjs.map +1 -1
  8. package/es/Dialog.mjs.map +1 -1
  9. package/es/ErrorMessage/ErrorMessage.mjs.map +1 -1
  10. package/es/ExpandableBox.mjs.map +1 -1
  11. package/es/FileUpload.mjs.map +1 -1
  12. package/es/Hero.mjs.map +1 -1
  13. package/es/Layout/PageContent.mjs +5 -0
  14. package/es/Layout/PageContent.mjs.map +1 -1
  15. package/es/ListItem/ListItem.mjs.map +1 -1
  16. package/es/Menu.mjs.map +1 -1
  17. package/es/Pagination.mjs.map +1 -1
  18. package/es/Popover.mjs.map +1 -1
  19. package/es/RadioGroup.mjs.map +1 -1
  20. package/es/Select.mjs.map +1 -1
  21. package/es/Slider.mjs +1 -0
  22. package/es/Slider.mjs.map +1 -1
  23. package/es/Switch.mjs.map +1 -1
  24. package/es/Tabs.mjs.map +1 -1
  25. package/es/TagsInput.mjs.map +1 -1
  26. package/es/Toast.mjs.map +1 -1
  27. package/es/ToggleGroup.mjs.map +1 -1
  28. package/es/Tooltip.mjs.map +1 -1
  29. package/es/Tree/Tree.mjs.map +1 -1
  30. package/lib/Accordion.js.map +1 -1
  31. package/lib/ArticleLists.js +7 -0
  32. package/lib/ArticleLists.js.map +1 -1
  33. package/lib/Card/Card.js.map +1 -1
  34. package/lib/Checkbox.js.map +1 -1
  35. package/lib/Combobox.js.map +1 -1
  36. package/lib/DatePicker.js.map +1 -1
  37. package/lib/Dialog.js.map +1 -1
  38. package/lib/ErrorMessage/ErrorMessage.js.map +1 -1
  39. package/lib/ExpandableBox.js.map +1 -1
  40. package/lib/FileUpload.js.map +1 -1
  41. package/lib/Hero.js.map +1 -1
  42. package/lib/Layout/PageContent.js +5 -0
  43. package/lib/Layout/PageContent.js.map +1 -1
  44. package/lib/ListItem/ListItem.js.map +1 -1
  45. package/lib/Menu.js.map +1 -1
  46. package/lib/Pagination.js.map +1 -1
  47. package/lib/Popover.js.map +1 -1
  48. package/lib/RadioGroup.js.map +1 -1
  49. package/lib/Select.js.map +1 -1
  50. package/lib/Skeleton.js.map +1 -1
  51. package/lib/Slider.js +1 -0
  52. package/lib/Slider.js.map +1 -1
  53. package/lib/Switch.js.map +1 -1
  54. package/lib/Table.js.map +1 -1
  55. package/lib/Tabs.js.map +1 -1
  56. package/lib/TagsInput.js.map +1 -1
  57. package/lib/Toast.js.map +1 -1
  58. package/lib/ToggleGroup.js.map +1 -1
  59. package/lib/Tooltip.js.map +1 -1
  60. package/lib/Tree/Tree.js.map +1 -1
  61. package/package.json +2 -2
package/es/Menu.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Menu.mjs","names":[],"sources":["../src/Menu.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Menu, menuAnatomy } from \"@ark-ui/react\";\nimport { css, cva, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { RecipeVariantProps, StyledProps, SystemStyleObject } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst itemStyle: SystemStyleObject = css.raw({\n display: \"flex\",\n alignItems: \"center\",\n borderRadius: \"xsmall\",\n cursor: \"pointer\",\n textStyle: \"label.medium\",\n paddingBlock: \"4xsmall\",\n paddingInline: \"xsmall\",\n gap: \"xsmall\",\n transitionDuration: \"fast\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n outline: \"none\",\n _hover: {\n textDecoration: \"underline\",\n },\n _highlighted: {\n textDecoration: \"underline\",\n },\n _disabled: {\n color: \"text.disabled\",\n cursor: \"not-allowed\",\n \"& svg\": {\n color: \"stroke.disabled\",\n },\n _hover: {\n color: \"text.disabled\",\n textDecoration: \"none\",\n background: \"surface.default\",\n \"& svg\": {\n color: \"stroke.disabled\",\n },\n },\n },\n});\n\nconst itemCva = cva({\n defaultVariants: {\n variant: \"action\",\n },\n variants: {\n variant: {\n action: {\n _hover: {\n background: \"surface.hover\",\n },\n _highlighted: {\n background: \"surface.hover\",\n },\n _active: {\n background: \"surface.active\",\n },\n },\n destructive: {\n color: \"text.error\",\n \"& svg\": {\n color: \"icon.error\",\n },\n _hover: {\n color: \"text.default\",\n \"& svg\": {\n color: \"icon.default\",\n },\n background: \"surface.dangerSubtle.hover\",\n },\n _highlighted: {\n color: \"text.default\",\n \"& svg\": {\n color: \"icon.default\",\n },\n background: \"surface.dangerSubtle.hover\",\n },\n _active: {\n background: \"surface.dangerSubtle.active\",\n },\n },\n },\n },\n});\n\nconst menuRecipe = sva({\n slots: menuAnatomy.keys(),\n base: {\n item: itemStyle,\n triggerItem: itemStyle,\n content: {\n color: \"text.default\",\n display: \"flex\",\n flexDirection: \"column\",\n width: \"fit-content\",\n minWidth: \"surface.xxsmall\",\n padding: \"3xsmall\",\n gap: \"3xsmall\",\n background: \"surface.default\",\n boxShadow: \"small\",\n borderRadius: \"xsmall\",\n outline: \"none\",\n zIndex: \"dropdown\",\n _open: {\n animation: \"fade-shift-in 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n itemGroup: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n positioner: {\n zIndex: \"dropdown\",\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(menuRecipe);\n\nexport type MenuRootProps = Menu.RootProps;\n\nconst InternalMenuRoot = withRootProvider(Menu.Root);\n\nexport const MenuRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: MenuRootProps) => (\n <InternalMenuRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const MenuContentStandalone = withContext(Menu.Content, \"content\", { baseComponent: true });\n\ninterface MenuContentProps extends Menu.ContentProps, StyledProps {}\n\nexport const MenuContent = forwardRef<HTMLDivElement, MenuContentProps>((props, ref) => (\n <MenuPositioner>\n <MenuContentStandalone ref={ref} {...props} />\n </MenuPositioner>\n));\n\nconst InternalMenuItemGroupLabel = withContext(Menu.ItemGroupLabel, \"itemGroupLabel\");\n\ninterface MenuItemGroupLabelProps\n extends Omit<Menu.ItemGroupLabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLDivElement> {}\n\nexport const MenuItemGroupLabel = ({\n textStyle = \"label.medium\",\n fontWeight = \"bold\",\n children,\n ...props\n}: MenuItemGroupLabelProps) => (\n <InternalMenuItemGroupLabel {...props} asChild>\n <Text textStyle={textStyle} fontWeight={fontWeight}>\n {children}\n </Text>\n </InternalMenuItemGroupLabel>\n);\n\nexport const MenuItemGroup = withContext(Menu.ItemGroup, \"itemGroup\", { baseComponent: true });\n\nconst InternalMenuItem = withContext(Menu.Item, \"item\", { baseComponent: true });\n\nexport type MenuItemVariantProps = NonNullable<RecipeVariantProps<typeof itemCva>>;\nexport interface MenuItemProps\n extends Menu.ItemProps, StyledProps, MenuItemVariantProps, RefAttributes<HTMLDivElement> {}\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(({ css: cssProp = {}, variant, ...props }, ref) => (\n <InternalMenuItem\n css={[itemCva.raw({ variant }), ...(Array.isArray(cssProp) ? cssProp : [cssProp])]}\n {...props}\n ref={ref}\n />\n));\n\nexport const MenuPositioner = withContext(Menu.Positioner, \"positioner\", { baseComponent: true });\n\nconst InternalMenuTriggerItem = withContext(Menu.TriggerItem, \"triggerItem\", { baseComponent: true });\n\ninterface MenuTriggerItemProps\n extends Menu.TriggerItemProps, StyledProps, MenuItemVariantProps, RefAttributes<HTMLButtonElement> {}\n\nexport const MenuTriggerItem = forwardRef<HTMLDivElement, MenuTriggerItemProps>(\n ({ css: cssProp = {}, variant, ...props }, ref) => (\n <InternalMenuTriggerItem\n css={[itemCva.raw({ variant }), ...(Array.isArray(cssProp) ? cssProp : [cssProp])]}\n {...props}\n ref={ref}\n />\n ),\n);\n\nexport const MenuTrigger = withContext(Menu.Trigger, \"trigger\", { baseComponent: true });\n\nexport const MenuSeparator = withContext(Menu.Separator, \"separator\", { baseComponent: true });\n\nexport const MenuItemText = withContext(Menu.ItemText, \"itemText\", { baseComponent: true });\n"],"mappings":"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"}
1
+ {"version":3,"file":"Menu.mjs","names":[],"sources":["../src/Menu.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Menu, menuAnatomy } from \"@ark-ui/react\";\nimport { css, cva, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { RecipeVariantProps, StyledProps, SystemStyleObject } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst itemStyle: SystemStyleObject = css.raw({\n display: \"flex\",\n alignItems: \"center\",\n borderRadius: \"xsmall\",\n cursor: \"pointer\",\n textStyle: \"label.medium\",\n paddingBlock: \"4xsmall\",\n paddingInline: \"xsmall\",\n gap: \"xsmall\",\n transitionDuration: \"fast\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n outline: \"none\",\n _hover: {\n textDecoration: \"underline\",\n },\n _highlighted: {\n textDecoration: \"underline\",\n },\n _disabled: {\n color: \"text.disabled\",\n cursor: \"not-allowed\",\n \"& svg\": {\n color: \"stroke.disabled\",\n },\n _hover: {\n color: \"text.disabled\",\n textDecoration: \"none\",\n background: \"surface.default\",\n \"& svg\": {\n color: \"stroke.disabled\",\n },\n },\n },\n});\n\nconst itemCva = cva({\n defaultVariants: {\n variant: \"action\",\n },\n variants: {\n variant: {\n action: {\n _hover: {\n background: \"surface.hover\",\n },\n _highlighted: {\n background: \"surface.hover\",\n },\n _active: {\n background: \"surface.active\",\n },\n },\n destructive: {\n color: \"text.error\",\n \"& svg\": {\n color: \"icon.error\",\n },\n _hover: {\n color: \"text.default\",\n \"& svg\": {\n color: \"icon.default\",\n },\n background: \"surface.dangerSubtle.hover\",\n },\n _highlighted: {\n color: \"text.default\",\n \"& svg\": {\n color: \"icon.default\",\n },\n background: \"surface.dangerSubtle.hover\",\n },\n _active: {\n background: \"surface.dangerSubtle.active\",\n },\n },\n },\n },\n});\n\nconst menuRecipe = sva({\n slots: menuAnatomy.keys(),\n base: {\n item: itemStyle,\n triggerItem: itemStyle,\n content: {\n color: \"text.default\",\n display: \"flex\",\n flexDirection: \"column\",\n width: \"fit-content\",\n minWidth: \"surface.xxsmall\",\n padding: \"3xsmall\",\n gap: \"3xsmall\",\n background: \"surface.default\",\n boxShadow: \"small\",\n borderRadius: \"xsmall\",\n outline: \"none\",\n zIndex: \"dropdown\",\n _open: {\n animation: \"fade-shift-in 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n itemGroup: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n positioner: {\n zIndex: \"dropdown\",\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(menuRecipe);\n\nexport type MenuRootProps = Menu.RootProps;\n\nconst InternalMenuRoot = withRootProvider(Menu.Root);\n\nexport const MenuRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: MenuRootProps) => (\n <InternalMenuRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const MenuContentStandalone = withContext(Menu.Content, \"content\", { baseComponent: true });\n\ninterface MenuContentProps extends Menu.ContentProps, StyledProps {}\n\nexport const MenuContent = forwardRef<HTMLDivElement, MenuContentProps>((props, ref) => (\n <MenuPositioner>\n <MenuContentStandalone ref={ref} {...props} />\n </MenuPositioner>\n));\n\nconst InternalMenuItemGroupLabel = withContext(Menu.ItemGroupLabel, \"itemGroupLabel\");\n\ninterface MenuItemGroupLabelProps\n extends Omit<Menu.ItemGroupLabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLDivElement> {}\n\nexport const MenuItemGroupLabel = ({\n textStyle = \"label.medium\",\n fontWeight = \"bold\",\n children,\n ...props\n}: MenuItemGroupLabelProps) => (\n <InternalMenuItemGroupLabel {...props} asChild>\n <Text textStyle={textStyle} fontWeight={fontWeight}>\n {children}\n </Text>\n </InternalMenuItemGroupLabel>\n);\n\nexport const MenuItemGroup = withContext(Menu.ItemGroup, \"itemGroup\", { baseComponent: true });\n\nconst InternalMenuItem = withContext(Menu.Item, \"item\", { baseComponent: true });\n\nexport type MenuItemVariantProps = NonNullable<RecipeVariantProps<typeof itemCva>>;\nexport interface MenuItemProps\n extends Menu.ItemProps, StyledProps, MenuItemVariantProps, RefAttributes<HTMLDivElement> {}\n\nexport const MenuItem = forwardRef<HTMLDivElement, MenuItemProps>(({ css: cssProp = {}, variant, ...props }, ref) => (\n <InternalMenuItem\n css={[itemCva.raw({ variant }), ...(Array.isArray(cssProp) ? cssProp : [cssProp])]}\n {...props}\n ref={ref}\n />\n));\n\nexport const MenuPositioner = withContext(Menu.Positioner, \"positioner\", { baseComponent: true });\n\nconst InternalMenuTriggerItem = withContext(Menu.TriggerItem, \"triggerItem\", { baseComponent: true });\n\ninterface MenuTriggerItemProps\n extends Menu.TriggerItemProps, StyledProps, MenuItemVariantProps, RefAttributes<HTMLButtonElement> {}\n\nexport const MenuTriggerItem = forwardRef<HTMLDivElement, MenuTriggerItemProps>(\n ({ css: cssProp = {}, variant, ...props }, ref) => (\n <InternalMenuTriggerItem\n css={[itemCva.raw({ variant }), ...(Array.isArray(cssProp) ? cssProp : [cssProp])]}\n {...props}\n ref={ref}\n />\n ),\n);\n\nexport const MenuTrigger = withContext(Menu.Trigger, \"trigger\", { baseComponent: true });\n\nexport const MenuSeparator = withContext(Menu.Separator, \"separator\", { baseComponent: true });\n\nexport const MenuItemText = withContext(Menu.ItemText, \"itemText\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;;;;AAeA,MAAM,YAA+B,IAAI,IAAI;CAC3C,SAAS;CACT,YAAY;CACZ,cAAc;CACd,QAAQ;CACR,WAAW;CACX,cAAc;CACd,eAAe;CACf,KAAK;CACL,oBAAoB;CACpB,oBAAoB;CACpB,0BAA0B;CAC1B,SAAS;CACT,QAAQ,EACN,gBAAgB,aACjB;CACD,cAAc,EACZ,gBAAgB,aACjB;CACD,WAAW;EACT,OAAO;EACP,QAAQ;EACR,SAAS,EACP,OAAO,mBACR;EACD,QAAQ;GACN,OAAO;GACP,gBAAgB;GAChB,YAAY;GACZ,SAAS,EACP,OAAO,mBACR;GACF;EACF;CACF,CAAC;AAEF,MAAM,UAAU,IAAI;CAClB,iBAAiB,EACf,SAAS,UACV;CACD,UAAU,EACR,SAAS;EACP,QAAQ;GACN,QAAQ,EACN,YAAY,iBACb;GACD,cAAc,EACZ,YAAY,iBACb;GACD,SAAS,EACP,YAAY,kBACb;GACF;EACD,aAAa;GACX,OAAO;GACP,SAAS,EACP,OAAO,cACR;GACD,QAAQ;IACN,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,YAAY;IACb;GACD,cAAc;IACZ,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,YAAY;IACb;GACD,SAAS,EACP,YAAY,+BACb;GACF;EACF,EACF;CACF,CAAC;AA4CF,MAAM,EAAE,kBAAkB,gBAAgB,mBA1CvB,IAAI;CACrB,OAAO,YAAY,MAAM;CACzB,MAAM;EACJ,MAAM;EACN,aAAa;EACb,SAAS;GACP,OAAO;GACP,SAAS;GACT,eAAe;GACf,OAAO;GACP,UAAU;GACV,SAAS;GACT,KAAK;GACL,YAAY;GACZ,WAAW;GACX,cAAc;GACd,SAAS;GACT,QAAQ;GACR,OAAO;IACL,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACD,SAAS;IACP,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACF;EACD,WAAW;GACT,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,YAAY,EACV,QAAQ,YACT;EACF;CACF,CAEsE,CAAC;AAIxE,MAAM,mBAAmB,iBAAiB,KAAK,KAAK;AAEpD,MAAa,YAAY,EAAE,YAAY,MAAM,gBAAgB,MAAM,GAAG,YACpE,oBAAC,kBAAD;CAA6B;CAA0B;CAAe,GAAI;CAAS,CAAA;AAGrF,MAAa,wBAAwB,YAAY,KAAK,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIlG,MAAa,cAAc,YAA8C,OAAO,QAC9E,oBAAC,gBAAD,EAAA,UACE,oBAAC,uBAAD;CAA4B;CAAK,GAAI;CAAS,CAAA,EAC/B,CAAA,CACjB;AAEF,MAAM,6BAA6B,YAAY,KAAK,gBAAgB,iBAAiB;AAKrF,MAAa,sBAAsB,EACjC,YAAY,gBACZ,aAAa,QACb,UACA,GAAG,YAEH,oBAAC,4BAAD;CAA4B,GAAI;CAAO,SAAA;WACrC,oBAAC,MAAD;EAAiB;EAAuB;EACrC;EACI,CAAA;CACoB,CAAA;AAG/B,MAAa,gBAAgB,YAAY,KAAK,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAE9F,MAAM,mBAAmB,YAAY,KAAK,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAMhF,MAAa,WAAW,YAA2C,EAAE,KAAK,UAAU,EAAE,EAAE,SAAS,GAAG,SAAS,QAC3G,oBAAC,kBAAD;CACE,KAAK,CAAC,QAAQ,IAAI,EAAE,SAAS,CAAC,EAAE,GAAI,MAAM,QAAQ,QAAQ,GAAG,UAAU,CAAC,QAAQ,CAAE;CAClF,GAAI;CACC;CACL,CAAA,CACF;AAEF,MAAa,iBAAiB,YAAY,KAAK,YAAY,cAAc,EAAE,eAAe,MAAM,CAAC;AAEjG,MAAM,0BAA0B,YAAY,KAAK,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAKrG,MAAa,kBAAkB,YAC5B,EAAE,KAAK,UAAU,EAAE,EAAE,SAAS,GAAG,SAAS,QACzC,oBAAC,yBAAD;CACE,KAAK,CAAC,QAAQ,IAAI,EAAE,SAAS,CAAC,EAAE,GAAI,MAAM,QAAQ,QAAQ,GAAG,UAAU,CAAC,QAAQ,CAAE;CAClF,GAAI;CACC;CACL,CAAA,CAEL;AAED,MAAa,cAAc,YAAY,KAAK,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAExF,MAAa,gBAAgB,YAAY,KAAK,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAE9F,MAAa,eAAe,YAAY,KAAK,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC"}
package/es/Pagination.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Pagination.mjs","names":[],"sources":["../src/Pagination.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Pagination, paginationAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\n\nconst paginationRecipe = sva({\n slots: paginationAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n gap: \"xxsmall\",\n justifyContent: \"center\",\n },\n item: {\n fontVariantNumeric: \"tabular-nums\",\n },\n ellipsis: {\n display: \"inline-flex\",\n alignItems: \"center\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(paginationRecipe);\n\nexport interface PaginationRootProps extends Pagination.RootProps, StyledProps {\n translations: Pagination.RootProps[\"translations\"];\n}\n\nexport const PaginationRoot = withProvider(Pagination.Root, \"root\", { baseComponent: true });\n\nexport const PaginationItem = withContext(Pagination.Item, \"item\", { baseComponent: true });\n\nexport const PaginationEllipsis = withContext(Pagination.Ellipsis, \"ellipsis\", { baseComponent: true });\n\nexport const PaginationContext = Pagination.Context;\n\nexport const PaginationPrevTrigger = withContext(Pagination.PrevTrigger, \"prevTrigger\", { baseComponent: true });\n\nexport const PaginationNextTrigger = withContext(Pagination.NextTrigger, \"nextTrigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;AA+BA,MAAM,EAAE,cAAc,gBAAgB,mBAlBb,IAAI;CAC3B,OAAO,kBAAkB,MAAM;CAC/B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,KAAK;GACL,gBAAgB;GACjB;EACD,MAAM,EACJ,oBAAoB,gBACrB;EACD,UAAU;GACR,SAAS;GACT,YAAY;GACb;EACF;CACF,CAAC,CAEwE;AAM1E,MAAa,iBAAiB,aAAa,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,iBAAiB,YAAY,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAa,qBAAqB,YAAY,WAAW,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAa,oBAAoB,WAAW;AAE5C,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAEhH,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Pagination.mjs","names":[],"sources":["../src/Pagination.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Pagination, paginationAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\n\nconst paginationRecipe = sva({\n slots: paginationAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n gap: \"xxsmall\",\n justifyContent: \"center\",\n },\n item: {\n fontVariantNumeric: \"tabular-nums\",\n },\n ellipsis: {\n display: \"inline-flex\",\n alignItems: \"center\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(paginationRecipe);\n\nexport interface PaginationRootProps extends Pagination.RootProps, StyledProps {\n translations: Pagination.RootProps[\"translations\"];\n}\n\nexport const PaginationRoot = withProvider(Pagination.Root, \"root\", { baseComponent: true });\n\nexport const PaginationItem = withContext(Pagination.Item, \"item\", { baseComponent: true });\n\nexport const PaginationEllipsis = withContext(Pagination.Ellipsis, \"ellipsis\", { baseComponent: true });\n\nexport const PaginationContext = Pagination.Context;\n\nexport const PaginationPrevTrigger = withContext(Pagination.PrevTrigger, \"prevTrigger\", { baseComponent: true });\n\nexport const PaginationNextTrigger = withContext(Pagination.NextTrigger, \"nextTrigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;AA+BA,MAAM,EAAE,cAAc,gBAAgB,mBAlBb,IAAI;CAC3B,OAAO,kBAAkB,MAAM;CAC/B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,KAAK;GACL,gBAAgB;GACjB;EACD,MAAM,EACJ,oBAAoB,gBACrB;EACD,UAAU;GACR,SAAS;GACT,YAAY;GACb;EACF;CACF,CAEwE,CAAC;AAM1E,MAAa,iBAAiB,aAAa,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,iBAAiB,YAAY,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAa,qBAAqB,YAAY,WAAW,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAa,oBAAoB,WAAW;AAE5C,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAEhH,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC"}
package/es/Popover.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Popover.mjs","names":["usePopover","_usePopover"],"sources":["../src/Popover.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Popover, popoverAnatomy, usePopover as _usePopover } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Heading, type TextProps } from \"./Text\";\n\nconst popoverRecipe = sva({\n slots: popoverAnatomy.keys(),\n base: {\n positioner: {\n maxHeight: \"inherit\",\n position: \"relative\",\n },\n content: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: \"medium\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n boxShadow: \"xlarge\",\n zIndex: \"popover\",\n maxWidth: \"var(--available-width)\",\n _open: {\n animation: \"fade-shift-in 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n arrow: {\n \"--arrow-size\": \"sizes.xxsmall\",\n \"--arrow-background\": \"colors.surface.default\",\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(popoverRecipe);\n\nexport type PopoverRootProps = Popover.RootProps;\nconst InternalPopoverRoot = withRootProvider(Popover.Root);\n\nexport const PopoverRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: PopoverRootProps) => (\n <InternalPopoverRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const PopoverAnchor = withContext(Popover.Anchor, \"anchor\", { baseComponent: true });\n\nexport const PopoverArrowStandalone = withContext(Popover.Arrow, \"arrow\", { baseComponent: true });\n\ninterface PopoverArrowProps extends Popover.ArrowTipProps, StyledProps {}\n\nexport const PopoverArrow = (props: PopoverArrowProps) => (\n <PopoverArrowStandalone>\n <PopoverArrowTip {...props} />\n </PopoverArrowStandalone>\n);\n\nexport const PopoverArrowTip = withContext(Popover.ArrowTip, \"arrowTip\", { baseComponent: true });\n\nexport const PopoverCloseTrigger = withContext(Popover.CloseTrigger, \"closeTrigger\", { baseComponent: true });\n\nexport const PopoverContentStandalone = withContext(Popover.Content, \"content\", { baseComponent: true });\n\ninterface PopoverContentProps extends Popover.ContentProps, StyledProps {}\n\nexport const PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>((props, ref) => (\n <PopoverPositioner>\n <PopoverContentStandalone {...props} ref={ref} />\n </PopoverPositioner>\n));\n\nexport const PopoverDescription = withContext(Popover.Description, \"description\", { baseComponent: true });\n\nexport const PopoverIndicator = withContext(Popover.Indicator, \"indicator\", { baseComponent: true });\n\nexport const PopoverPositioner = withContext(Popover.Positioner, \"positioner\", { baseComponent: true });\n\nconst InternalPopoverTitle = withContext(Popover.Title, \"title\", { baseComponent: true });\n\ninterface PopoverTitleProps\n extends Omit<Popover.TitleProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLHeadingElement> {}\n\nexport const PopoverTitle = ({ textStyle = \"title.medium\", children, ...rest }: PopoverTitleProps) => (\n <Heading textStyle={textStyle} {...rest} asChild consumeCss>\n <InternalPopoverTitle>{children}</InternalPopoverTitle>\n </Heading>\n);\n\nexport const PopoverTrigger = withContext(Popover.Trigger, \"trigger\", { baseComponent: true });\n\nexport const PopoverRootProvider = withRootProvider(Popover.RootProvider);\n\nexport const usePopover = _usePopover;\n"],"mappings":";;;;;;;;;;;;;;AAmDA,MAAM,EAAE,kBAAkB,gBAAgB,mBApCpB,IAAI;CACxB,OAAO,eAAe,MAAM;CAC5B,MAAM;EACJ,YAAY;GACV,WAAW;GACX,UAAU;GACX;EACD,SAAS;GACP,SAAS;GACT,eAAe;GACf,SAAS;GACT,YAAY;GACZ,cAAc;GACd,WAAW;GACX,QAAQ;GACR,UAAU;GACV,OAAO;IACL,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACD,SAAS;IACP,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACF;EACD,OAAO;GACL,gBAAgB;GAChB,sBAAsB;GACvB;EACF;CACF,CAAC,CAEyE;AAG3E,MAAM,sBAAsB,iBAAiB,QAAQ,KAAK;AAE1D,MAAa,eAAe,EAAE,YAAY,MAAM,gBAAgB,MAAM,GAAG,YACvE,oBAAC,qBAAD;CAAgC;CAA0B;CAAe,GAAI;CAAS,CAAA;AAGxF,MAAa,gBAAgB,YAAY,QAAQ,QAAQ,UAAU,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAa,yBAAyB,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAIlG,MAAa,gBAAgB,UAC3B,oBAAC,wBAAD,EAAA,UACE,oBAAC,iBAAD,EAAiB,GAAI,OAAS,CAAA,EACP,CAAA;AAG3B,MAAa,kBAAkB,YAAY,QAAQ,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEjG,MAAa,sBAAsB,YAAY,QAAQ,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAE7G,MAAa,2BAA2B,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,iBAAiB,YAAiD,OAAO,QACpF,oBAAC,mBAAD,EAAA,UACE,oBAAC,0BAAD;CAA0B,GAAI;CAAY;CAAO,CAAA,EAC/B,CAAA,CACpB;AAEF,MAAa,qBAAqB,YAAY,QAAQ,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAE1G,MAAa,mBAAmB,YAAY,QAAQ,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAEpG,MAAa,oBAAoB,YAAY,QAAQ,YAAY,cAAc,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAM,uBAAuB,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAKzF,MAAa,gBAAgB,EAAE,YAAY,gBAAgB,UAAU,GAAG,WACtE,oBAAC,SAAD;CAAoB;CAAW,GAAI;CAAM,SAAA;CAAQ,YAAA;WAC/C,oBAAC,sBAAD,EAAuB,UAAgC,CAAA;CAC/C,CAAA;AAGZ,MAAa,iBAAiB,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE9F,MAAa,sBAAsB,iBAAiB,QAAQ,aAAa;AAEzE,MAAaA,eAAaC"}
1
+ {"version":3,"file":"Popover.mjs","names":["usePopover","_usePopover"],"sources":["../src/Popover.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Popover, popoverAnatomy, usePopover as _usePopover } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Heading, type TextProps } from \"./Text\";\n\nconst popoverRecipe = sva({\n slots: popoverAnatomy.keys(),\n base: {\n positioner: {\n maxHeight: \"inherit\",\n position: \"relative\",\n },\n content: {\n display: \"flex\",\n flexDirection: \"column\",\n padding: \"medium\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n boxShadow: \"xlarge\",\n zIndex: \"popover\",\n maxWidth: \"var(--available-width)\",\n _open: {\n animation: \"fade-shift-in 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n arrow: {\n \"--arrow-size\": \"sizes.xxsmall\",\n \"--arrow-background\": \"colors.surface.default\",\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(popoverRecipe);\n\nexport type PopoverRootProps = Popover.RootProps;\nconst InternalPopoverRoot = withRootProvider(Popover.Root);\n\nexport const PopoverRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: PopoverRootProps) => (\n <InternalPopoverRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const PopoverAnchor = withContext(Popover.Anchor, \"anchor\", { baseComponent: true });\n\nexport const PopoverArrowStandalone = withContext(Popover.Arrow, \"arrow\", { baseComponent: true });\n\ninterface PopoverArrowProps extends Popover.ArrowTipProps, StyledProps {}\n\nexport const PopoverArrow = (props: PopoverArrowProps) => (\n <PopoverArrowStandalone>\n <PopoverArrowTip {...props} />\n </PopoverArrowStandalone>\n);\n\nexport const PopoverArrowTip = withContext(Popover.ArrowTip, \"arrowTip\", { baseComponent: true });\n\nexport const PopoverCloseTrigger = withContext(Popover.CloseTrigger, \"closeTrigger\", { baseComponent: true });\n\nexport const PopoverContentStandalone = withContext(Popover.Content, \"content\", { baseComponent: true });\n\ninterface PopoverContentProps extends Popover.ContentProps, StyledProps {}\n\nexport const PopoverContent = forwardRef<HTMLDivElement, PopoverContentProps>((props, ref) => (\n <PopoverPositioner>\n <PopoverContentStandalone {...props} ref={ref} />\n </PopoverPositioner>\n));\n\nexport const PopoverDescription = withContext(Popover.Description, \"description\", { baseComponent: true });\n\nexport const PopoverIndicator = withContext(Popover.Indicator, \"indicator\", { baseComponent: true });\n\nexport const PopoverPositioner = withContext(Popover.Positioner, \"positioner\", { baseComponent: true });\n\nconst InternalPopoverTitle = withContext(Popover.Title, \"title\", { baseComponent: true });\n\ninterface PopoverTitleProps\n extends Omit<Popover.TitleProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLHeadingElement> {}\n\nexport const PopoverTitle = ({ textStyle = \"title.medium\", children, ...rest }: PopoverTitleProps) => (\n <Heading textStyle={textStyle} {...rest} asChild consumeCss>\n <InternalPopoverTitle>{children}</InternalPopoverTitle>\n </Heading>\n);\n\nexport const PopoverTrigger = withContext(Popover.Trigger, \"trigger\", { baseComponent: true });\n\nexport const PopoverRootProvider = withRootProvider(Popover.RootProvider);\n\nexport const usePopover = _usePopover;\n"],"mappings":";;;;;;;;;;;;;;AAmDA,MAAM,EAAE,kBAAkB,gBAAgB,mBApCpB,IAAI;CACxB,OAAO,eAAe,MAAM;CAC5B,MAAM;EACJ,YAAY;GACV,WAAW;GACX,UAAU;GACX;EACD,SAAS;GACP,SAAS;GACT,eAAe;GACf,SAAS;GACT,YAAY;GACZ,cAAc;GACd,WAAW;GACX,QAAQ;GACR,UAAU;GACV,OAAO;IACL,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACD,SAAS;IACP,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACF;EACD,OAAO;GACL,gBAAgB;GAChB,sBAAsB;GACvB;EACF;CACF,CAEyE,CAAC;AAG3E,MAAM,sBAAsB,iBAAiB,QAAQ,KAAK;AAE1D,MAAa,eAAe,EAAE,YAAY,MAAM,gBAAgB,MAAM,GAAG,YACvE,oBAAC,qBAAD;CAAgC;CAA0B;CAAe,GAAI;CAAS,CAAA;AAGxF,MAAa,gBAAgB,YAAY,QAAQ,QAAQ,UAAU,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAa,yBAAyB,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAIlG,MAAa,gBAAgB,UAC3B,oBAAC,wBAAD,EAAA,UACE,oBAAC,iBAAD,EAAiB,GAAI,OAAS,CAAA,EACP,CAAA;AAG3B,MAAa,kBAAkB,YAAY,QAAQ,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEjG,MAAa,sBAAsB,YAAY,QAAQ,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAE7G,MAAa,2BAA2B,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,iBAAiB,YAAiD,OAAO,QACpF,oBAAC,mBAAD,EAAA,UACE,oBAAC,0BAAD;CAA0B,GAAI;CAAY;CAAO,CAAA,EAC/B,CAAA,CACpB;AAEF,MAAa,qBAAqB,YAAY,QAAQ,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAE1G,MAAa,mBAAmB,YAAY,QAAQ,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAEpG,MAAa,oBAAoB,YAAY,QAAQ,YAAY,cAAc,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAM,uBAAuB,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAKzF,MAAa,gBAAgB,EAAE,YAAY,gBAAgB,UAAU,GAAG,WACtE,oBAAC,SAAD;CAAoB;CAAW,GAAI;CAAM,SAAA;CAAQ,YAAA;WAC/C,oBAAC,sBAAD,EAAuB,UAAgC,CAAA;CAC/C,CAAA;AAGZ,MAAa,iBAAiB,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE9F,MAAa,sBAAsB,iBAAiB,QAAQ,aAAa;AAEzE,MAAaA,eAAaC"}
package/es/RadioGroup.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"RadioGroup.mjs","names":[],"sources":["../src/RadioGroup.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { ark, RadioGroup, radioGroupAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext, styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst radioGroupRecipe = sva({\n slots: radioGroupAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexWrap: \"wrap\",\n position: \"relative\",\n gap: \"small\",\n _vertical: {\n flexDirection: \"column\",\n },\n _horizontal: {\n flexDirection: \"row\",\n },\n },\n itemControl: {\n flexShrink: \"0\",\n background: \"surface.default\",\n borderColor: \"stroke.subtle\",\n borderRadius: \"full\",\n borderWidth: \"2px\",\n width: \"medium\",\n height: \"medium\",\n outlineStyle: \"solid\",\n outlineWidth: \"4px\",\n outlineOffset: \"-6px\",\n outlineColor: \"surface.default\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, border-color, box-shadow\",\n transitionTimingFunction: \"default\",\n _hover: {\n boxShadow: \"0 0 0 4px var(--shadow-color)\",\n boxShadowColor: \"surface.actionSubtle.hover.strong\",\n },\n _checked: {\n background: \"stroke.default\",\n borderColor: \"stroke.default\",\n },\n _disabled: {\n borderColor: \"stroke.disabled\",\n _hover: {\n borderColor: \"stroke.disabled\",\n boxShadow: \"none\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n item: {\n display: \"flex\",\n alignItems: \"center\",\n cursor: \"pointer\",\n gap: \"xxsmall\",\n _disabled: {\n cursor: \"not-allowed\",\n },\n \"&:has(input:focus-visible)\": {\n outline: \"2px solid\",\n outlineOffset: \"4xsmall\",\n outlineColor: \"stroke.default\",\n borderRadius: \"xsmall\",\n },\n },\n itemText: {\n _hover: {\n color: \"text.action\",\n },\n _disabled: {\n color: \"text.disabled\",\n _hover: {\n color: \"text.disabled\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(radioGroupRecipe);\n\nexport interface RadioGroupRootProps extends RadioGroup.RootProps, StyledProps {}\n\nexport const RadioGroupRoot = withProvider(RadioGroup.Root, \"root\", {\n baseComponent: true,\n});\n\nexport const RadioGroupIndicator = withContext(RadioGroup.Indicator, \"indicator\", { baseComponent: true });\n\nexport const RadioGroupItemControl = withContext(RadioGroup.ItemControl, \"itemControl\", { baseComponent: true });\n\nexport const RadioGroupItem = withContext(RadioGroup.Item, \"item\", { baseComponent: true });\n\nconst InternalRadioGroupItemText = withContext(RadioGroup.ItemText, \"itemText\");\n\nconst InnerRadioGroupItemText = styled(ark.span, {}, { baseComponent: true });\n\ninterface RadioGroupItemTextProps\n extends Omit<RadioGroup.ItemTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLParagraphElement> {}\n\nexport const RadioGroupItemText = ({\n textStyle = \"label.medium\",\n children,\n asChild,\n consumeCss,\n ...props\n}: RadioGroupItemTextProps) => (\n <InternalRadioGroupItemText asChild>\n <Text asChild consumeCss textStyle={textStyle} {...props}>\n <InnerRadioGroupItemText asChild={asChild} consumeCss={consumeCss}>\n {children}\n </InnerRadioGroupItemText>\n </Text>\n </InternalRadioGroupItemText>\n);\n\nexport const InternalRadioGroupLabel = withContext(RadioGroup.Label, \"label\");\n\nconst InnerRadioGroupLabel = styled(ark.div, {}, { baseComponent: true });\n\ninterface RadioGroupLabelProps\n extends Omit<RadioGroup.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLLabelElement> {}\n\nexport const RadioGroupLabel = forwardRef<HTMLLabelElement, RadioGroupLabelProps>(\n ({ textStyle = \"label.large\", fontWeight = \"bold\", children, asChild, consumeCss, ...props }, ref) => (\n <InternalRadioGroupLabel {...props} asChild ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild>\n <InnerRadioGroupLabel asChild={asChild} consumeCss={consumeCss}>\n {children}\n </InnerRadioGroupLabel>\n </Text>\n </InternalRadioGroupLabel>\n ),\n);\n\nexport const RadioGroupItemHiddenInput = RadioGroup.ItemHiddenInput;\n"],"mappings":";;;;;;;;;;;;;;AA8FA,MAAM,EAAE,cAAc,gBAAgB,mBA/Eb,IAAI;CAC3B,OAAO,kBAAkB,MAAM;CAC/B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,UAAU;GACV,UAAU;GACV,KAAK;GACL,WAAW,EACT,eAAe,UAChB;GACD,aAAa,EACX,eAAe,OAChB;GACF;EACD,aAAa;GACX,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,OAAO;GACP,QAAQ;GACR,cAAc;GACd,cAAc;GACd,eAAe;GACf,cAAc;GACd,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,QAAQ;IACN,WAAW;IACX,gBAAgB;IACjB;GACD,UAAU;IACR,YAAY;IACZ,aAAa;IACd;GACD,WAAW;IACT,aAAa;IACb,QAAQ;KACN,aAAa;KACb,WAAW;KACZ;IACF;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,QAAQ;GACR,KAAK;GACL,WAAW,EACT,QAAQ,eACT;GACD,8BAA8B;IAC5B,SAAS;IACT,eAAe;IACf,cAAc;IACd,cAAc;IACf;GACF;EACD,UAAU;GACR,QAAQ,EACN,OAAO,eACR;GACD,WAAW;IACT,OAAO;IACP,QAAQ,EACN,OAAO,iBACR;IACF;GACF;EACF;CACF,CAAC,CAEwE;AAI1E,MAAa,iBAAiB,aAAa,WAAW,MAAM,QAAQ,EAClE,eAAe,MAChB,CAAC;AAEF,MAAa,sBAAsB,YAAY,WAAW,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAE1G,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAEhH,MAAa,iBAAiB,YAAY,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAM,6BAA6B,YAAY,WAAW,UAAU,WAAW;AAE/E,MAAM,0BAA0B,OAAO,IAAI,MAAM,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAK7E,MAAa,sBAAsB,EACjC,YAAY,gBACZ,UACA,SACA,YACA,GAAG,YAEH,oBAAC,4BAAD;CAA4B,SAAA;WAC1B,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;EAAW,GAAI;YACjD,oBAAC,yBAAD;GAAkC;GAAqB;GACpD;GACuB,CAAA;EACrB,CAAA;CACoB,CAAA;AAG/B,MAAa,0BAA0B,YAAY,WAAW,OAAO,QAAQ;AAE7E,MAAM,uBAAuB,OAAO,IAAI,KAAK,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAKzE,MAAa,kBAAkB,YAC5B,EAAE,YAAY,eAAe,aAAa,QAAQ,UAAU,SAAS,YAAY,GAAG,SAAS,QAC5F,oBAAC,yBAAD;CAAyB,GAAI;CAAO,SAAA;CAAa;WAC/C,oBAAC,MAAD;EAAiB;EAAuB;EAAY,SAAA;YAClD,oBAAC,sBAAD;GAA+B;GAAqB;GACjD;GACoB,CAAA;EAClB,CAAA;CACiB,CAAA,CAE7B;AAED,MAAa,4BAA4B,WAAW"}
1
+ {"version":3,"file":"RadioGroup.mjs","names":[],"sources":["../src/RadioGroup.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { ark, RadioGroup, radioGroupAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext, styled } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst radioGroupRecipe = sva({\n slots: radioGroupAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexWrap: \"wrap\",\n position: \"relative\",\n gap: \"small\",\n _vertical: {\n flexDirection: \"column\",\n },\n _horizontal: {\n flexDirection: \"row\",\n },\n },\n itemControl: {\n flexShrink: \"0\",\n background: \"surface.default\",\n borderColor: \"stroke.subtle\",\n borderRadius: \"full\",\n borderWidth: \"2px\",\n width: \"medium\",\n height: \"medium\",\n outlineStyle: \"solid\",\n outlineWidth: \"4px\",\n outlineOffset: \"-6px\",\n outlineColor: \"surface.default\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, border-color, box-shadow\",\n transitionTimingFunction: \"default\",\n _hover: {\n boxShadow: \"0 0 0 4px var(--shadow-color)\",\n boxShadowColor: \"surface.actionSubtle.hover.strong\",\n },\n _checked: {\n background: \"stroke.default\",\n borderColor: \"stroke.default\",\n },\n _disabled: {\n borderColor: \"stroke.disabled\",\n _hover: {\n borderColor: \"stroke.disabled\",\n boxShadow: \"none\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n item: {\n display: \"flex\",\n alignItems: \"center\",\n cursor: \"pointer\",\n gap: \"xxsmall\",\n _disabled: {\n cursor: \"not-allowed\",\n },\n \"&:has(input:focus-visible)\": {\n outline: \"2px solid\",\n outlineOffset: \"4xsmall\",\n outlineColor: \"stroke.default\",\n borderRadius: \"xsmall\",\n },\n },\n itemText: {\n _hover: {\n color: \"text.action\",\n },\n _disabled: {\n color: \"text.disabled\",\n _hover: {\n color: \"text.disabled\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(radioGroupRecipe);\n\nexport interface RadioGroupRootProps extends RadioGroup.RootProps, StyledProps {}\n\nexport const RadioGroupRoot = withProvider(RadioGroup.Root, \"root\", {\n baseComponent: true,\n});\n\nexport const RadioGroupIndicator = withContext(RadioGroup.Indicator, \"indicator\", { baseComponent: true });\n\nexport const RadioGroupItemControl = withContext(RadioGroup.ItemControl, \"itemControl\", { baseComponent: true });\n\nexport const RadioGroupItem = withContext(RadioGroup.Item, \"item\", { baseComponent: true });\n\nconst InternalRadioGroupItemText = withContext(RadioGroup.ItemText, \"itemText\");\n\nconst InnerRadioGroupItemText = styled(ark.span, {}, { baseComponent: true });\n\ninterface RadioGroupItemTextProps\n extends Omit<RadioGroup.ItemTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLParagraphElement> {}\n\nexport const RadioGroupItemText = ({\n textStyle = \"label.medium\",\n children,\n asChild,\n consumeCss,\n ...props\n}: RadioGroupItemTextProps) => (\n <InternalRadioGroupItemText asChild>\n <Text asChild consumeCss textStyle={textStyle} {...props}>\n <InnerRadioGroupItemText asChild={asChild} consumeCss={consumeCss}>\n {children}\n </InnerRadioGroupItemText>\n </Text>\n </InternalRadioGroupItemText>\n);\n\nexport const InternalRadioGroupLabel = withContext(RadioGroup.Label, \"label\");\n\nconst InnerRadioGroupLabel = styled(ark.div, {}, { baseComponent: true });\n\ninterface RadioGroupLabelProps\n extends Omit<RadioGroup.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLLabelElement> {}\n\nexport const RadioGroupLabel = forwardRef<HTMLLabelElement, RadioGroupLabelProps>(\n ({ textStyle = \"label.large\", fontWeight = \"bold\", children, asChild, consumeCss, ...props }, ref) => (\n <InternalRadioGroupLabel {...props} asChild ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild>\n <InnerRadioGroupLabel asChild={asChild} consumeCss={consumeCss}>\n {children}\n </InnerRadioGroupLabel>\n </Text>\n </InternalRadioGroupLabel>\n ),\n);\n\nexport const RadioGroupItemHiddenInput = RadioGroup.ItemHiddenInput;\n"],"mappings":";;;;;;;;;;;;;;AA8FA,MAAM,EAAE,cAAc,gBAAgB,mBA/Eb,IAAI;CAC3B,OAAO,kBAAkB,MAAM;CAC/B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,UAAU;GACV,UAAU;GACV,KAAK;GACL,WAAW,EACT,eAAe,UAChB;GACD,aAAa,EACX,eAAe,OAChB;GACF;EACD,aAAa;GACX,YAAY;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,OAAO;GACP,QAAQ;GACR,cAAc;GACd,cAAc;GACd,eAAe;GACf,cAAc;GACd,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,QAAQ;IACN,WAAW;IACX,gBAAgB;IACjB;GACD,UAAU;IACR,YAAY;IACZ,aAAa;IACd;GACD,WAAW;IACT,aAAa;IACb,QAAQ;KACN,aAAa;KACb,WAAW;KACZ;IACF;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,QAAQ;GACR,KAAK;GACL,WAAW,EACT,QAAQ,eACT;GACD,8BAA8B;IAC5B,SAAS;IACT,eAAe;IACf,cAAc;IACd,cAAc;IACf;GACF;EACD,UAAU;GACR,QAAQ,EACN,OAAO,eACR;GACD,WAAW;IACT,OAAO;IACP,QAAQ,EACN,OAAO,iBACR;IACF;GACF;EACF;CACF,CAEwE,CAAC;AAI1E,MAAa,iBAAiB,aAAa,WAAW,MAAM,QAAQ,EAClE,eAAe,MAChB,CAAC;AAEF,MAAa,sBAAsB,YAAY,WAAW,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAE1G,MAAa,wBAAwB,YAAY,WAAW,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAEhH,MAAa,iBAAiB,YAAY,WAAW,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAE3F,MAAM,6BAA6B,YAAY,WAAW,UAAU,WAAW;AAE/E,MAAM,0BAA0B,OAAO,IAAI,MAAM,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAK7E,MAAa,sBAAsB,EACjC,YAAY,gBACZ,UACA,SACA,YACA,GAAG,YAEH,oBAAC,4BAAD;CAA4B,SAAA;WAC1B,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;EAAW,GAAI;YACjD,oBAAC,yBAAD;GAAkC;GAAqB;GACpD;GACuB,CAAA;EACrB,CAAA;CACoB,CAAA;AAG/B,MAAa,0BAA0B,YAAY,WAAW,OAAO,QAAQ;AAE7E,MAAM,uBAAuB,OAAO,IAAI,KAAK,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAKzE,MAAa,kBAAkB,YAC5B,EAAE,YAAY,eAAe,aAAa,QAAQ,UAAU,SAAS,YAAY,GAAG,SAAS,QAC5F,oBAAC,yBAAD;CAAyB,GAAI;CAAO,SAAA;CAAa;WAC/C,oBAAC,MAAD;EAAiB;EAAuB;EAAY,SAAA;YAClD,oBAAC,sBAAD;GAA+B;GAAqB;GACjD;GACoB,CAAA;EAClB,CAAA;CACiB,CAAA,CAE7B;AAED,MAAa,4BAA4B,WAAW"}
package/es/Select.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Select.mjs","names":[],"sources":["../src/Select.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Select, selectAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type ElementType, type RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst selectRecipe = sva({\n slots: selectAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n control: {\n display: \"flex\",\n gap: \"4xsmall\",\n alignItems: \"center\",\n },\n content: {\n display: \"flex\",\n gap: \"4xsmall\",\n flexDirection: \"column\",\n zIndex: \"dropdown\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n boxShadow: \"large\",\n padding: \"xsmall\",\n overflowY: \"auto\",\n maxHeight: \"min(token(spacing.surface.xsmall), 45vh)\",\n _focusVisible: {\n outlineOffset: \"-1\",\n },\n _open: {\n animation: \"fade-shift-in 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n item: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n padding: \"xsmall\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n cursor: \"pointer\",\n transitionDuration: \"fast\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n _hover: {\n background: \"surface.hover\",\n },\n _highlighted: {\n background: \"surface.hover\",\n },\n },\n _highlighted: {\n background: \"surface.hover\",\n _hover: {\n background: \"surface.hover\",\n },\n },\n _disabled: {\n cursor: \"not-allowed\",\n color: \"text.disabled\",\n background: \"surface.disabled\",\n _highlighted: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n _selected: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n _hover: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n },\n },\n indicator: {\n color: \"icon.default\",\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(180deg)\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n itemIndicator: {\n color: \"stroke.default\",\n },\n itemText: {\n _checked: {\n textDecoration: \"underline\",\n },\n _highlighted: {\n textDecoration: \"underline\",\n },\n },\n trigger: {\n justifyContent: \"space-between\",\n width: \"surface.small\",\n _ariaInvalid: {\n boxShadowColor: \"stroke.error\",\n },\n },\n itemGroup: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"4xsmall\",\n },\n valueText: {\n textAlign: \"start\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(selectRecipe);\n\nexport interface SelectRootProps<T extends Select.CollectionItem>\n extends Select.RootProps<T>, StyledProps, RefAttributes<HTMLDivElement> {}\nconst InternalSelectRoot = withProvider<ElementType<SelectRootProps<Select.CollectionItem>>>(Select.Root, \"root\", {\n baseComponent: true,\n});\n\nexport const SelectRoot = <T extends Select.CollectionItem>({\n lazyMount = true,\n unmountOnExit = true,\n ...props\n}: SelectRootProps<T>) => <InternalSelectRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />;\n\nexport const SelectClearTrigger = withContext(Select.ClearTrigger, \"clearTrigger\", { baseComponent: true });\n\nexport const SelectContentStandalone = withContext(Select.Content, \"content\", { baseComponent: true });\n\ninterface SelectContentProps extends Select.ContentProps, StyledProps {}\n\nexport const SelectContent = forwardRef<HTMLDivElement, SelectContentProps>((props, ref) => (\n <SelectPositioner>\n <SelectContentStandalone ref={ref} {...props} />\n </SelectPositioner>\n));\n\nexport const SelectControl = withContext(Select.Control, \"control\", { baseComponent: true });\n\nexport const SelectIndicator = withContext(Select.Indicator, \"indicator\", { baseComponent: true });\n\ninterface SelectItemGroupLabelProps\n extends Omit<Select.ItemGroupLabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLDivElement> {}\n\nexport const SelectItemGroupLabel = forwardRef<HTMLDivElement, SelectItemGroupLabelProps>(\n ({ children, ...props }, ref) => (\n <InternalSelectItemGroupLabel asChild ref={ref} {...props}>\n <Label asChild consumeCss>\n <div>{children}</div>\n </Label>\n </InternalSelectItemGroupLabel>\n ),\n);\n\nconst InternalSelectItemGroupLabel = withContext(Select.ItemGroupLabel, \"itemGroupLabel\");\n\nexport const SelectItemGroup = withContext(Select.ItemGroup, \"itemGroup\", { baseComponent: true });\n\nexport const SelectItemIndicator = withContext(Select.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport const SelectItem = withContext(Select.Item, \"item\", {\n baseComponent: true,\n});\n\nexport const SelectItemText = withContext(Select.ItemText, \"itemText\", { baseComponent: true });\n\nconst InternalSelectLabel = withContext(Select.Label, \"label\");\n\ninterface SelectLabelProps\n extends Omit<Select.LabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLLabelElement> {}\n\nexport const SelectLabel = forwardRef<HTMLLabelElement, SelectLabelProps>(({ children, ...props }, ref) => (\n <InternalSelectLabel asChild ref={ref} {...props}>\n <Label>{children}</Label>\n </InternalSelectLabel>\n));\n\nexport const SelectPositioner = withContext(Select.Positioner, \"positioner\", { baseComponent: true });\n\nexport const SelectTrigger = withContext(Select.Trigger, \"trigger\", { baseComponent: true });\n\nexport const SelectValueText = withContext(Select.ValueText, \"valueText\", { baseComponent: true });\n\nexport const SelectList = withContext(Select.List, \"list\", {\n baseComponent: true,\n});\n\nexport const SelectHiddenSelect = Select.HiddenSelect;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Select.mjs","names":[],"sources":["../src/Select.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Select, selectAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type ElementType, type RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst selectRecipe = sva({\n slots: selectAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n control: {\n display: \"flex\",\n gap: \"4xsmall\",\n alignItems: \"center\",\n },\n content: {\n display: \"flex\",\n gap: \"4xsmall\",\n flexDirection: \"column\",\n zIndex: \"dropdown\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n boxShadow: \"large\",\n padding: \"xsmall\",\n overflowY: \"auto\",\n maxHeight: \"min(token(spacing.surface.xsmall), 45vh)\",\n _focusVisible: {\n outlineOffset: \"-1\",\n },\n _open: {\n animation: \"fade-shift-in 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.25s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n item: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n padding: \"xsmall\",\n background: \"surface.default\",\n borderRadius: \"xsmall\",\n cursor: \"pointer\",\n transitionDuration: \"fast\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n _hover: {\n background: \"surface.hover\",\n },\n _highlighted: {\n background: \"surface.hover\",\n },\n },\n _highlighted: {\n background: \"surface.hover\",\n _hover: {\n background: \"surface.hover\",\n },\n },\n _disabled: {\n cursor: \"not-allowed\",\n color: \"text.disabled\",\n background: \"surface.disabled\",\n _highlighted: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n _selected: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n _hover: {\n color: \"text.disabled\",\n background: \"surface.disabled\",\n },\n },\n },\n indicator: {\n color: \"icon.default\",\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(180deg)\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n itemIndicator: {\n color: \"stroke.default\",\n },\n itemText: {\n _checked: {\n textDecoration: \"underline\",\n },\n _highlighted: {\n textDecoration: \"underline\",\n },\n },\n trigger: {\n justifyContent: \"space-between\",\n width: \"surface.small\",\n _ariaInvalid: {\n boxShadowColor: \"stroke.error\",\n },\n },\n itemGroup: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"4xsmall\",\n },\n valueText: {\n textAlign: \"start\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(selectRecipe);\n\nexport interface SelectRootProps<T extends Select.CollectionItem>\n extends Select.RootProps<T>, StyledProps, RefAttributes<HTMLDivElement> {}\nconst InternalSelectRoot = withProvider<ElementType<SelectRootProps<Select.CollectionItem>>>(Select.Root, \"root\", {\n baseComponent: true,\n});\n\nexport const SelectRoot = <T extends Select.CollectionItem>({\n lazyMount = true,\n unmountOnExit = true,\n ...props\n}: SelectRootProps<T>) => <InternalSelectRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />;\n\nexport const SelectClearTrigger = withContext(Select.ClearTrigger, \"clearTrigger\", { baseComponent: true });\n\nexport const SelectContentStandalone = withContext(Select.Content, \"content\", { baseComponent: true });\n\ninterface SelectContentProps extends Select.ContentProps, StyledProps {}\n\nexport const SelectContent = forwardRef<HTMLDivElement, SelectContentProps>((props, ref) => (\n <SelectPositioner>\n <SelectContentStandalone ref={ref} {...props} />\n </SelectPositioner>\n));\n\nexport const SelectControl = withContext(Select.Control, \"control\", { baseComponent: true });\n\nexport const SelectIndicator = withContext(Select.Indicator, \"indicator\", { baseComponent: true });\n\ninterface SelectItemGroupLabelProps\n extends Omit<Select.ItemGroupLabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLDivElement> {}\n\nexport const SelectItemGroupLabel = forwardRef<HTMLDivElement, SelectItemGroupLabelProps>(\n ({ children, ...props }, ref) => (\n <InternalSelectItemGroupLabel asChild ref={ref} {...props}>\n <Label asChild consumeCss>\n <div>{children}</div>\n </Label>\n </InternalSelectItemGroupLabel>\n ),\n);\n\nconst InternalSelectItemGroupLabel = withContext(Select.ItemGroupLabel, \"itemGroupLabel\");\n\nexport const SelectItemGroup = withContext(Select.ItemGroup, \"itemGroup\", { baseComponent: true });\n\nexport const SelectItemIndicator = withContext(Select.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport const SelectItem = withContext(Select.Item, \"item\", {\n baseComponent: true,\n});\n\nexport const SelectItemText = withContext(Select.ItemText, \"itemText\", { baseComponent: true });\n\nconst InternalSelectLabel = withContext(Select.Label, \"label\");\n\ninterface SelectLabelProps\n extends Omit<Select.LabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLLabelElement> {}\n\nexport const SelectLabel = forwardRef<HTMLLabelElement, SelectLabelProps>(({ children, ...props }, ref) => (\n <InternalSelectLabel asChild ref={ref} {...props}>\n <Label>{children}</Label>\n </InternalSelectLabel>\n));\n\nexport const SelectPositioner = withContext(Select.Positioner, \"positioner\", { baseComponent: true });\n\nexport const SelectTrigger = withContext(Select.Trigger, \"trigger\", { baseComponent: true });\n\nexport const SelectValueText = withContext(Select.ValueText, \"valueText\", { baseComponent: true });\n\nexport const SelectList = withContext(Select.List, \"list\", {\n baseComponent: true,\n});\n\nexport const SelectHiddenSelect = Select.HiddenSelect;\n"],"mappings":"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"}
package/es/Slider.mjs CHANGED
@@ -22,6 +22,7 @@ const { withProvider, withContext } = createStyleContext(sva({
22
22
  },
23
23
  control: {
24
24
  position: "relative",
25
+ cursor: "pointer",
25
26
  display: "flex",
26
27
  _vertical: { flexDirection: "column" },
27
28
  alignItems: "center",
package/es/Slider.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Slider.mjs","names":[],"sources":["../src/Slider.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Slider, sliderAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst sliderRecipe = sva({\n slots: sliderAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"4xsmall\",\n width: \"100%\",\n },\n control: {\n position: \"relative\",\n display: \"flex\",\n _vertical: {\n flexDirection: \"column\",\n },\n alignItems: \"center\",\n height: \"medium\",\n },\n track: {\n background: \"surface.disabled\",\n overflow: \"hidden\",\n flex: \"1\",\n _vertical: {\n width: \"4xsmall\",\n },\n _horizontal: {\n height: \"4xsmall\",\n },\n },\n range: {\n background: \"surface.action\",\n _vertical: {\n width: \"4xsmall\",\n },\n _horizontal: {\n height: \"4xsmall\",\n },\n },\n thumb: {\n background: \"surface.action\",\n borderRadius: \"full\",\n outline: \"none\",\n zIndex: \"1\",\n height: \"medium\",\n width: \"medium\",\n transitionDuration: \"fast\",\n transitionTimingFunction: \"default\",\n transitionProperty: \"background\",\n _hover: {\n background: \"surface.action.hover\",\n },\n _active: {\n background: \"surface.action.active\",\n },\n _focusVisible: {\n border: \"2px solid\",\n borderColor: \"background.default\",\n outline: \"3px solid\",\n outlineColor: \"surface.action\",\n outlineOffset: \"0px\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(sliderRecipe);\n\nexport interface SliderRootProps extends Slider.RootProps, StyledProps {}\n\nexport const SliderRoot = withProvider(Slider.Root, \"root\", { baseComponent: true });\n\nexport const SliderControl = withContext(Slider.Control, \"control\", { baseComponent: true });\n\nexport const SliderTrack = withContext(Slider.Track, \"track\", { baseComponent: true });\n\nexport const SliderRange = withContext(Slider.Range, \"range\", { baseComponent: true });\n\nexport const SliderThumb = withContext(Slider.Thumb, \"thumb\", { baseComponent: true });\n\nconst InternalSliderLabel = withContext(Slider.Label, \"label\");\n\ninterface SliderLabelProps\n extends Omit<Slider.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLLabelElement> {}\n\nexport const SliderLabel = ({ textStyle = \"label.medium\", ...props }: SliderLabelProps) => (\n <InternalSliderLabel asChild>\n <Label textStyle={textStyle} {...props} />\n </InternalSliderLabel>\n);\n\nexport const SliderHiddenInput = Slider.HiddenInput;\n"],"mappings":";;;;;;;;;;;;;AAqFA,MAAM,EAAE,cAAc,gBAAgB,mBArEjB,IAAI;CACvB,OAAO,cAAc,MAAM;CAC3B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;GACR;EACD,SAAS;GACP,UAAU;GACV,SAAS;GACT,WAAW,EACT,eAAe,UAChB;GACD,YAAY;GACZ,QAAQ;GACT;EACD,OAAO;GACL,YAAY;GACZ,UAAU;GACV,MAAM;GACN,WAAW,EACT,OAAO,WACR;GACD,aAAa,EACX,QAAQ,WACT;GACF;EACD,OAAO;GACL,YAAY;GACZ,WAAW,EACT,OAAO,WACR;GACD,aAAa,EACX,QAAQ,WACT;GACF;EACD,OAAO;GACL,YAAY;GACZ,cAAc;GACd,SAAS;GACT,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,oBAAoB;GACpB,0BAA0B;GAC1B,oBAAoB;GACpB,QAAQ,EACN,YAAY,wBACb;GACD,SAAS,EACP,YAAY,yBACb;GACD,eAAe;IACb,QAAQ;IACR,aAAa;IACb,SAAS;IACT,cAAc;IACd,eAAe;IAChB;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACF;CACF,CAAC,CAEoE;AAItE,MAAa,aAAa,aAAa,OAAO,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEpF,MAAa,gBAAgB,YAAY,OAAO,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAM,sBAAsB,YAAY,OAAO,OAAO,QAAQ;AAK9D,MAAa,eAAe,EAAE,YAAY,gBAAgB,GAAG,YAC3D,oBAAC,qBAAD;CAAqB,SAAA;WACnB,oBAAC,OAAD;EAAkB;EAAW,GAAI;EAAS,CAAA;CACtB,CAAA;AAGxB,MAAa,oBAAoB,OAAO"}
1
+ {"version":3,"file":"Slider.mjs","names":[],"sources":["../src/Slider.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Slider, sliderAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst sliderRecipe = sva({\n slots: sliderAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"4xsmall\",\n width: \"100%\",\n },\n control: {\n position: \"relative\",\n cursor: \"pointer\",\n display: \"flex\",\n _vertical: {\n flexDirection: \"column\",\n },\n alignItems: \"center\",\n height: \"medium\",\n },\n track: {\n background: \"surface.disabled\",\n overflow: \"hidden\",\n flex: \"1\",\n _vertical: {\n width: \"4xsmall\",\n },\n _horizontal: {\n height: \"4xsmall\",\n },\n },\n range: {\n background: \"surface.action\",\n _vertical: {\n width: \"4xsmall\",\n },\n _horizontal: {\n height: \"4xsmall\",\n },\n },\n thumb: {\n background: \"surface.action\",\n borderRadius: \"full\",\n outline: \"none\",\n zIndex: \"1\",\n height: \"medium\",\n width: \"medium\",\n transitionDuration: \"fast\",\n transitionTimingFunction: \"default\",\n transitionProperty: \"background\",\n _hover: {\n background: \"surface.action.hover\",\n },\n _active: {\n background: \"surface.action.active\",\n },\n _focusVisible: {\n border: \"2px solid\",\n borderColor: \"background.default\",\n outline: \"3px solid\",\n outlineColor: \"surface.action\",\n outlineOffset: \"0px\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(sliderRecipe);\n\nexport interface SliderRootProps extends Slider.RootProps, StyledProps {}\n\nexport const SliderRoot = withProvider(Slider.Root, \"root\", { baseComponent: true });\n\nexport const SliderControl = withContext(Slider.Control, \"control\", { baseComponent: true });\n\nexport const SliderTrack = withContext(Slider.Track, \"track\", { baseComponent: true });\n\nexport const SliderRange = withContext(Slider.Range, \"range\", { baseComponent: true });\n\nexport const SliderThumb = withContext(Slider.Thumb, \"thumb\", { baseComponent: true });\n\nconst InternalSliderLabel = withContext(Slider.Label, \"label\");\n\ninterface SliderLabelProps\n extends Omit<Slider.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLLabelElement> {}\n\nexport const SliderLabel = ({ textStyle = \"label.medium\", ...props }: SliderLabelProps) => (\n <InternalSliderLabel asChild>\n <Label textStyle={textStyle} {...props} />\n </InternalSliderLabel>\n);\n\nexport const SliderHiddenInput = Slider.HiddenInput;\n"],"mappings":";;;;;;;;;;;;;AAsFA,MAAM,EAAE,cAAc,gBAAgB,mBAtEjB,IAAI;CACvB,OAAO,cAAc,MAAM;CAC3B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;GACR;EACD,SAAS;GACP,UAAU;GACV,QAAQ;GACR,SAAS;GACT,WAAW,EACT,eAAe,UAChB;GACD,YAAY;GACZ,QAAQ;GACT;EACD,OAAO;GACL,YAAY;GACZ,UAAU;GACV,MAAM;GACN,WAAW,EACT,OAAO,WACR;GACD,aAAa,EACX,QAAQ,WACT;GACF;EACD,OAAO;GACL,YAAY;GACZ,WAAW,EACT,OAAO,WACR;GACD,aAAa,EACX,QAAQ,WACT;GACF;EACD,OAAO;GACL,YAAY;GACZ,cAAc;GACd,SAAS;GACT,QAAQ;GACR,QAAQ;GACR,OAAO;GACP,oBAAoB;GACpB,0BAA0B;GAC1B,oBAAoB;GACpB,QAAQ,EACN,YAAY,wBACb;GACD,SAAS,EACP,YAAY,yBACb;GACD,eAAe;IACb,QAAQ;IACR,aAAa;IACb,SAAS;IACT,cAAc;IACd,eAAe;IAChB;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACF;CACF,CAEoE,CAAC;AAItE,MAAa,aAAa,aAAa,OAAO,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEpF,MAAa,gBAAgB,YAAY,OAAO,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAM,sBAAsB,YAAY,OAAO,OAAO,QAAQ;AAK9D,MAAa,eAAe,EAAE,YAAY,gBAAgB,GAAG,YAC3D,oBAAC,qBAAD;CAAqB,SAAA;WACnB,oBAAC,OAAD;EAAkB;EAAW,GAAI;EAAS,CAAA;CACtB,CAAA;AAGxB,MAAa,oBAAoB,OAAO"}
package/es/Switch.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.mjs","names":[],"sources":["../src/Switch.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Switch, switchAnatomy } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst switchRecipe = sva({\n slots: switchAnatomy.keys(),\n base: {\n root: {\n display: \"inline-flex\",\n alignItems: \"center\",\n position: \"relative\",\n gap: \"xxsmall\",\n _focus: {\n outline: \"2px solid\",\n outlineOffset: \"4xsmall\",\n outlineColor: \"stroke.default\",\n borderRadius: \"xsmall\",\n },\n },\n control: {\n display: \"inline-flex\",\n alignItems: \"center\",\n background: \"surface.disabled.strong\",\n width: \"xxlarge\",\n padding: \"1\",\n borderRadius: \"medium\",\n cursor: \"pointer\",\n flexShrink: \"0\",\n transitionDuration: \"fast\",\n transitionProperty: \"background\",\n transitionTimingFunction: \"default\",\n _checked: {\n background: \"surface.action.active\",\n },\n _disabled: {\n background: \"surface.disabled\",\n cursor: \"not-allowed\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n thumb: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n background: \"icon.onAction\",\n borderRadius: \"full\",\n boxShadow: \"small\",\n transitionDuration: \"fast\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n width: \"10\",\n height: \"10\",\n textStyle: \"label.xsmall\",\n fontWeight: \"bold\",\n _hover: {\n transform: \"translateX(20%)\",\n _disabled: {\n transform: \"translateX(0)\",\n },\n _motionReduce: {\n transform: \"translateX(0)\",\n },\n },\n _checked: {\n transform: \"translateX(120%)\",\n _hover: {\n transform: \"translateX(100%)\",\n _disabled: {\n transform: \"translateX(120%)\",\n },\n _motionReduce: {\n transform: \"translateX(120%)\",\n },\n },\n },\n },\n label: {\n color: \"text.strong\",\n transitionDuration: \"fast\",\n transitionProperty: \"color\",\n transitionTimingFunction: \"default\",\n _hover: {\n color: \"text.action\",\n },\n _disabled: {\n color: \"text.disabled\",\n _hover: {\n color: \"text.disabled\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(switchRecipe);\n\nexport type SwitchVariantProps = NonNullable<RecipeVariantProps<typeof switchRecipe>>;\n\nexport interface SwitchRootProps extends Switch.RootProps, StyledProps, SwitchVariantProps {}\n\nexport const SwitchRoot = withProvider(Switch.Root, \"root\", { baseComponent: true });\n\nexport const SwitchControl = withContext(Switch.Control, \"control\", { baseComponent: true });\n\nexport const SwitchThumb = withContext(Switch.Thumb, \"thumb\", { baseComponent: true });\n\nconst InternalSwitchLabel = withContext(Switch.Label, \"label\");\n\ninterface SwitchLabelProps\n extends Omit<Switch.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLSpanElement> {}\n\nexport const SwitchLabel = ({ textStyle = \"label.medium\", children, ...props }: SwitchLabelProps) => (\n <InternalSwitchLabel asChild {...props}>\n <Text asChild consumeCss textStyle={textStyle}>\n <span>{children}</span>\n </Text>\n </InternalSwitchLabel>\n);\n\nexport const SwitchHiddenInput = Switch.HiddenInput;\n"],"mappings":";;;;;;;;;;;;;AAgHA,MAAM,EAAE,cAAc,gBAAgB,mBAjGjB,IAAI;CACvB,OAAO,cAAc,MAAM;CAC3B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,UAAU;GACV,KAAK;GACL,QAAQ;IACN,SAAS;IACT,eAAe;IACf,cAAc;IACd,cAAc;IACf;GACF;EACD,SAAS;GACP,SAAS;GACT,YAAY;GACZ,YAAY;GACZ,OAAO;GACP,SAAS;GACT,cAAc;GACd,QAAQ;GACR,YAAY;GACZ,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,UAAU,EACR,YAAY,yBACb;GACD,WAAW;IACT,YAAY;IACZ,QAAQ;IACT;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,OAAO;GACL,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,YAAY;GACZ,cAAc;GACd,WAAW;GACX,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,OAAO;GACP,QAAQ;GACR,WAAW;GACX,YAAY;GACZ,QAAQ;IACN,WAAW;IACX,WAAW,EACT,WAAW,iBACZ;IACD,eAAe,EACb,WAAW,iBACZ;IACF;GACD,UAAU;IACR,WAAW;IACX,QAAQ;KACN,WAAW;KACX,WAAW,EACT,WAAW,oBACZ;KACD,eAAe,EACb,WAAW,oBACZ;KACF;IACF;GACF;EACD,OAAO;GACL,OAAO;GACP,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,QAAQ,EACN,OAAO,eACR;GACD,WAAW;IACT,OAAO;IACP,QAAQ,EACN,OAAO,iBACR;IACF;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACF;CACF,CAAC,CAEoE;AAMtE,MAAa,aAAa,aAAa,OAAO,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEpF,MAAa,gBAAgB,YAAY,OAAO,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAM,sBAAsB,YAAY,OAAO,OAAO,QAAQ;AAK9D,MAAa,eAAe,EAAE,YAAY,gBAAgB,UAAU,GAAG,YACrE,oBAAC,qBAAD;CAAqB,SAAA;CAAQ,GAAI;WAC/B,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;YAClC,oBAAC,QAAD,EAAO,UAAgB,CAAA;EAClB,CAAA;CACa,CAAA;AAGxB,MAAa,oBAAoB,OAAO"}
1
+ {"version":3,"file":"Switch.mjs","names":[],"sources":["../src/Switch.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Switch, switchAnatomy } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst switchRecipe = sva({\n slots: switchAnatomy.keys(),\n base: {\n root: {\n display: \"inline-flex\",\n alignItems: \"center\",\n position: \"relative\",\n gap: \"xxsmall\",\n _focus: {\n outline: \"2px solid\",\n outlineOffset: \"4xsmall\",\n outlineColor: \"stroke.default\",\n borderRadius: \"xsmall\",\n },\n },\n control: {\n display: \"inline-flex\",\n alignItems: \"center\",\n background: \"surface.disabled.strong\",\n width: \"xxlarge\",\n padding: \"1\",\n borderRadius: \"medium\",\n cursor: \"pointer\",\n flexShrink: \"0\",\n transitionDuration: \"fast\",\n transitionProperty: \"background\",\n transitionTimingFunction: \"default\",\n _checked: {\n background: \"surface.action.active\",\n },\n _disabled: {\n background: \"surface.disabled\",\n cursor: \"not-allowed\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n thumb: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n background: \"icon.onAction\",\n borderRadius: \"full\",\n boxShadow: \"small\",\n transitionDuration: \"fast\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n width: \"10\",\n height: \"10\",\n textStyle: \"label.xsmall\",\n fontWeight: \"bold\",\n _hover: {\n transform: \"translateX(20%)\",\n _disabled: {\n transform: \"translateX(0)\",\n },\n _motionReduce: {\n transform: \"translateX(0)\",\n },\n },\n _checked: {\n transform: \"translateX(120%)\",\n _hover: {\n transform: \"translateX(100%)\",\n _disabled: {\n transform: \"translateX(120%)\",\n },\n _motionReduce: {\n transform: \"translateX(120%)\",\n },\n },\n },\n },\n label: {\n color: \"text.strong\",\n transitionDuration: \"fast\",\n transitionProperty: \"color\",\n transitionTimingFunction: \"default\",\n _hover: {\n color: \"text.action\",\n },\n _disabled: {\n color: \"text.disabled\",\n _hover: {\n color: \"text.disabled\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(switchRecipe);\n\nexport type SwitchVariantProps = NonNullable<RecipeVariantProps<typeof switchRecipe>>;\n\nexport interface SwitchRootProps extends Switch.RootProps, StyledProps, SwitchVariantProps {}\n\nexport const SwitchRoot = withProvider(Switch.Root, \"root\", { baseComponent: true });\n\nexport const SwitchControl = withContext(Switch.Control, \"control\", { baseComponent: true });\n\nexport const SwitchThumb = withContext(Switch.Thumb, \"thumb\", { baseComponent: true });\n\nconst InternalSwitchLabel = withContext(Switch.Label, \"label\");\n\ninterface SwitchLabelProps\n extends Omit<Switch.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLSpanElement> {}\n\nexport const SwitchLabel = ({ textStyle = \"label.medium\", children, ...props }: SwitchLabelProps) => (\n <InternalSwitchLabel asChild {...props}>\n <Text asChild consumeCss textStyle={textStyle}>\n <span>{children}</span>\n </Text>\n </InternalSwitchLabel>\n);\n\nexport const SwitchHiddenInput = Switch.HiddenInput;\n"],"mappings":";;;;;;;;;;;;;AAgHA,MAAM,EAAE,cAAc,gBAAgB,mBAjGjB,IAAI;CACvB,OAAO,cAAc,MAAM;CAC3B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,YAAY;GACZ,UAAU;GACV,KAAK;GACL,QAAQ;IACN,SAAS;IACT,eAAe;IACf,cAAc;IACd,cAAc;IACf;GACF;EACD,SAAS;GACP,SAAS;GACT,YAAY;GACZ,YAAY;GACZ,OAAO;GACP,SAAS;GACT,cAAc;GACd,QAAQ;GACR,YAAY;GACZ,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,UAAU,EACR,YAAY,yBACb;GACD,WAAW;IACT,YAAY;IACZ,QAAQ;IACT;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,OAAO;GACL,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,YAAY;GACZ,cAAc;GACd,WAAW;GACX,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,OAAO;GACP,QAAQ;GACR,WAAW;GACX,YAAY;GACZ,QAAQ;IACN,WAAW;IACX,WAAW,EACT,WAAW,iBACZ;IACD,eAAe,EACb,WAAW,iBACZ;IACF;GACD,UAAU;IACR,WAAW;IACX,QAAQ;KACN,WAAW;KACX,WAAW,EACT,WAAW,oBACZ;KACD,eAAe,EACb,WAAW,oBACZ;KACF;IACF;GACF;EACD,OAAO;GACL,OAAO;GACP,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,QAAQ,EACN,OAAO,eACR;GACD,WAAW;IACT,OAAO;IACP,QAAQ,EACN,OAAO,iBACR;IACF;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACF;CACF,CAEoE,CAAC;AAMtE,MAAa,aAAa,aAAa,OAAO,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEpF,MAAa,gBAAgB,YAAY,OAAO,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAE5F,MAAa,cAAc,YAAY,OAAO,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAEtF,MAAM,sBAAsB,YAAY,OAAO,OAAO,QAAQ;AAK9D,MAAa,eAAe,EAAE,YAAY,gBAAgB,UAAU,GAAG,YACrE,oBAAC,qBAAD;CAAqB,SAAA;CAAQ,GAAI;WAC/B,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;YAClC,oBAAC,QAAD,EAAO,UAAgB,CAAA;EAClB,CAAA;CACa,CAAA;AAGxB,MAAa,oBAAoB,OAAO"}
package/es/Tabs.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.mjs","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Tabs } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, cx, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\n\nconst tabsRecipe = sva({\n // TODO: This still doesn't work. Need to figure out why we need to pass keys manually.\n // slots: tabsAnatomy.keys(),\n slots: [\"root\", \"list\", \"trigger\", \"content\", \"indicator\"],\n base: {\n root: {\n position: \"relative\",\n display: \"flex\",\n width: \"100%\",\n _horizontal: {\n flexDirection: \"column\",\n },\n _vertical: {\n flexDirection: \"row\",\n },\n },\n list: {\n position: \"relative\",\n display: \"flex\",\n flexShrink: \"0\",\n flexWrap: \"wrap\",\n _horizontal: {\n flexDirection: \"row\",\n },\n _vertical: {\n flexDirection: \"column\",\n },\n },\n trigger: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n flexShrink: \"0\",\n cursor: \"pointer\",\n textStyle: \"label.small\",\n fontWeight: \"bold\",\n transitionDuration: \"normal\",\n transitionProperty: \"color, background, border-color\",\n transitionTimingFunction: \"default\",\n whiteSpace: \"nowrap\",\n paddingInline: \"small\",\n paddingBlock: \"3xsmall\",\n zIndex: \"1\",\n _hover: {\n color: \"text.action\",\n },\n _selected: {\n color: \"text.strong\",\n },\n _disabled: {\n color: \"text.subtle\",\n cursor: \"not-allowed\",\n _hover: {\n color: \"text.subtle\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n content: {\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n gap: \"xsmall\",\n },\n },\n defaultVariants: {\n variant: \"line\",\n },\n variants: {\n variant: {\n line: {\n trigger: {\n borderColor: \"stroke.default\",\n _hover: {\n borderColor: \"stroke.hover\",\n _focusVisible: {\n borderColor: \"stroke.default\",\n },\n },\n _horizontal: {\n borderBottom: \"1px solid\",\n },\n _disabled: {\n borderColor: \"stroke.default\",\n _hover: {\n borderColor: \"stroke.default\",\n },\n },\n _vertical: {\n borderLeft: \"1px solid\",\n justifyContent: \"flex-start\",\n },\n _focusVisible: {\n outline: \"none\",\n borderRadius: \"unset\",\n },\n },\n indicator: {\n background: \"stroke.default\",\n _peerFocusVisible: {\n height: \"var(--height)\",\n width: \"var(--width)\",\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n background: \"transparent\",\n _horizontal: {\n borderTopRadius: \"xsmall\",\n },\n _vertical: {\n borderRightRadius: \"xsmall\",\n },\n },\n _horizontal: {\n top: \"calc(var(--top) + var(--height) - 6px)\",\n height: \"3\",\n width: \"var(--width)\",\n _peerFocusVisible: { top: \"var(--top)\" },\n },\n _vertical: {\n height: \"var(--height)\",\n left: \"0\",\n width: \"3\",\n },\n },\n content: {\n zIndex: \"1\",\n _horizontal: {\n paddingBlockStart: \"xsmall\",\n },\n _vertical: {\n paddingInlineStart: \"xsmall\",\n },\n _focusVisible: {\n outline: \"none\",\n boxShadow: \"0 0 0 3px var(--shadow-color)\",\n boxShadowColor: \"stroke.default\",\n },\n },\n },\n outline: {\n list: {\n _horizontal: {\n marginBlockEnd: \"-1px\",\n },\n _vertical: {\n marginInlineEnd: \"-1px\",\n },\n },\n trigger: {\n borderColor: \"transparent\",\n borderWidth: \"1px\",\n _horizontal: {\n borderTopRadius: \"xsmall\",\n },\n _vertical: {\n borderTopLeftRadius: \"xsmall\",\n borderBottomLeftRadius: \"xsmall\",\n },\n _selected: {\n background: \"surface.default\",\n borderColor: \"stroke.default\",\n _horizontal: {\n borderBottom: \"none\",\n },\n _vertical: {\n borderRight: \"none\",\n },\n },\n _focusVisible: {\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n },\n },\n content: {\n borderWidth: \"1px\",\n borderColor: \"stroke.default\",\n background: \"surface.default\",\n width: \"100%\",\n padding: \"xsmall\",\n _vertical: {\n borderBottomRadius: \"xsmall\",\n borderRightRadius: \"xsmall\",\n },\n _horizontal: {\n borderRightRadius: \"xsmall\",\n borderBottomLeftRadius: \"xsmall\",\n },\n _focusVisible: {\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n },\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(tabsRecipe);\n\nexport type TabsVariantProps = NonNullable<RecipeVariantProps<typeof tabsRecipe>>;\n\nexport interface TabsRootProps extends Tabs.RootProps, TabsVariantProps, StyledProps, RefAttributes<HTMLDivElement> {\n translations: Tabs.RootProps[\"translations\"];\n}\n\nconst InternalTabsRoot = withProvider(Tabs.Root, \"root\", { baseComponent: true });\n\nexport const TabsRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: TabsRootProps) => (\n <InternalTabsRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const TabsContent = withContext(Tabs.Content, \"content\", { baseComponent: true });\n\nexport const TabsIndicator = withContext(Tabs.Indicator, \"indicator\", { baseComponent: true });\n\nexport const TabsList = withContext(Tabs.List, \"list\", { baseComponent: true });\n\nconst InternalTabsTrigger = withContext(Tabs.Trigger, \"trigger\", { baseComponent: true });\n\ninterface TabsTriggerProps extends Tabs.TriggerProps, StyledProps, RefAttributes<HTMLButtonElement> {}\n\nexport const TabsTrigger = ({ className, ...props }: TabsTriggerProps) => (\n <InternalTabsTrigger className={cx(\"peer\", className)} {...props} />\n);\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.mjs","names":[],"sources":["../src/Tabs.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Tabs } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, cx, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\n\nconst tabsRecipe = sva({\n // TODO: This still doesn't work. Need to figure out why we need to pass keys manually.\n // slots: tabsAnatomy.keys(),\n slots: [\"root\", \"list\", \"trigger\", \"content\", \"indicator\"],\n base: {\n root: {\n position: \"relative\",\n display: \"flex\",\n width: \"100%\",\n _horizontal: {\n flexDirection: \"column\",\n },\n _vertical: {\n flexDirection: \"row\",\n },\n },\n list: {\n position: \"relative\",\n display: \"flex\",\n flexShrink: \"0\",\n flexWrap: \"wrap\",\n _horizontal: {\n flexDirection: \"row\",\n },\n _vertical: {\n flexDirection: \"column\",\n },\n },\n trigger: {\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n flexShrink: \"0\",\n cursor: \"pointer\",\n textStyle: \"label.small\",\n fontWeight: \"bold\",\n transitionDuration: \"normal\",\n transitionProperty: \"color, background, border-color\",\n transitionTimingFunction: \"default\",\n whiteSpace: \"nowrap\",\n paddingInline: \"small\",\n paddingBlock: \"3xsmall\",\n zIndex: \"1\",\n _hover: {\n color: \"text.action\",\n },\n _selected: {\n color: \"text.strong\",\n },\n _disabled: {\n color: \"text.subtle\",\n cursor: \"not-allowed\",\n _hover: {\n color: \"text.subtle\",\n },\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n content: {\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"flex-start\",\n gap: \"xsmall\",\n },\n },\n defaultVariants: {\n variant: \"line\",\n },\n variants: {\n variant: {\n line: {\n trigger: {\n borderColor: \"stroke.default\",\n _hover: {\n borderColor: \"stroke.hover\",\n _focusVisible: {\n borderColor: \"stroke.default\",\n },\n },\n _horizontal: {\n borderBottom: \"1px solid\",\n },\n _disabled: {\n borderColor: \"stroke.default\",\n _hover: {\n borderColor: \"stroke.default\",\n },\n },\n _vertical: {\n borderLeft: \"1px solid\",\n justifyContent: \"flex-start\",\n },\n _focusVisible: {\n outline: \"none\",\n borderRadius: \"unset\",\n },\n },\n indicator: {\n background: \"stroke.default\",\n _peerFocusVisible: {\n height: \"var(--height)\",\n width: \"var(--width)\",\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n background: \"transparent\",\n _horizontal: {\n borderTopRadius: \"xsmall\",\n },\n _vertical: {\n borderRightRadius: \"xsmall\",\n },\n },\n _horizontal: {\n top: \"calc(var(--top) + var(--height) - 6px)\",\n height: \"3\",\n width: \"var(--width)\",\n _peerFocusVisible: { top: \"var(--top)\" },\n },\n _vertical: {\n height: \"var(--height)\",\n left: \"0\",\n width: \"3\",\n },\n },\n content: {\n zIndex: \"1\",\n _horizontal: {\n paddingBlockStart: \"xsmall\",\n },\n _vertical: {\n paddingInlineStart: \"xsmall\",\n },\n _focusVisible: {\n outline: \"none\",\n boxShadow: \"0 0 0 3px var(--shadow-color)\",\n boxShadowColor: \"stroke.default\",\n },\n },\n },\n outline: {\n list: {\n _horizontal: {\n marginBlockEnd: \"-1px\",\n },\n _vertical: {\n marginInlineEnd: \"-1px\",\n },\n },\n trigger: {\n borderColor: \"transparent\",\n borderWidth: \"1px\",\n _horizontal: {\n borderTopRadius: \"xsmall\",\n },\n _vertical: {\n borderTopLeftRadius: \"xsmall\",\n borderBottomLeftRadius: \"xsmall\",\n },\n _selected: {\n background: \"surface.default\",\n borderColor: \"stroke.default\",\n _horizontal: {\n borderBottom: \"none\",\n },\n _vertical: {\n borderRight: \"none\",\n },\n },\n _focusVisible: {\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n },\n },\n content: {\n borderWidth: \"1px\",\n borderColor: \"stroke.default\",\n background: \"surface.default\",\n width: \"100%\",\n padding: \"xsmall\",\n _vertical: {\n borderBottomRadius: \"xsmall\",\n borderRightRadius: \"xsmall\",\n },\n _horizontal: {\n borderRightRadius: \"xsmall\",\n borderBottomLeftRadius: \"xsmall\",\n },\n _focusVisible: {\n outline: \"3px solid\",\n outlineOffset: \"-3px\",\n outlineColor: \"stroke.default\",\n },\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(tabsRecipe);\n\nexport type TabsVariantProps = NonNullable<RecipeVariantProps<typeof tabsRecipe>>;\n\nexport interface TabsRootProps extends Tabs.RootProps, TabsVariantProps, StyledProps, RefAttributes<HTMLDivElement> {\n translations: Tabs.RootProps[\"translations\"];\n}\n\nconst InternalTabsRoot = withProvider(Tabs.Root, \"root\", { baseComponent: true });\n\nexport const TabsRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: TabsRootProps) => (\n <InternalTabsRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const TabsContent = withContext(Tabs.Content, \"content\", { baseComponent: true });\n\nexport const TabsIndicator = withContext(Tabs.Indicator, \"indicator\", { baseComponent: true });\n\nexport const TabsList = withContext(Tabs.List, \"list\", { baseComponent: true });\n\nconst InternalTabsTrigger = withContext(Tabs.Trigger, \"trigger\", { baseComponent: true });\n\ninterface TabsTriggerProps extends Tabs.TriggerProps, StyledProps, RefAttributes<HTMLButtonElement> {}\n\nexport const TabsTrigger = ({ className, ...props }: TabsTriggerProps) => (\n <InternalTabsTrigger className={cx(\"peer\", className)} {...props} />\n);\n"],"mappings":"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"}
package/es/TagsInput.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"TagsInput.mjs","names":[],"sources":["../src/TagsInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { TagsInput, tagsInputAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst tagsInputRecipe = sva({\n slots: tagsInputAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n width: \"full\",\n },\n control: {\n display: \"inline-flex\",\n gap: \"xxsmall\",\n alignItems: \"center\",\n flexWrap: \"wrap\",\n },\n item: {\n paddingBlock: \"3xsmall\",\n },\n itemPreview: {\n display: \"flex\",\n gap: \"1\",\n paddingBlock: \"4xsmall\",\n paddingInlineEnd: \"3xsmall\",\n paddingInlineStart: \"xsmall\",\n cursor: \"initial\",\n borderRadius: \"large\",\n outline: \"1px solid\",\n outlineColor: \"transparent\",\n backgroundColor: \"surface.action.selected\",\n color: \"text.onAction\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, outline-color, color\",\n transitionTimingFunction: \"default\",\n textStyle: \"label.medium\",\n _hover: {\n backgroundColor: \"surface.actionSubtle.hover\",\n outlineColor: \"stroke.hover\",\n color: \"text.default\",\n \"& svg\": {\n color: \"stroke.hover\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n _highlighted: {\n backgroundColor: \"surface.actionSubtle.hover\",\n outlineWidth: \"3px\",\n outlineOffset: \"-1px\",\n outlineColor: \"stroke.hover\",\n color: \"text.default\",\n \"& svg\": {\n color: \"stroke.hover\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n input: {\n flex: \"1\",\n },\n itemDeleteTrigger: {\n paddingBottom: \"1\",\n cursor: \"pointer\",\n \"& span\": {\n display: \"inline-block\",\n },\n \"& svg\": {\n marginInline: \"0\",\n marginBlock: \"0\",\n width: \"medium\",\n height: \"medium\",\n },\n },\n itemText: {\n paddingBottom: \"1\",\n },\n itemInput: {\n outline: \"none\",\n background: \"transparent\",\n },\n },\n});\nconst { withProvider, withContext } = createStyleContext(tagsInputRecipe);\n\nexport interface TagsInputRootProps extends TagsInput.RootProps, StyledProps {\n translations: TagsInput.RootProps[\"translations\"];\n}\n\nexport const TagsInputRoot = withProvider(TagsInput.Root, \"root\", {\n baseComponent: true,\n});\n\nexport interface TagsInputClearTriggerProps extends TagsInput.ClearTriggerProps, StyledProps {}\n\nexport const TagsInputClearTrigger = withContext(TagsInput.ClearTrigger, \"clearTrigger\", { baseComponent: true });\n\nexport interface TagsInputControlProps extends TagsInput.ControlProps, StyledProps {}\n\nexport const TagsInputControl = withContext(TagsInput.Control, \"control\", { baseComponent: true });\n\nexport interface TagsInputInputProps extends TagsInput.InputProps, StyledProps {}\n\nexport const TagsInputInput = withContext(TagsInput.Input, \"input\", { baseComponent: true });\n\nexport interface TagsInputItemDeleteTriggerProps extends TagsInput.ItemDeleteTriggerProps, StyledProps {}\n\nexport const TagsInputItemDeleteTrigger = withContext(TagsInput.ItemDeleteTrigger, \"itemDeleteTrigger\", {\n baseComponent: true,\n});\n\nexport interface TagsInputItemInputProps extends TagsInput.ItemInputProps, StyledProps {}\n\nexport const TagsInputItemInput = withContext(TagsInput.ItemInput, \"itemInput\", { baseComponent: true });\n\nexport interface TagsInputItemPreviewProps extends TagsInput.ItemPreviewProps, StyledProps {}\n\nexport const TagsInputItemPreview = withContext(TagsInput.ItemPreview, \"itemPreview\", { baseComponent: true });\n\nexport interface TagsInputItemProps extends TagsInput.ItemProps, StyledProps {}\n\nexport const TagsInputItem = withContext(TagsInput.Item, \"item\", { baseComponent: true });\n\nexport interface TagsInputItemTextProps extends TagsInput.ItemTextProps, StyledProps {}\n\nexport const TagsInputItemText = withContext(TagsInput.ItemText, \"itemText\", { baseComponent: true });\n\nconst InternalTagsInputLabel = withContext(TagsInput.Label, \"label\");\n\nexport interface TagsInputLabelProps\n extends Omit<TagsInput.LabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLLabelElement> {}\n\nexport const TagsInputLabel = forwardRef<HTMLLabelElement, TagsInputLabelProps>(({ children, ...props }, ref) => (\n <InternalTagsInputLabel asChild ref={ref} {...props}>\n <Label>{children}</Label>\n </InternalTagsInputLabel>\n));\n"],"mappings":";;;;;;;;;;;;;;AAsGA,MAAM,EAAE,cAAc,gBAAgB,mBAtFd,IAAI;CAC1B,OAAO,iBAAiB,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;GACR;EACD,SAAS;GACP,SAAS;GACT,KAAK;GACL,YAAY;GACZ,UAAU;GACX;EACD,MAAM,EACJ,cAAc,WACf;EACD,aAAa;GACX,SAAS;GACT,KAAK;GACL,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,cAAc;GACd,iBAAiB;GACjB,OAAO;GACP,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,WAAW;GACX,QAAQ;IACN,iBAAiB;IACjB,cAAc;IACd,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,eAAe;KACb,YAAY;KACZ,oBAAoB;KACrB;IACF;GACD,cAAc;IACZ,iBAAiB;IACjB,cAAc;IACd,eAAe;IACf,cAAc;IACd,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,eAAe;KACb,YAAY;KACZ,oBAAoB;KACrB;IACF;GACF;EACD,OAAO,EACL,MAAM,KACP;EACD,mBAAmB;GACjB,eAAe;GACf,QAAQ;GACR,UAAU,EACR,SAAS,gBACV;GACD,SAAS;IACP,cAAc;IACd,aAAa;IACb,OAAO;IACP,QAAQ;IACT;GACF;EACD,UAAU,EACR,eAAe,KAChB;EACD,WAAW;GACT,SAAS;GACT,YAAY;GACb;EACF;CACF,CAAC,CACuE;AAMzE,MAAa,gBAAgB,aAAa,UAAU,MAAM,QAAQ,EAChE,eAAe,MAChB,CAAC;AAIF,MAAa,wBAAwB,YAAY,UAAU,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAIjH,MAAa,mBAAmB,YAAY,UAAU,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIlG,MAAa,iBAAiB,YAAY,UAAU,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAI5F,MAAa,6BAA6B,YAAY,UAAU,mBAAmB,qBAAqB,EACtG,eAAe,MAChB,CAAC;AAIF,MAAa,qBAAqB,YAAY,UAAU,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,uBAAuB,YAAY,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAI9G,MAAa,gBAAgB,YAAY,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAIzF,MAAa,oBAAoB,YAAY,UAAU,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAErG,MAAM,yBAAyB,YAAY,UAAU,OAAO,QAAQ;AAKpE,MAAa,iBAAiB,YAAmD,EAAE,UAAU,GAAG,SAAS,QACvG,oBAAC,wBAAD;CAAwB,SAAA;CAAa;CAAK,GAAI;WAC5C,oBAAC,OAAD,EAAQ,UAAiB,CAAA;CACF,CAAA,CACzB"}
1
+ {"version":3,"file":"TagsInput.mjs","names":[],"sources":["../src/TagsInput.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { TagsInput, tagsInputAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type RefAttributes } from \"react\";\nimport { Label } from \"./Label\";\nimport { type TextProps } from \"./Text\";\n\nconst tagsInputRecipe = sva({\n slots: tagsInputAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"xxsmall\",\n width: \"full\",\n },\n control: {\n display: \"inline-flex\",\n gap: \"xxsmall\",\n alignItems: \"center\",\n flexWrap: \"wrap\",\n },\n item: {\n paddingBlock: \"3xsmall\",\n },\n itemPreview: {\n display: \"flex\",\n gap: \"1\",\n paddingBlock: \"4xsmall\",\n paddingInlineEnd: \"3xsmall\",\n paddingInlineStart: \"xsmall\",\n cursor: \"initial\",\n borderRadius: \"large\",\n outline: \"1px solid\",\n outlineColor: \"transparent\",\n backgroundColor: \"surface.action.selected\",\n color: \"text.onAction\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, outline-color, color\",\n transitionTimingFunction: \"default\",\n textStyle: \"label.medium\",\n _hover: {\n backgroundColor: \"surface.actionSubtle.hover\",\n outlineColor: \"stroke.hover\",\n color: \"text.default\",\n \"& svg\": {\n color: \"stroke.hover\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n _highlighted: {\n backgroundColor: \"surface.actionSubtle.hover\",\n outlineWidth: \"3px\",\n outlineOffset: \"-1px\",\n outlineColor: \"stroke.hover\",\n color: \"text.default\",\n \"& svg\": {\n color: \"stroke.hover\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n },\n input: {\n flex: \"1\",\n },\n itemDeleteTrigger: {\n paddingBottom: \"1\",\n cursor: \"pointer\",\n \"& span\": {\n display: \"inline-block\",\n },\n \"& svg\": {\n marginInline: \"0\",\n marginBlock: \"0\",\n width: \"medium\",\n height: \"medium\",\n },\n },\n itemText: {\n paddingBottom: \"1\",\n },\n itemInput: {\n outline: \"none\",\n background: \"transparent\",\n },\n },\n});\nconst { withProvider, withContext } = createStyleContext(tagsInputRecipe);\n\nexport interface TagsInputRootProps extends TagsInput.RootProps, StyledProps {\n translations: TagsInput.RootProps[\"translations\"];\n}\n\nexport const TagsInputRoot = withProvider(TagsInput.Root, \"root\", {\n baseComponent: true,\n});\n\nexport interface TagsInputClearTriggerProps extends TagsInput.ClearTriggerProps, StyledProps {}\n\nexport const TagsInputClearTrigger = withContext(TagsInput.ClearTrigger, \"clearTrigger\", { baseComponent: true });\n\nexport interface TagsInputControlProps extends TagsInput.ControlProps, StyledProps {}\n\nexport const TagsInputControl = withContext(TagsInput.Control, \"control\", { baseComponent: true });\n\nexport interface TagsInputInputProps extends TagsInput.InputProps, StyledProps {}\n\nexport const TagsInputInput = withContext(TagsInput.Input, \"input\", { baseComponent: true });\n\nexport interface TagsInputItemDeleteTriggerProps extends TagsInput.ItemDeleteTriggerProps, StyledProps {}\n\nexport const TagsInputItemDeleteTrigger = withContext(TagsInput.ItemDeleteTrigger, \"itemDeleteTrigger\", {\n baseComponent: true,\n});\n\nexport interface TagsInputItemInputProps extends TagsInput.ItemInputProps, StyledProps {}\n\nexport const TagsInputItemInput = withContext(TagsInput.ItemInput, \"itemInput\", { baseComponent: true });\n\nexport interface TagsInputItemPreviewProps extends TagsInput.ItemPreviewProps, StyledProps {}\n\nexport const TagsInputItemPreview = withContext(TagsInput.ItemPreview, \"itemPreview\", { baseComponent: true });\n\nexport interface TagsInputItemProps extends TagsInput.ItemProps, StyledProps {}\n\nexport const TagsInputItem = withContext(TagsInput.Item, \"item\", { baseComponent: true });\n\nexport interface TagsInputItemTextProps extends TagsInput.ItemTextProps, StyledProps {}\n\nexport const TagsInputItemText = withContext(TagsInput.ItemText, \"itemText\", { baseComponent: true });\n\nconst InternalTagsInputLabel = withContext(TagsInput.Label, \"label\");\n\nexport interface TagsInputLabelProps\n extends Omit<TagsInput.LabelProps, \"color\">, StyledProps, TextProps, RefAttributes<HTMLLabelElement> {}\n\nexport const TagsInputLabel = forwardRef<HTMLLabelElement, TagsInputLabelProps>(({ children, ...props }, ref) => (\n <InternalTagsInputLabel asChild ref={ref} {...props}>\n <Label>{children}</Label>\n </InternalTagsInputLabel>\n));\n"],"mappings":";;;;;;;;;;;;;;AAsGA,MAAM,EAAE,cAAc,gBAAgB,mBAtFd,IAAI;CAC1B,OAAO,iBAAiB,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACL,OAAO;GACR;EACD,SAAS;GACP,SAAS;GACT,KAAK;GACL,YAAY;GACZ,UAAU;GACX;EACD,MAAM,EACJ,cAAc,WACf;EACD,aAAa;GACX,SAAS;GACT,KAAK;GACL,cAAc;GACd,kBAAkB;GAClB,oBAAoB;GACpB,QAAQ;GACR,cAAc;GACd,SAAS;GACT,cAAc;GACd,iBAAiB;GACjB,OAAO;GACP,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,WAAW;GACX,QAAQ;IACN,iBAAiB;IACjB,cAAc;IACd,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,eAAe;KACb,YAAY;KACZ,oBAAoB;KACrB;IACF;GACD,cAAc;IACZ,iBAAiB;IACjB,cAAc;IACd,eAAe;IACf,cAAc;IACd,OAAO;IACP,SAAS,EACP,OAAO,gBACR;IACD,eAAe;KACb,YAAY;KACZ,oBAAoB;KACrB;IACF;GACF;EACD,OAAO,EACL,MAAM,KACP;EACD,mBAAmB;GACjB,eAAe;GACf,QAAQ;GACR,UAAU,EACR,SAAS,gBACV;GACD,SAAS;IACP,cAAc;IACd,aAAa;IACb,OAAO;IACP,QAAQ;IACT;GACF;EACD,UAAU,EACR,eAAe,KAChB;EACD,WAAW;GACT,SAAS;GACT,YAAY;GACb;EACF;CACF,CACuE,CAAC;AAMzE,MAAa,gBAAgB,aAAa,UAAU,MAAM,QAAQ,EAChE,eAAe,MAChB,CAAC;AAIF,MAAa,wBAAwB,YAAY,UAAU,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAIjH,MAAa,mBAAmB,YAAY,UAAU,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIlG,MAAa,iBAAiB,YAAY,UAAU,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAI5F,MAAa,6BAA6B,YAAY,UAAU,mBAAmB,qBAAqB,EACtG,eAAe,MAChB,CAAC;AAIF,MAAa,qBAAqB,YAAY,UAAU,WAAW,aAAa,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,uBAAuB,YAAY,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAI9G,MAAa,gBAAgB,YAAY,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAIzF,MAAa,oBAAoB,YAAY,UAAU,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAErG,MAAM,yBAAyB,YAAY,UAAU,OAAO,QAAQ;AAKpE,MAAa,iBAAiB,YAAmD,EAAE,UAAU,GAAG,SAAS,QACvG,oBAAC,wBAAD;CAAwB,SAAA;CAAa;CAAK,GAAI;WAC5C,oBAAC,OAAD,EAAQ,UAAiB,CAAA;CACF,CAAA,CACzB"}
package/es/Toast.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.mjs","names":[],"sources":["../src/Toast.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Toast, toastAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps, RecipeVariantProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst toastRecipe = sva({\n slots: toastAnatomy.keys(),\n base: {\n root: {\n position: \"relative\",\n borderRadius: \"xsmall\",\n boxShadow: \"medium\",\n minWidth: \"20rem\",\n maxWidth: \"30rem\",\n height: \"var(--height)\",\n opacity: \"var(--opacity)\",\n overflowWrap: \"anywhere\",\n padding: \"small\",\n scale: \"var(--scale)\",\n translate: \"var(--x) var(--y) 0\",\n willChange: \"translate, scale, opacity, height\",\n zIndex: \"var(--z-index)\",\n transitionDuration: \"slow\",\n transitionProperty: \"translate, scale, opacity, height\",\n transitionTimingFunction: \"default\",\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n title: {\n paddingInlineEnd: \"xxlarge\",\n },\n closeTrigger: {\n position: \"absolute\",\n top: \"xxsmall\",\n right: \"xxsmall\",\n },\n description: {\n paddingInlineEnd: \"xxlarge\",\n },\n },\n defaultVariants: {\n variant: \"light\",\n },\n variants: {\n variant: {\n light: {\n root: {\n background: \"surface.brand.1.moderate\",\n color: \"text.default\",\n },\n },\n dark: {\n root: {\n background: \"surface.brand.1.strong\",\n color: \"text.onAction\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(toastRecipe);\n\nexport type ToastRootVariantProps = NonNullable<RecipeVariantProps<typeof toastRecipe>>;\n\nexport interface ToastRootProps extends Toast.RootProps, StyledProps, ToastRootVariantProps {}\nexport const ToastRoot = withProvider(Toast.Root, \"root\", { baseComponent: true });\n\nexport const ToastActionTrigger = withContext(Toast.ActionTrigger, \"actionTrigger\", { baseComponent: true });\n\nexport const ToastCloseTrigger = withContext(Toast.CloseTrigger, \"closeTrigger\", { baseComponent: true });\n\nconst InternalToastDescription = withContext(Toast.Description, \"description\");\n\ninterface ToastDescriptionProps\n extends Omit<Toast.DescriptionProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const ToastDescription = ({ textStyle = \"label.medium\", children, ...props }: ToastDescriptionProps) => (\n <InternalToastDescription asChild>\n <Text asChild consumeCss textStyle={textStyle} {...props}>\n <div>{children}</div>\n </Text>\n </InternalToastDescription>\n);\n\nconst InternalToastTitle = withContext(Toast.Title, \"title\");\n\ninterface ToastTitleProps\n extends Omit<Toast.TitleProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const ToastTitle = ({\n textStyle = \"label.medium\",\n fontWeight = \"semibold\",\n children,\n ...props\n}: ToastTitleProps) => (\n <InternalToastTitle asChild>\n <Text asChild consumeCss fontWeight={fontWeight} textStyle={textStyle} {...props}>\n <div>{children}</div>\n </Text>\n </InternalToastTitle>\n);\n"],"mappings":";;;;;;;;;;;;;AAyEA,MAAM,EAAE,cAAc,gBAAgB,mBA1DlB,IAAI;CACtB,OAAO,aAAa,MAAM;CAC1B,MAAM;EACJ,MAAM;GACJ,UAAU;GACV,cAAc;GACd,WAAW;GACX,UAAU;GACV,UAAU;GACV,QAAQ;GACR,SAAS;GACT,cAAc;GACd,SAAS;GACT,OAAO;GACP,WAAW;GACX,YAAY;GACZ,QAAQ;GACR,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,OAAO,EACL,kBAAkB,WACnB;EACD,cAAc;GACZ,UAAU;GACV,KAAK;GACL,OAAO;GACR;EACD,aAAa,EACX,kBAAkB,WACnB;EACF;CACD,iBAAiB,EACf,SAAS,SACV;CACD,UAAU,EACR,SAAS;EACP,OAAO,EACL,MAAM;GACJ,YAAY;GACZ,OAAO;GACR,EACF;EACD,MAAM,EACJ,MAAM;GACJ,YAAY;GACZ,OAAO;GACR,EACF;EACF,EACF;CACF,CAAC,CAEmE;AAKrE,MAAa,YAAY,aAAa,MAAM,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAElF,MAAa,qBAAqB,YAAY,MAAM,eAAe,iBAAiB,EAAE,eAAe,MAAM,CAAC;AAE5G,MAAa,oBAAoB,YAAY,MAAM,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAEzG,MAAM,2BAA2B,YAAY,MAAM,aAAa,cAAc;AAK9E,MAAa,oBAAoB,EAAE,YAAY,gBAAgB,UAAU,GAAG,YAC1E,oBAAC,0BAAD;CAA0B,SAAA;WACxB,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;EAAW,GAAI;YACjD,oBAAC,OAAD,EAAM,UAAe,CAAA;EAChB,CAAA;CACkB,CAAA;AAG7B,MAAM,qBAAqB,YAAY,MAAM,OAAO,QAAQ;AAK5D,MAAa,cAAc,EACzB,YAAY,gBACZ,aAAa,YACb,UACA,GAAG,YAEH,oBAAC,oBAAD;CAAoB,SAAA;WAClB,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAuB;EAAuB;EAAW,GAAI;YACzE,oBAAC,OAAD,EAAM,UAAe,CAAA;EAChB,CAAA;CACY,CAAA"}
1
+ {"version":3,"file":"Toast.mjs","names":[],"sources":["../src/Toast.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Toast, toastAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps, RecipeVariantProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"./Text\";\n\nconst toastRecipe = sva({\n slots: toastAnatomy.keys(),\n base: {\n root: {\n position: \"relative\",\n borderRadius: \"xsmall\",\n boxShadow: \"medium\",\n minWidth: \"20rem\",\n maxWidth: \"30rem\",\n height: \"var(--height)\",\n opacity: \"var(--opacity)\",\n overflowWrap: \"anywhere\",\n padding: \"small\",\n scale: \"var(--scale)\",\n translate: \"var(--x) var(--y) 0\",\n willChange: \"translate, scale, opacity, height\",\n zIndex: \"var(--z-index)\",\n transitionDuration: \"slow\",\n transitionProperty: \"translate, scale, opacity, height\",\n transitionTimingFunction: \"default\",\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n title: {\n paddingInlineEnd: \"xxlarge\",\n },\n closeTrigger: {\n position: \"absolute\",\n top: \"xxsmall\",\n right: \"xxsmall\",\n },\n description: {\n paddingInlineEnd: \"xxlarge\",\n },\n },\n defaultVariants: {\n variant: \"light\",\n },\n variants: {\n variant: {\n light: {\n root: {\n background: \"surface.brand.1.moderate\",\n color: \"text.default\",\n },\n },\n dark: {\n root: {\n background: \"surface.brand.1.strong\",\n color: \"text.onAction\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(toastRecipe);\n\nexport type ToastRootVariantProps = NonNullable<RecipeVariantProps<typeof toastRecipe>>;\n\nexport interface ToastRootProps extends Toast.RootProps, StyledProps, ToastRootVariantProps {}\nexport const ToastRoot = withProvider(Toast.Root, \"root\", { baseComponent: true });\n\nexport const ToastActionTrigger = withContext(Toast.ActionTrigger, \"actionTrigger\", { baseComponent: true });\n\nexport const ToastCloseTrigger = withContext(Toast.CloseTrigger, \"closeTrigger\", { baseComponent: true });\n\nconst InternalToastDescription = withContext(Toast.Description, \"description\");\n\ninterface ToastDescriptionProps\n extends Omit<Toast.DescriptionProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const ToastDescription = ({ textStyle = \"label.medium\", children, ...props }: ToastDescriptionProps) => (\n <InternalToastDescription asChild>\n <Text asChild consumeCss textStyle={textStyle} {...props}>\n <div>{children}</div>\n </Text>\n </InternalToastDescription>\n);\n\nconst InternalToastTitle = withContext(Toast.Title, \"title\");\n\ninterface ToastTitleProps\n extends Omit<Toast.TitleProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const ToastTitle = ({\n textStyle = \"label.medium\",\n fontWeight = \"semibold\",\n children,\n ...props\n}: ToastTitleProps) => (\n <InternalToastTitle asChild>\n <Text asChild consumeCss fontWeight={fontWeight} textStyle={textStyle} {...props}>\n <div>{children}</div>\n </Text>\n </InternalToastTitle>\n);\n"],"mappings":";;;;;;;;;;;;;AAyEA,MAAM,EAAE,cAAc,gBAAgB,mBA1DlB,IAAI;CACtB,OAAO,aAAa,MAAM;CAC1B,MAAM;EACJ,MAAM;GACJ,UAAU;GACV,cAAc;GACd,WAAW;GACX,UAAU;GACV,UAAU;GACV,QAAQ;GACR,SAAS;GACT,cAAc;GACd,SAAS;GACT,OAAO;GACP,WAAW;GACX,YAAY;GACZ,QAAQ;GACR,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,OAAO,EACL,kBAAkB,WACnB;EACD,cAAc;GACZ,UAAU;GACV,KAAK;GACL,OAAO;GACR;EACD,aAAa,EACX,kBAAkB,WACnB;EACF;CACD,iBAAiB,EACf,SAAS,SACV;CACD,UAAU,EACR,SAAS;EACP,OAAO,EACL,MAAM;GACJ,YAAY;GACZ,OAAO;GACR,EACF;EACD,MAAM,EACJ,MAAM;GACJ,YAAY;GACZ,OAAO;GACR,EACF;EACF,EACF;CACF,CAEmE,CAAC;AAKrE,MAAa,YAAY,aAAa,MAAM,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAElF,MAAa,qBAAqB,YAAY,MAAM,eAAe,iBAAiB,EAAE,eAAe,MAAM,CAAC;AAE5G,MAAa,oBAAoB,YAAY,MAAM,cAAc,gBAAgB,EAAE,eAAe,MAAM,CAAC;AAEzG,MAAM,2BAA2B,YAAY,MAAM,aAAa,cAAc;AAK9E,MAAa,oBAAoB,EAAE,YAAY,gBAAgB,UAAU,GAAG,YAC1E,oBAAC,0BAAD;CAA0B,SAAA;WACxB,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAsB;EAAW,GAAI;YACjD,oBAAC,OAAD,EAAM,UAAe,CAAA;EAChB,CAAA;CACkB,CAAA;AAG7B,MAAM,qBAAqB,YAAY,MAAM,OAAO,QAAQ;AAK5D,MAAa,cAAc,EACzB,YAAY,gBACZ,aAAa,YACb,UACA,GAAG,YAEH,oBAAC,oBAAD;CAAoB,SAAA;WAClB,oBAAC,MAAD;EAAM,SAAA;EAAQ,YAAA;EAAuB;EAAuB;EAAW,GAAI;YACzE,oBAAC,OAAD,EAAM,UAAe,CAAA;EAChB,CAAA;CACY,CAAA"}
package/es/ToggleGroup.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ToggleGroup.mjs","names":[],"sources":["../src/ToggleGroup.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { toggleGroupAnatomy, ToggleGroup } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\n\nconst toggleGroupRecipe = sva({\n slots: toggleGroupAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"row\",\n gap: \"4xsmall\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(toggleGroupRecipe);\n\nexport type ToggleGroupVariantProps = NonNullable<RecipeVariantProps<typeof toggleGroupRecipe>>;\nexport interface ToggleGroupRootProps extends ToggleGroup.RootProps, StyledProps, ToggleGroupVariantProps {}\n\nexport const ToggleGroupRoot = withProvider(ToggleGroup.Root, \"root\", { baseComponent: true });\n\nexport interface ToggleGroupItemProps extends ToggleGroup.ItemProps, StyledProps {}\n\nexport const ToggleGroupItem = withContext(ToggleGroup.Item, \"item\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;AAwBA,MAAM,EAAE,cAAc,gBAAgB,mBAXZ,IAAI;CAC5B,OAAO,mBAAmB,MAAM;CAChC,MAAM,EACJ,MAAM;EACJ,SAAS;EACT,eAAe;EACf,KAAK;EACN,EACF;CACF,CAAC,CAEyE;AAK3E,MAAa,kBAAkB,aAAa,YAAY,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAI9F,MAAa,kBAAkB,YAAY,YAAY,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"ToggleGroup.mjs","names":[],"sources":["../src/ToggleGroup.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { toggleGroupAnatomy, ToggleGroup } from \"@ark-ui/react\";\nimport { type RecipeVariantProps, sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\n\nconst toggleGroupRecipe = sva({\n slots: toggleGroupAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"row\",\n gap: \"4xsmall\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(toggleGroupRecipe);\n\nexport type ToggleGroupVariantProps = NonNullable<RecipeVariantProps<typeof toggleGroupRecipe>>;\nexport interface ToggleGroupRootProps extends ToggleGroup.RootProps, StyledProps, ToggleGroupVariantProps {}\n\nexport const ToggleGroupRoot = withProvider(ToggleGroup.Root, \"root\", { baseComponent: true });\n\nexport interface ToggleGroupItemProps extends ToggleGroup.ItemProps, StyledProps {}\n\nexport const ToggleGroupItem = withContext(ToggleGroup.Item, \"item\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;AAwBA,MAAM,EAAE,cAAc,gBAAgB,mBAXZ,IAAI;CAC5B,OAAO,mBAAmB,MAAM;CAChC,MAAM,EACJ,MAAM;EACJ,SAAS;EACT,eAAe;EACf,KAAK;EACN,EACF;CACF,CAEyE,CAAC;AAK3E,MAAa,kBAAkB,aAAa,YAAY,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAI9F,MAAa,kBAAkB,YAAY,YAAY,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC"}
package/es/Tooltip.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.mjs","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Tooltip, tooltipAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef } from \"react\";\n\nconst tooltipRecipe = sva({\n slots: tooltipAnatomy.keys(),\n base: {\n content: {\n background: \"surface.action\",\n textStyle: \"label.small\",\n color: \"text.onAction\",\n paddingInline: \"xxsmall\",\n paddingBlock: \"4xsmall\",\n \"--arrow-size\": \"spacing.xxsmall\",\n \"--arrow-background\": \"colors.surface.action\",\n _open: {\n animation: \"fade-shift-in 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(tooltipRecipe);\n\nexport type TooltipRootProps = Tooltip.RootProps;\nexport const TooltipRoot = withRootProvider(Tooltip.Root);\n\nexport const TooltipArrow = withContext(Tooltip.Arrow, \"arrow\", { baseComponent: true });\n\nexport const TooltipArrowTip = withContext(Tooltip.ArrowTip, \"arrowTip\", { baseComponent: true });\n\nexport const TooltipContentStandalone = withContext(Tooltip.Content, \"content\", { baseComponent: true });\n\ninterface TooltipContentProps extends Tooltip.ContentProps, StyledProps {}\n\nexport const TooltipContent = forwardRef<HTMLDivElement, TooltipContentProps>(({ children, ...props }, ref) => (\n <TooltipPositioner>\n <TooltipContentStandalone {...props} ref={ref}>\n <TooltipArrow>\n <TooltipArrowTip />\n </TooltipArrow>\n {children}\n </TooltipContentStandalone>\n </TooltipPositioner>\n));\n\nexport const TooltipPositioner = withContext(Tooltip.Positioner, \"positioner\", { baseComponent: true });\n\nexport const TooltipTrigger = withContext(Tooltip.Trigger, \"trigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;;;AAyCA,MAAM,EAAE,kBAAkB,gBAAgB,mBA3BpB,IAAI;CACxB,OAAO,eAAe,MAAM;CAC5B,MAAM,EACJ,SAAS;EACP,YAAY;EACZ,WAAW;EACX,OAAO;EACP,eAAe;EACf,cAAc;EACd,gBAAgB;EAChB,sBAAsB;EACtB,OAAO;GACL,WAAW;GACX,eAAe,EACb,WAAW,QACZ;GACF;EACD,SAAS;GACP,WAAW;GACX,eAAe,EACb,WAAW,QACZ;GACF;EACF,EACF;CACF,CAAC,CAEyE;AAG3E,MAAa,cAAc,iBAAiB,QAAQ,KAAK;AAEzD,MAAa,eAAe,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAExF,MAAa,kBAAkB,YAAY,QAAQ,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEjG,MAAa,2BAA2B,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,iBAAiB,YAAiD,EAAE,UAAU,GAAG,SAAS,QACrG,oBAAC,mBAAD,EAAA,UACE,qBAAC,0BAAD;CAA0B,GAAI;CAAY;WAA1C,CACE,oBAAC,cAAD,EAAA,UACE,oBAAC,iBAAD,EAAmB,CAAA,EACN,CAAA,EACd,SACwB;IACT,CAAA,CACpB;AAEF,MAAa,oBAAoB,YAAY,QAAQ,YAAY,cAAc,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAa,iBAAiB,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Tooltip.mjs","names":[],"sources":["../src/Tooltip.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Tooltip, tooltipAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef } from \"react\";\n\nconst tooltipRecipe = sva({\n slots: tooltipAnatomy.keys(),\n base: {\n content: {\n background: \"surface.action\",\n textStyle: \"label.small\",\n color: \"text.onAction\",\n paddingInline: \"xxsmall\",\n paddingBlock: \"4xsmall\",\n \"--arrow-size\": \"spacing.xxsmall\",\n \"--arrow-background\": \"colors.surface.action\",\n _open: {\n animation: \"fade-shift-in 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"fade-shift-out 0.2s ease-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n },\n});\n\nconst { withRootProvider, withContext } = createStyleContext(tooltipRecipe);\n\nexport type TooltipRootProps = Tooltip.RootProps;\nexport const TooltipRoot = withRootProvider(Tooltip.Root);\n\nexport const TooltipArrow = withContext(Tooltip.Arrow, \"arrow\", { baseComponent: true });\n\nexport const TooltipArrowTip = withContext(Tooltip.ArrowTip, \"arrowTip\", { baseComponent: true });\n\nexport const TooltipContentStandalone = withContext(Tooltip.Content, \"content\", { baseComponent: true });\n\ninterface TooltipContentProps extends Tooltip.ContentProps, StyledProps {}\n\nexport const TooltipContent = forwardRef<HTMLDivElement, TooltipContentProps>(({ children, ...props }, ref) => (\n <TooltipPositioner>\n <TooltipContentStandalone {...props} ref={ref}>\n <TooltipArrow>\n <TooltipArrowTip />\n </TooltipArrow>\n {children}\n </TooltipContentStandalone>\n </TooltipPositioner>\n));\n\nexport const TooltipPositioner = withContext(Tooltip.Positioner, \"positioner\", { baseComponent: true });\n\nexport const TooltipTrigger = withContext(Tooltip.Trigger, \"trigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;;;AAyCA,MAAM,EAAE,kBAAkB,gBAAgB,mBA3BpB,IAAI;CACxB,OAAO,eAAe,MAAM;CAC5B,MAAM,EACJ,SAAS;EACP,YAAY;EACZ,WAAW;EACX,OAAO;EACP,eAAe;EACf,cAAc;EACd,gBAAgB;EAChB,sBAAsB;EACtB,OAAO;GACL,WAAW;GACX,eAAe,EACb,WAAW,QACZ;GACF;EACD,SAAS;GACP,WAAW;GACX,eAAe,EACb,WAAW,QACZ;GACF;EACF,EACF;CACF,CAEyE,CAAC;AAG3E,MAAa,cAAc,iBAAiB,QAAQ,KAAK;AAEzD,MAAa,eAAe,YAAY,QAAQ,OAAO,SAAS,EAAE,eAAe,MAAM,CAAC;AAExF,MAAa,kBAAkB,YAAY,QAAQ,UAAU,YAAY,EAAE,eAAe,MAAM,CAAC;AAEjG,MAAa,2BAA2B,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC;AAIxG,MAAa,iBAAiB,YAAiD,EAAE,UAAU,GAAG,SAAS,QACrG,oBAAC,mBAAD,EAAA,UACE,qBAAC,0BAAD;CAA0B,GAAI;CAAY;WAA1C,CACE,oBAAC,cAAD,EAAA,UACE,oBAAC,iBAAD,EAAmB,CAAA,EACN,CAAA,EACd,SACwB;IACT,CAAA,CACpB;AAEF,MAAa,oBAAoB,YAAY,QAAQ,YAAY,cAAc,EAAE,eAAe,MAAM,CAAC;AAEvG,MAAa,iBAAiB,YAAY,QAAQ,SAAS,WAAW,EAAE,eAAe,MAAM,CAAC"}
package/es/Tree/Tree.mjs.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tree.mjs","names":["createTreeCollection","_createTreeCollection","useTreeView","_useTreeView"],"sources":["../../src/Tree/Tree.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport {\n TreeView,\n treeViewAnatomy,\n type TreeNode,\n createTreeCollection as _createTreeCollection,\n useTreeView as _useTreeView,\n} from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type ElementType, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"../Text\";\n\nconst treeRecipe = sva({\n slots: treeViewAnatomy.keys(),\n base: {\n root: {\n width: \"100%\",\n },\n branch: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n branchContent: {\n position: \"relative\",\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n branchControl: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"3xsmall\",\n borderRadius: \"xsmall\",\n height: \"xxlarge\",\n cursor: \"pointer\",\n paddingInlineStart: \"calc((var(--depth) - 1) * token(spacing.medium))\",\n paddingInlineEnd: \"xsmall\",\n paddingBlock: \"xsmall\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n },\n },\n branchIndicator: {\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(90deg)\",\n },\n },\n item: {\n display: \"flex\",\n cursor: \"pointer\",\n position: \"relative\",\n borderRadius: \"xsmall\",\n justifyContent: \"space-between\",\n paddingBlock: \"xsmall\",\n paddingInlineEnd: \"xsmall\",\n paddingInlineStart:\n \"calc(((var(--depth) - 1) * token(spacing.medium)) + token(spacing.xxlarge) + token(spacing.3xsmall))\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n height: \"xxlarge\",\n alignItems: \"center\",\n\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n _hover: {\n background: \"surface.hover\",\n },\n },\n },\n itemIndicator: {\n color: \"icon.strong\",\n },\n itemText: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n branchText: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n tree: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(treeRecipe);\n\nexport interface TreeRootProps<T extends TreeNode = TreeNode>\n extends TreeView.RootProps<T>, StyledProps, RefAttributes<HTMLDivElement> {}\n\nconst InternalTreeRoot = withProvider<ElementType<TreeRootProps>>(TreeView.Root, \"root\", { baseComponent: true });\n\nexport const TreeRoot = <T extends TreeNode = TreeNode>(props: TreeRootProps<T>) => <InternalTreeRoot {...props} />;\n\nexport interface TreeRootProviderProps<T extends TreeNode = TreeNode>\n extends TreeView.RootProviderProps<T>, StyledProps {}\n\nconst InternalTreeRootProvider = withProvider<ElementType<TreeRootProviderProps>>(TreeView.RootProvider, \"root\", {\n baseComponent: true,\n});\n\nexport const TreeRootProvider = <T extends TreeNode = TreeNode>(props: TreeRootProviderProps<T>) => (\n <InternalTreeRootProvider {...props} />\n);\n\nexport const TreeBranchContent = withContext(TreeView.BranchContent, \"branchContent\", { baseComponent: true });\n\nexport const TreeBranchControl = withContext(TreeView.BranchControl, \"branchControl\", { baseComponent: true });\n\nexport const TreeBranchIndicator = withContext(TreeView.BranchIndicator, \"branchIndicator\", { baseComponent: true });\n\nexport const TreeBranch = withContext(TreeView.Branch, \"branch\", {\n baseComponent: true,\n});\n\nconst InternalTreeBranchText = withContext(TreeView.BranchText, \"branchText\", { baseComponent: true });\n\ninterface TreeBranchTextProps\n extends Omit<TreeView.BranchTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeBranchText = forwardRef<HTMLDivElement, TreeBranchTextProps>(\n ({ textStyle = \"label.medium\", fontWeight = \"bold\", children, ...props }, ref) => (\n <InternalTreeBranchText asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeBranchText>\n ),\n);\n\nexport const TreeBranchTrigger = withContext(TreeView.BranchTrigger, \"branchTrigger\", { baseComponent: true });\n\nexport const TreeItemIndicator = withContext(TreeView.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport const TreeItem = withContext(TreeView.Item, \"item\", { baseComponent: true });\n\nconst InternalTreeItemText = withContext(TreeView.ItemText, \"itemText\", { baseComponent: true });\n\ninterface TreeItemTextProps\n extends Omit<TreeView.ItemTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeItemText = forwardRef<HTMLDivElement, TreeItemTextProps>(\n ({ textStyle = \"label.medium\", fontWeight = \"bold\", children, ...props }, ref) => (\n <InternalTreeItemText asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeItemText>\n ),\n);\n\nconst InternalTreeLabel = withContext(TreeView.Label, \"label\", { baseComponent: true });\n\ninterface TreeLabelProps\n extends Omit<TreeView.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeLabel = forwardRef<HTMLDivElement, TreeLabelProps>(\n ({ children, textStyle = \"label.medium\", fontWeight = \"bold\", ...props }, ref) => (\n <InternalTreeLabel asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeLabel>\n ),\n);\n\nexport const Tree = withContext(TreeView.Tree, \"tree\", { baseComponent: true });\n\nexport const createTreeCollection = _createTreeCollection;\n\nexport const TreeNodeProvider = TreeView.NodeProvider;\nexport const TreeNodeContext = TreeView.NodeContext;\nexport const useTreeView = _useTreeView;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tree.mjs","names":["createTreeCollection","_createTreeCollection","useTreeView","_useTreeView"],"sources":["../../src/Tree/Tree.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport {\n TreeView,\n treeViewAnatomy,\n type TreeNode,\n createTreeCollection as _createTreeCollection,\n useTreeView as _useTreeView,\n} from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { StyledProps } from \"@ndla/styled-system/types\";\nimport { forwardRef, type ElementType, type RefAttributes } from \"react\";\nimport { Text, type TextProps } from \"../Text\";\n\nconst treeRecipe = sva({\n slots: treeViewAnatomy.keys(),\n base: {\n root: {\n width: \"100%\",\n },\n branch: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n branchContent: {\n position: \"relative\",\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n branchControl: {\n display: \"flex\",\n alignItems: \"center\",\n gap: \"3xsmall\",\n borderRadius: \"xsmall\",\n height: \"xxlarge\",\n cursor: \"pointer\",\n paddingInlineStart: \"calc((var(--depth) - 1) * token(spacing.medium))\",\n paddingInlineEnd: \"xsmall\",\n paddingBlock: \"xsmall\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n },\n },\n branchIndicator: {\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(90deg)\",\n },\n },\n item: {\n display: \"flex\",\n cursor: \"pointer\",\n position: \"relative\",\n borderRadius: \"xsmall\",\n justifyContent: \"space-between\",\n paddingBlock: \"xsmall\",\n paddingInlineEnd: \"xsmall\",\n paddingInlineStart:\n \"calc(((var(--depth) - 1) * token(spacing.medium)) + token(spacing.xxlarge) + token(spacing.3xsmall))\",\n transitionDuration: \"normal\",\n transitionProperty: \"background, color\",\n transitionTimingFunction: \"default\",\n height: \"xxlarge\",\n alignItems: \"center\",\n\n _hover: {\n background: \"surface.hover\",\n },\n _selected: {\n background: \"surface.selected\",\n _hover: {\n background: \"surface.hover\",\n },\n },\n },\n itemIndicator: {\n color: \"icon.strong\",\n },\n itemText: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n branchText: {\n overflow: \"hidden\",\n textOverflow: \"ellipsis\",\n },\n tree: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(treeRecipe);\n\nexport interface TreeRootProps<T extends TreeNode = TreeNode>\n extends TreeView.RootProps<T>, StyledProps, RefAttributes<HTMLDivElement> {}\n\nconst InternalTreeRoot = withProvider<ElementType<TreeRootProps>>(TreeView.Root, \"root\", { baseComponent: true });\n\nexport const TreeRoot = <T extends TreeNode = TreeNode>(props: TreeRootProps<T>) => <InternalTreeRoot {...props} />;\n\nexport interface TreeRootProviderProps<T extends TreeNode = TreeNode>\n extends TreeView.RootProviderProps<T>, StyledProps {}\n\nconst InternalTreeRootProvider = withProvider<ElementType<TreeRootProviderProps>>(TreeView.RootProvider, \"root\", {\n baseComponent: true,\n});\n\nexport const TreeRootProvider = <T extends TreeNode = TreeNode>(props: TreeRootProviderProps<T>) => (\n <InternalTreeRootProvider {...props} />\n);\n\nexport const TreeBranchContent = withContext(TreeView.BranchContent, \"branchContent\", { baseComponent: true });\n\nexport const TreeBranchControl = withContext(TreeView.BranchControl, \"branchControl\", { baseComponent: true });\n\nexport const TreeBranchIndicator = withContext(TreeView.BranchIndicator, \"branchIndicator\", { baseComponent: true });\n\nexport const TreeBranch = withContext(TreeView.Branch, \"branch\", {\n baseComponent: true,\n});\n\nconst InternalTreeBranchText = withContext(TreeView.BranchText, \"branchText\", { baseComponent: true });\n\ninterface TreeBranchTextProps\n extends Omit<TreeView.BranchTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeBranchText = forwardRef<HTMLDivElement, TreeBranchTextProps>(\n ({ textStyle = \"label.medium\", fontWeight = \"bold\", children, ...props }, ref) => (\n <InternalTreeBranchText asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeBranchText>\n ),\n);\n\nexport const TreeBranchTrigger = withContext(TreeView.BranchTrigger, \"branchTrigger\", { baseComponent: true });\n\nexport const TreeItemIndicator = withContext(TreeView.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport const TreeItem = withContext(TreeView.Item, \"item\", { baseComponent: true });\n\nconst InternalTreeItemText = withContext(TreeView.ItemText, \"itemText\", { baseComponent: true });\n\ninterface TreeItemTextProps\n extends Omit<TreeView.ItemTextProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeItemText = forwardRef<HTMLDivElement, TreeItemTextProps>(\n ({ textStyle = \"label.medium\", fontWeight = \"bold\", children, ...props }, ref) => (\n <InternalTreeItemText asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeItemText>\n ),\n);\n\nconst InternalTreeLabel = withContext(TreeView.Label, \"label\", { baseComponent: true });\n\ninterface TreeLabelProps\n extends Omit<TreeView.LabelProps, \"color\">, TextProps, StyledProps, RefAttributes<HTMLDivElement> {}\n\nexport const TreeLabel = forwardRef<HTMLDivElement, TreeLabelProps>(\n ({ children, textStyle = \"label.medium\", fontWeight = \"bold\", ...props }, ref) => (\n <InternalTreeLabel asChild {...props} ref={ref}>\n <Text textStyle={textStyle} fontWeight={fontWeight} asChild consumeCss>\n <div>{children}</div>\n </Text>\n </InternalTreeLabel>\n ),\n);\n\nexport const Tree = withContext(TreeView.Tree, \"tree\", { baseComponent: true });\n\nexport const createTreeCollection = _createTreeCollection;\n\nexport const TreeNodeProvider = TreeView.NodeProvider;\nexport const TreeNodeContext = TreeView.NodeContext;\nexport const useTreeView = _useTreeView;\n"],"mappings":"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"}
package/lib/Accordion.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Accordion.js","names":["accordionAnatomy","Accordion"],"sources":["../src/Accordion.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Accordion, accordionAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { RecipeVariantProps, StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\n\nconst accordionRecipe = sva({\n slots: accordionAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n itemTrigger: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n background: \"surface.default\",\n cursor: \"pointer\",\n transitionDuration: \"fast\",\n transitionTimingFunction: \"default\",\n transitionProperty: \"background, border-color, border, border-radius\",\n _closed: {\n transitionProperty: \"background, border-color, border, border-radius\",\n },\n _disabled: {\n cursor: \"not-allowed\",\n background: \"surface.disabled.subtle\",\n boxShadowColor: \"stroke.disabled\",\n color: \"text.disabled\",\n _hover: {\n background: \"surface.disabled.subtle\",\n boxShadowColor: \"stroke.disabled\",\n color: \"text.disabled\",\n },\n },\n },\n itemIndicator: {\n color: \"icon.strong\",\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(180deg)\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n itemContent: {\n overflow: \"hidden\",\n // TODO: Is this needed?\n transitionProperty: \"padding-bottom\",\n transitionDuration: \"normal\",\n transitionTimingFunction: \"default\",\n paddingBlock: \"xsmall\",\n paddingInline: \"small\",\n _open: {\n animation: \"collapse-in\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"collapse-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n item: {\n width: \"100%\",\n },\n },\n defaultVariants: {\n variant: \"bordered\",\n },\n variants: {\n variant: {\n clean: {},\n bordered: {\n itemTrigger: {\n paddingInline: \"medium\",\n paddingBlock: \"medium\",\n width: \"100%\",\n borderRadius: \"xsmall\",\n boxShadowColor: \"stroke.subtle\",\n boxShadow: \"inset 0 0 0 1px var(--shadow-color)\",\n _hover: {\n background: \"surface.actionSubtle.hover\",\n boxShadowColor: \"stroke.hover\",\n },\n _open: {\n background: \"surface.actionSubtle.active\",\n boxShadowColor: \"stroke.default\",\n borderBottomRadius: \"sharp\",\n },\n _focusVisible: {\n outline: \"none\",\n boxShadowColor: \"stroke.default\",\n boxShadow: \"inset 0 0 0 3px var(--shadow-color)\",\n },\n },\n itemContent: {\n borderBottomRadius: \"xsmall\",\n borderWidth: \"0 1px 1px\",\n borderStyle: \"solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(accordionRecipe);\n\nexport type AccordionVariantProps = NonNullable<RecipeVariantProps<typeof accordionRecipe>>;\n\nexport interface AccordionRootProps\n extends StyledProps, Accordion.RootProps, RefAttributes<HTMLDivElement>, AccordionVariantProps {}\n\nexport const InternalAccordionRoot = withProvider(Accordion.Root, \"root\", { baseComponent: true });\n\nexport const AccordionRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: AccordionRootProps) => (\n <InternalAccordionRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const AccordionItemContent = withContext(Accordion.ItemContent, \"itemContent\", { baseComponent: true });\n\nexport const AccordionItemIndicator = withContext(Accordion.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport interface AccordionItemProps extends StyledProps, Accordion.ItemProps {}\n\nexport const AccordionItem = withContext(Accordion.Item, \"item\", { baseComponent: true });\n\nexport const AccordionItemTrigger = withContext(Accordion.ItemTrigger, \"itemTrigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;;AA6HA,MAAM,EAAE,cAAc,iBAAA,GAAA,wBAAA,qBAAA,GAAA,wBAAA,KA/GM;CAC1B,OAAOA,cAAAA,iBAAiB,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,aAAa;GACX,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,YAAY;GACZ,QAAQ;GACR,oBAAoB;GACpB,0BAA0B;GAC1B,oBAAoB;GACpB,SAAS,EACP,oBAAoB,mDACrB;GACD,WAAW;IACT,QAAQ;IACR,YAAY;IACZ,gBAAgB;IAChB,OAAO;IACP,QAAQ;KACN,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACR;IACF;GACF;EACD,eAAe;GACb,OAAO;GACP,iBAAiB;GACjB,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,OAAO,EACL,WAAW,kBACZ;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,aAAa;GACX,UAAU;GAEV,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,cAAc;GACd,eAAe;GACf,OAAO;IACL,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACD,SAAS;IACP,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACF;EACD,MAAM,EACJ,OAAO,QACR;EACF;CACD,iBAAiB,EACf,SAAS,YACV;CACD,UAAU,EACR,SAAS;EACP,OAAO,EAAE;EACT,UAAU;GACR,aAAa;IACX,eAAe;IACf,cAAc;IACd,OAAO;IACP,cAAc;IACd,gBAAgB;IAChB,WAAW;IACX,QAAQ;KACN,YAAY;KACZ,gBAAgB;KACjB;IACD,OAAO;KACL,YAAY;KACZ,gBAAgB;KAChB,oBAAoB;KACrB;IACD,eAAe;KACb,SAAS;KACT,gBAAgB;KAChB,WAAW;KACZ;IACF;GACD,aAAa;IACX,oBAAoB;IACpB,aAAa;IACb,aAAa;IACb,aAAa;IACd;GACF;EACF,EACF;CACF,CAAC,CAEuE;AAOzE,MAAa,wBAAwB,aAAaC,cAAAA,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAElG,MAAa,iBAAiB,EAAE,YAAY,MAAM,gBAAgB,MAAM,GAAG,YACzE,iBAAA,GAAA,kBAAA,KAAC,uBAAD;CAAkC;CAA0B;CAAe,GAAI;CAAS,CAAA;AAG1F,MAAa,uBAAuB,YAAYA,cAAAA,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAE9G,MAAa,yBAAyB,YAAYA,cAAAA,UAAU,eAAe,iBAAiB,EAAE,eAAe,MAAM,CAAC;AAIpH,MAAa,gBAAgB,YAAYA,cAAAA,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEzF,MAAa,uBAAuB,YAAYA,cAAAA,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"Accordion.js","names":["accordionAnatomy","Accordion"],"sources":["../src/Accordion.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { Accordion, accordionAnatomy } from \"@ark-ui/react\";\nimport { sva } from \"@ndla/styled-system/css\";\nimport { createStyleContext } from \"@ndla/styled-system/jsx\";\nimport type { RecipeVariantProps, StyledProps } from \"@ndla/styled-system/types\";\nimport type { RefAttributes } from \"react\";\n\nconst accordionRecipe = sva({\n slots: accordionAnatomy.keys(),\n base: {\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n gap: \"3xsmall\",\n },\n itemTrigger: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n background: \"surface.default\",\n cursor: \"pointer\",\n transitionDuration: \"fast\",\n transitionTimingFunction: \"default\",\n transitionProperty: \"background, border-color, border, border-radius\",\n _closed: {\n transitionProperty: \"background, border-color, border, border-radius\",\n },\n _disabled: {\n cursor: \"not-allowed\",\n background: \"surface.disabled.subtle\",\n boxShadowColor: \"stroke.disabled\",\n color: \"text.disabled\",\n _hover: {\n background: \"surface.disabled.subtle\",\n boxShadowColor: \"stroke.disabled\",\n color: \"text.disabled\",\n },\n },\n },\n itemIndicator: {\n color: \"icon.strong\",\n transformOrigin: \"center\",\n transitionDuration: \"normal\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"default\",\n _open: {\n transform: \"rotate(180deg)\",\n },\n _motionReduce: {\n transition: \"none\",\n transitionDuration: \"0s\",\n },\n },\n itemContent: {\n overflow: \"hidden\",\n // TODO: Is this needed?\n transitionProperty: \"padding-bottom\",\n transitionDuration: \"normal\",\n transitionTimingFunction: \"default\",\n paddingBlock: \"xsmall\",\n paddingInline: \"small\",\n _open: {\n animation: \"collapse-in\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n _closed: {\n animation: \"collapse-out\",\n _motionReduce: {\n animation: \"none\",\n },\n },\n },\n item: {\n width: \"100%\",\n },\n },\n defaultVariants: {\n variant: \"bordered\",\n },\n variants: {\n variant: {\n clean: {},\n bordered: {\n itemTrigger: {\n paddingInline: \"medium\",\n paddingBlock: \"medium\",\n width: \"100%\",\n borderRadius: \"xsmall\",\n boxShadowColor: \"stroke.subtle\",\n boxShadow: \"inset 0 0 0 1px var(--shadow-color)\",\n _hover: {\n background: \"surface.actionSubtle.hover\",\n boxShadowColor: \"stroke.hover\",\n },\n _open: {\n background: \"surface.actionSubtle.active\",\n boxShadowColor: \"stroke.default\",\n borderBottomRadius: \"sharp\",\n },\n _focusVisible: {\n outline: \"none\",\n boxShadowColor: \"stroke.default\",\n boxShadow: \"inset 0 0 0 3px var(--shadow-color)\",\n },\n },\n itemContent: {\n borderBottomRadius: \"xsmall\",\n borderWidth: \"0 1px 1px\",\n borderStyle: \"solid\",\n borderColor: \"stroke.default\",\n },\n },\n },\n },\n});\n\nconst { withProvider, withContext } = createStyleContext(accordionRecipe);\n\nexport type AccordionVariantProps = NonNullable<RecipeVariantProps<typeof accordionRecipe>>;\n\nexport interface AccordionRootProps\n extends StyledProps, Accordion.RootProps, RefAttributes<HTMLDivElement>, AccordionVariantProps {}\n\nexport const InternalAccordionRoot = withProvider(Accordion.Root, \"root\", { baseComponent: true });\n\nexport const AccordionRoot = ({ lazyMount = true, unmountOnExit = true, ...props }: AccordionRootProps) => (\n <InternalAccordionRoot lazyMount={lazyMount} unmountOnExit={unmountOnExit} {...props} />\n);\n\nexport const AccordionItemContent = withContext(Accordion.ItemContent, \"itemContent\", { baseComponent: true });\n\nexport const AccordionItemIndicator = withContext(Accordion.ItemIndicator, \"itemIndicator\", { baseComponent: true });\n\nexport interface AccordionItemProps extends StyledProps, Accordion.ItemProps {}\n\nexport const AccordionItem = withContext(Accordion.Item, \"item\", { baseComponent: true });\n\nexport const AccordionItemTrigger = withContext(Accordion.ItemTrigger, \"itemTrigger\", { baseComponent: true });\n"],"mappings":";;;;;;;;;;;;AA6HA,MAAM,EAAE,cAAc,iBAAA,GAAA,wBAAA,qBAAA,GAAA,wBAAA,KA/GM;CAC1B,OAAOA,cAAAA,iBAAiB,MAAM;CAC9B,MAAM;EACJ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,KAAK;GACN;EACD,aAAa;GACX,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,YAAY;GACZ,QAAQ;GACR,oBAAoB;GACpB,0BAA0B;GAC1B,oBAAoB;GACpB,SAAS,EACP,oBAAoB,mDACrB;GACD,WAAW;IACT,QAAQ;IACR,YAAY;IACZ,gBAAgB;IAChB,OAAO;IACP,QAAQ;KACN,YAAY;KACZ,gBAAgB;KAChB,OAAO;KACR;IACF;GACF;EACD,eAAe;GACb,OAAO;GACP,iBAAiB;GACjB,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,OAAO,EACL,WAAW,kBACZ;GACD,eAAe;IACb,YAAY;IACZ,oBAAoB;IACrB;GACF;EACD,aAAa;GACX,UAAU;GAEV,oBAAoB;GACpB,oBAAoB;GACpB,0BAA0B;GAC1B,cAAc;GACd,eAAe;GACf,OAAO;IACL,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACD,SAAS;IACP,WAAW;IACX,eAAe,EACb,WAAW,QACZ;IACF;GACF;EACD,MAAM,EACJ,OAAO,QACR;EACF;CACD,iBAAiB,EACf,SAAS,YACV;CACD,UAAU,EACR,SAAS;EACP,OAAO,EAAE;EACT,UAAU;GACR,aAAa;IACX,eAAe;IACf,cAAc;IACd,OAAO;IACP,cAAc;IACd,gBAAgB;IAChB,WAAW;IACX,QAAQ;KACN,YAAY;KACZ,gBAAgB;KACjB;IACD,OAAO;KACL,YAAY;KACZ,gBAAgB;KAChB,oBAAoB;KACrB;IACD,eAAe;KACb,SAAS;KACT,gBAAgB;KAChB,WAAW;KACZ;IACF;GACD,aAAa;IACX,oBAAoB;IACpB,aAAa;IACb,aAAa;IACb,aAAa;IACd;GACF;EACF,EACF;CACF,CAEuE,CAAC;AAOzE,MAAa,wBAAwB,aAAaC,cAAAA,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAElG,MAAa,iBAAiB,EAAE,YAAY,MAAM,gBAAgB,MAAM,GAAG,YACzE,iBAAA,GAAA,kBAAA,KAAC,uBAAD;CAAkC;CAA0B;CAAe,GAAI;CAAS,CAAA;AAG1F,MAAa,uBAAuB,YAAYA,cAAAA,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC;AAE9G,MAAa,yBAAyB,YAAYA,cAAAA,UAAU,eAAe,iBAAiB,EAAE,eAAe,MAAM,CAAC;AAIpH,MAAa,gBAAgB,YAAYA,cAAAA,UAAU,MAAM,QAAQ,EAAE,eAAe,MAAM,CAAC;AAEzF,MAAa,uBAAuB,YAAYA,cAAAA,UAAU,aAAa,eAAe,EAAE,eAAe,MAAM,CAAC"}
package/lib/ArticleLists.js CHANGED
@@ -26,6 +26,13 @@ const orderedListRecipe = (0, _ndla_styled_system_css.cva)({
26
26
  defaultVariants: { variant: "numbers" },
27
27
  variants: { variant: {
28
28
  numbers: {
29
+ /** We utilize a CSS variable for the counter name to correctly reset counters when nested inside a letter list.
30
+ * This way, the nested number list won't pick up on any other counters named "numbers" higher up in the DOM tree.
31
+ * This fixes the following scenario
32
+ * ol (numbers) -> 1.
33
+ * ol(letters) -> A.
34
+ * ol (numbers) -> 1. (Without the CSS variable, this would be 1.1)
35
+ */
29
36
  counterReset: "var(--counter-name) var(--start, 0)",
30
37
  "& > li": {
31
38
  counterIncrement: "var(--counter-name)",
package/lib/ArticleLists.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ArticleLists.js","names":["ark","css"],"sources":["../src/ArticleLists.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type HTMLArkProps, ark } from \"@ark-ui/react\";\nimport { css, cva } from \"@ndla/styled-system/css\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { HTMLStyledProps, RecipeVariantProps, StyledProps } from \"@ndla/styled-system/types\";\nimport { createContext, type CSSProperties, forwardRef, useContext, useId, useMemo } from \"react\";\n\nconst orderedListRecipe = cva({\n base: {\n paddingInlineStart: \"large\",\n \"& > li\": {\n marginBlock: \"small\",\n _before: {\n position: \"absolute\",\n transform: \"translateX(calc(-100% - token(spacing.small)))\",\n fontVariantNumeric: \"tabular-nums\",\n },\n },\n },\n defaultVariants: {\n variant: \"numbers\",\n },\n variants: {\n variant: {\n numbers: {\n /** We utilize a CSS variable for the counter name to correctly reset counters when nested inside a letter list.\n * This way, the nested number list won't pick up on any other counters named \"numbers\" higher up in the DOM tree.\n * This fixes the following scenario\n * ol (numbers) -> 1.\n * ol(letters) -> A.\n * ol (numbers) -> 1. (Without the CSS variable, this would be 1.1)\n */\n counterReset: \"var(--counter-name) var(--start, 0)\",\n \"& > li\": {\n counterIncrement: \"var(--counter-name)\",\n _before: {\n content: `counters(var(--counter-name), \".\") \". \"`,\n },\n // If a nested OL is not a letters variant, it's a numbers variant. Keep increasing the margin to account for wider numbers.\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"small\",\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"large\",\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"xxlarge\",\n },\n },\n },\n },\n },\n letters: {\n counterReset: \"letters var(--start, 0)\",\n \"& > li\": {\n counterIncrement: \"letters\",\n _before: {\n content: `counter(letters, upper-alpha) \". \"`,\n },\n \"& > ol[data-variant='letters'] > li\": {\n _before: {\n content: `counter(letters, lower-alpha) \". \"`,\n },\n \"& > ol[data-variant='letters'] > li\": {\n _before: {\n content: `counter(letters, lower-roman) \". \"`,\n },\n },\n },\n },\n },\n },\n },\n});\n\nexport type OrderedListVariantProps = NonNullable<RecipeVariantProps<typeof orderedListRecipe>>;\n\nexport interface OrderedListProps extends StyledProps, HTMLArkProps<\"ol\">, OrderedListVariantProps {}\n\nconst StyledOrderedList = styled(ark.ol, {}, { baseComponent: true });\n\nconst ListContext = createContext<\"numbers\" | \"letters\" | undefined>(undefined);\n\nconst useCurrentListContext = () => {\n const ctx = useContext(ListContext);\n return ctx;\n};\n\nexport const OrderedList = forwardRef<HTMLOListElement, OrderedListProps>(\n ({ variant = \"numbers\", css: cssProp, start, ...props }, ref) => {\n const counterId = useId();\n const currentContext = useCurrentListContext();\n\n const style = useMemo(() => {\n const css: Record<string, any> = { \"--start\": start ? start - 1 : 0 };\n if (variant !== currentContext) {\n css[\"--counter-name\"] = counterId;\n }\n return css as CSSProperties;\n }, [start, variant, currentContext, counterId]);\n\n return (\n <ListContext.Provider value={variant ?? \"numbers\"}>\n <StyledOrderedList\n data-embed-type=\"ordered-list\"\n data-variant={variant}\n start={start}\n type={variant === \"letters\" ? \"A\" : undefined}\n css={css.raw(orderedListRecipe.raw({ variant }), cssProp)}\n style={style}\n ref={ref}\n {...props}\n />\n </ListContext.Provider>\n );\n },\n);\n\nexport interface UnOrderedListProps extends StyledProps, HTMLArkProps<\"ul\"> {}\n\nexport const StyledUnOrderedList = styled(\"ul\", {\n base: {\n listStyle: \"revert\",\n marginInlineStart: \"medium\",\n paddingInlineStart: \"small\",\n \"& ul\": {\n marginInlineStart: \"0\",\n },\n \"& li\": {\n marginBlock: \"small\",\n paddingInlineStart: \"small\",\n _marker: {\n color: \"icon.strong\",\n },\n\n \"& > ol\": {\n marginInlineStart: \"0 !important\",\n },\n },\n\n listStyleType: \"disc\",\n \"& > li > ul\": {\n listStyleType: \"circle\",\n \"& > li > ul\": {\n listStyleType: \"square\",\n },\n },\n },\n});\n\nexport const UnOrderedList = forwardRef<HTMLUListElement, UnOrderedListProps>((props, ref) => {\n const counterId = useId();\n\n const style = useMemo(\n () =>\n ({\n \"--counter-name\": counterId,\n }) as CSSProperties,\n [counterId],\n );\n\n return <StyledUnOrderedList ref={ref} style={style} {...props} />;\n});\n\nexport const DefinitionList = styled(\"dl\", {\n base: {\n \"& dt\": {\n fontWeight: \"bold\",\n },\n \"& dd\": {\n marginInlineStart: \"medium\",\n },\n },\n});\n\nexport type DefinitionListProps = HTMLStyledProps<\"dl\">;\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,qBAAA,GAAA,wBAAA,KAAwB;CAC5B,MAAM;EACJ,oBAAoB;EACpB,UAAU;GACR,aAAa;GACb,SAAS;IACP,UAAU;IACV,WAAW;IACX,oBAAoB;IACrB;GACF;EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACD,UAAU,EACR,SAAS;EACP,SAAS;GAQP,cAAc;GACd,UAAU;IACR,kBAAkB;IAClB,SAAS,EACP,SAAS,2CACV;IAED,6CAA6C;KAC3C,oBAAoB;KACpB,6CAA6C;MAC3C,oBAAoB;MACpB,6CAA6C,EAC3C,oBAAoB,WACrB;MACF;KACF;IACF;GACF;EACD,SAAS;GACP,cAAc;GACd,UAAU;IACR,kBAAkB;IAClB,SAAS,EACP,SAAS,sCACV;IACD,uCAAuC;KACrC,SAAS,EACP,SAAS,sCACV;KACD,uCAAuC,EACrC,SAAS,EACP,SAAS,sCACV,EACF;KACF;IACF;GACF;EACF,EACF;CACF,CAAC;AAMF,MAAM,qBAAA,GAAA,wBAAA,QAA2BA,cAAAA,IAAI,IAAI,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAErE,MAAM,eAAA,GAAA,MAAA,eAA+D,KAAA,EAAU;AAE/E,MAAM,8BAA8B;AAElC,SAAA,GAAA,MAAA,YADuB,YAAY;;AAIrC,MAAa,eAAA,GAAA,MAAA,aACV,EAAE,UAAU,WAAW,KAAK,SAAS,OAAO,GAAG,SAAS,QAAQ;CAC/D,MAAM,aAAA,GAAA,MAAA,QAAmB;CACzB,MAAM,iBAAiB,uBAAuB;CAE9C,MAAM,SAAA,GAAA,MAAA,eAAsB;EAC1B,MAAM,MAA2B,EAAE,WAAW,QAAQ,QAAQ,IAAI,GAAG;AACrE,MAAI,YAAY,eACd,KAAI,oBAAoB;AAE1B,SAAO;IACN;EAAC;EAAO;EAAS;EAAgB;EAAU,CAAC;AAE/C,QACE,iBAAA,GAAA,kBAAA,KAAC,YAAY,UAAb;EAAsB,OAAO,WAAW;YACtC,iBAAA,GAAA,kBAAA,KAAC,mBAAD;GACE,mBAAgB;GAChB,gBAAc;GACP;GACP,MAAM,YAAY,YAAY,MAAM,KAAA;GACpC,KAAKC,wBAAAA,IAAI,IAAI,kBAAkB,IAAI,EAAE,SAAS,CAAC,EAAE,QAAQ;GAClD;GACF;GACL,GAAI;GACJ,CAAA;EACmB,CAAA;EAG5B;AAID,MAAa,uBAAA,GAAA,wBAAA,QAA6B,MAAM,EAC9C,MAAM;CACJ,WAAW;CACX,mBAAmB;CACnB,oBAAoB;CACpB,QAAQ,EACN,mBAAmB,KACpB;CACD,QAAQ;EACN,aAAa;EACb,oBAAoB;EACpB,SAAS,EACP,OAAO,eACR;EAED,UAAU,EACR,mBAAmB,gBACpB;EACF;CAED,eAAe;CACf,eAAe;EACb,eAAe;EACf,eAAe,EACb,eAAe,UAChB;EACF;CACF,EACF,CAAC;AAEF,MAAa,iBAAA,GAAA,MAAA,aAAkE,OAAO,QAAQ;CAC5F,MAAM,aAAA,GAAA,MAAA,QAAmB;AAUzB,QAAO,iBAAA,GAAA,kBAAA,KAAC,qBAAD;EAA0B;EAAK,QAAA,GAAA,MAAA,gBANjC,EACC,kBAAkB,WACnB,GACH,CAAC,UAAU,CACZ;EAEmD,GAAI;EAAS,CAAA;EACjE;AAEF,MAAa,kBAAA,GAAA,wBAAA,QAAwB,MAAM,EACzC,MAAM;CACJ,QAAQ,EACN,YAAY,QACb;CACD,QAAQ,EACN,mBAAmB,UACpB;CACF,EACF,CAAC"}
1
+ {"version":3,"file":"ArticleLists.js","names":["ark","css"],"sources":["../src/ArticleLists.tsx"],"sourcesContent":["/**\n * Copyright (c) 2024-present, NDLA.\n *\n * This source code is licensed under the GPLv3 license found in the\n * LICENSE file in the root directory of this source tree.\n *\n */\n\nimport { type HTMLArkProps, ark } from \"@ark-ui/react\";\nimport { css, cva } from \"@ndla/styled-system/css\";\nimport { styled } from \"@ndla/styled-system/jsx\";\nimport type { HTMLStyledProps, RecipeVariantProps, StyledProps } from \"@ndla/styled-system/types\";\nimport { createContext, type CSSProperties, forwardRef, useContext, useId, useMemo } from \"react\";\n\nconst orderedListRecipe = cva({\n base: {\n paddingInlineStart: \"large\",\n \"& > li\": {\n marginBlock: \"small\",\n _before: {\n position: \"absolute\",\n transform: \"translateX(calc(-100% - token(spacing.small)))\",\n fontVariantNumeric: \"tabular-nums\",\n },\n },\n },\n defaultVariants: {\n variant: \"numbers\",\n },\n variants: {\n variant: {\n numbers: {\n /** We utilize a CSS variable for the counter name to correctly reset counters when nested inside a letter list.\n * This way, the nested number list won't pick up on any other counters named \"numbers\" higher up in the DOM tree.\n * This fixes the following scenario\n * ol (numbers) -> 1.\n * ol(letters) -> A.\n * ol (numbers) -> 1. (Without the CSS variable, this would be 1.1)\n */\n counterReset: \"var(--counter-name) var(--start, 0)\",\n \"& > li\": {\n counterIncrement: \"var(--counter-name)\",\n _before: {\n content: `counters(var(--counter-name), \".\") \". \"`,\n },\n // If a nested OL is not a letters variant, it's a numbers variant. Keep increasing the margin to account for wider numbers.\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"small\",\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"large\",\n \"& > ol:not([data-variant='letters']) > li\": {\n paddingInlineStart: \"xxlarge\",\n },\n },\n },\n },\n },\n letters: {\n counterReset: \"letters var(--start, 0)\",\n \"& > li\": {\n counterIncrement: \"letters\",\n _before: {\n content: `counter(letters, upper-alpha) \". \"`,\n },\n \"& > ol[data-variant='letters'] > li\": {\n _before: {\n content: `counter(letters, lower-alpha) \". \"`,\n },\n \"& > ol[data-variant='letters'] > li\": {\n _before: {\n content: `counter(letters, lower-roman) \". \"`,\n },\n },\n },\n },\n },\n },\n },\n});\n\nexport type OrderedListVariantProps = NonNullable<RecipeVariantProps<typeof orderedListRecipe>>;\n\nexport interface OrderedListProps extends StyledProps, HTMLArkProps<\"ol\">, OrderedListVariantProps {}\n\nconst StyledOrderedList = styled(ark.ol, {}, { baseComponent: true });\n\nconst ListContext = createContext<\"numbers\" | \"letters\" | undefined>(undefined);\n\nconst useCurrentListContext = () => {\n const ctx = useContext(ListContext);\n return ctx;\n};\n\nexport const OrderedList = forwardRef<HTMLOListElement, OrderedListProps>(\n ({ variant = \"numbers\", css: cssProp, start, ...props }, ref) => {\n const counterId = useId();\n const currentContext = useCurrentListContext();\n\n const style = useMemo(() => {\n const css: Record<string, any> = { \"--start\": start ? start - 1 : 0 };\n if (variant !== currentContext) {\n css[\"--counter-name\"] = counterId;\n }\n return css as CSSProperties;\n }, [start, variant, currentContext, counterId]);\n\n return (\n <ListContext.Provider value={variant ?? \"numbers\"}>\n <StyledOrderedList\n data-embed-type=\"ordered-list\"\n data-variant={variant}\n start={start}\n type={variant === \"letters\" ? \"A\" : undefined}\n css={css.raw(orderedListRecipe.raw({ variant }), cssProp)}\n style={style}\n ref={ref}\n {...props}\n />\n </ListContext.Provider>\n );\n },\n);\n\nexport interface UnOrderedListProps extends StyledProps, HTMLArkProps<\"ul\"> {}\n\nexport const StyledUnOrderedList = styled(\"ul\", {\n base: {\n listStyle: \"revert\",\n marginInlineStart: \"medium\",\n paddingInlineStart: \"small\",\n \"& ul\": {\n marginInlineStart: \"0\",\n },\n \"& li\": {\n marginBlock: \"small\",\n paddingInlineStart: \"small\",\n _marker: {\n color: \"icon.strong\",\n },\n\n \"& > ol\": {\n marginInlineStart: \"0 !important\",\n },\n },\n\n listStyleType: \"disc\",\n \"& > li > ul\": {\n listStyleType: \"circle\",\n \"& > li > ul\": {\n listStyleType: \"square\",\n },\n },\n },\n});\n\nexport const UnOrderedList = forwardRef<HTMLUListElement, UnOrderedListProps>((props, ref) => {\n const counterId = useId();\n\n const style = useMemo(\n () =>\n ({\n \"--counter-name\": counterId,\n }) as CSSProperties,\n [counterId],\n );\n\n return <StyledUnOrderedList ref={ref} style={style} {...props} />;\n});\n\nexport const DefinitionList = styled(\"dl\", {\n base: {\n \"& dt\": {\n fontWeight: \"bold\",\n },\n \"& dd\": {\n marginInlineStart: \"medium\",\n },\n },\n});\n\nexport type DefinitionListProps = HTMLStyledProps<\"dl\">;\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAM,qBAAA,GAAA,wBAAA,KAAwB;CAC5B,MAAM;EACJ,oBAAoB;EACpB,UAAU;GACR,aAAa;GACb,SAAS;IACP,UAAU;IACV,WAAW;IACX,oBAAoB;IACrB;GACF;EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACD,UAAU,EACR,SAAS;EACP,SAAS;;;;;;;;GAQP,cAAc;GACd,UAAU;IACR,kBAAkB;IAClB,SAAS,EACP,SAAS,2CACV;IAED,6CAA6C;KAC3C,oBAAoB;KACpB,6CAA6C;MAC3C,oBAAoB;MACpB,6CAA6C,EAC3C,oBAAoB,WACrB;MACF;KACF;IACF;GACF;EACD,SAAS;GACP,cAAc;GACd,UAAU;IACR,kBAAkB;IAClB,SAAS,EACP,SAAS,sCACV;IACD,uCAAuC;KACrC,SAAS,EACP,SAAS,sCACV;KACD,uCAAuC,EACrC,SAAS,EACP,SAAS,sCACV,EACF;KACF;IACF;GACF;EACF,EACF;CACF,CAAC;AAMF,MAAM,qBAAA,GAAA,wBAAA,QAA2BA,cAAAA,IAAI,IAAI,EAAE,EAAE,EAAE,eAAe,MAAM,CAAC;AAErE,MAAM,eAAA,GAAA,MAAA,eAA+D,KAAA,EAAU;AAE/E,MAAM,8BAA8B;AAElC,SAAA,GAAA,MAAA,YADuB,YACb;;AAGZ,MAAa,eAAA,GAAA,MAAA,aACV,EAAE,UAAU,WAAW,KAAK,SAAS,OAAO,GAAG,SAAS,QAAQ;CAC/D,MAAM,aAAA,GAAA,MAAA,QAAmB;CACzB,MAAM,iBAAiB,uBAAuB;CAE9C,MAAM,SAAA,GAAA,MAAA,eAAsB;EAC1B,MAAM,MAA2B,EAAE,WAAW,QAAQ,QAAQ,IAAI,GAAG;AACrE,MAAI,YAAY,eACd,KAAI,oBAAoB;AAE1B,SAAO;IACN;EAAC;EAAO;EAAS;EAAgB;EAAU,CAAC;AAE/C,QACE,iBAAA,GAAA,kBAAA,KAAC,YAAY,UAAb;EAAsB,OAAO,WAAW;YACtC,iBAAA,GAAA,kBAAA,KAAC,mBAAD;GACE,mBAAgB;GAChB,gBAAc;GACP;GACP,MAAM,YAAY,YAAY,MAAM,KAAA;GACpC,KAAKC,wBAAAA,IAAI,IAAI,kBAAkB,IAAI,EAAE,SAAS,CAAC,EAAE,QAAQ;GAClD;GACF;GACL,GAAI;GACJ,CAAA;EACmB,CAAA;EAG5B;AAID,MAAa,uBAAA,GAAA,wBAAA,QAA6B,MAAM,EAC9C,MAAM;CACJ,WAAW;CACX,mBAAmB;CACnB,oBAAoB;CACpB,QAAQ,EACN,mBAAmB,KACpB;CACD,QAAQ;EACN,aAAa;EACb,oBAAoB;EACpB,SAAS,EACP,OAAO,eACR;EAED,UAAU,EACR,mBAAmB,gBACpB;EACF;CAED,eAAe;CACf,eAAe;EACb,eAAe;EACf,eAAe,EACb,eAAe,UAChB;EACF;CACF,EACF,CAAC;AAEF,MAAa,iBAAA,GAAA,MAAA,aAAkE,OAAO,QAAQ;CAC5F,MAAM,aAAA,GAAA,MAAA,QAAmB;AAUzB,QAAO,iBAAA,GAAA,kBAAA,KAAC,qBAAD;EAA0B;EAAK,QAAA,GAAA,MAAA,gBANjC,EACC,kBAAkB,WACnB,GACH,CAAC,UAAU,CAGqC;EAAE,GAAI;EAAS,CAAA;EACjE;AAEF,MAAa,kBAAA,GAAA,wBAAA,QAAwB,MAAM,EACzC,MAAM;CACJ,QAAQ,EACN,YAAY,QACb;CACD,QAAQ,EACN,mBAAmB,UACpB;CACF,EACF,CAAC"}