diff --git a/COMPONENT_INDEX.md b/COMPONENT_INDEX.md index 7bbbdc3f..a5f88513 100644 --- a/COMPONENT_INDEX.md +++ b/COMPONENT_INDEX.md @@ -4131,6 +4131,7 @@ None. | refTooltip | let | Yes | null | HTMLDivElement | null | Obtain a reference to the tooltip HTML element | | ref | let | Yes | null | HTMLDivElement | null | Obtain a reference to the trigger text HTML element | | open | let | Yes | boolean | false | Set to `true` to open the tooltip | +| align | let | No | "start" | "center" | "end" | "center" | Set the alignment of the tooltip relative to the icon | | direction | let | No | "top" | "right" | "bottom" | "left" | "bottom" | Set the direction of the tooltip relative to the button | | hideIcon | let | No | boolean | false | Set to `true` to hide the tooltip icon | | icon | let | No | typeof import("carbon-icons-svelte").CarbonIcon | -- | Specify the icon from `carbon-icons-svelte` to render for the tooltip button
Icon size must be 16px (e.g., `Add16`, `Task16`) | diff --git a/docs/package.json b/docs/package.json index 6b5707ec..f307dfa6 100644 --- a/docs/package.json +++ b/docs/package.json @@ -12,7 +12,7 @@ "@carbon/themes": "^10.22.1", "@sveltech/routify": "^1.9.9", "autoprefixer": "^10.0.1", - "carbon-components": "^10.23.1", + "carbon-components": "^10.25.0", "carbon-components-svelte": "../", "clipboard-copy": "^3.1.0", "mdsvex": "^0.8.8", diff --git a/docs/src/COMPONENT_API.json b/docs/src/COMPONENT_API.json index 98e83060..4e372815 100644 --- a/docs/src/COMPONENT_API.json +++ b/docs/src/COMPONENT_API.json @@ -3356,7 +3356,7 @@ { "type": "forwarded", "name": "mouseleave", "element": "table" } ], "typedefs": [], - "rest_props": { "type": "Element", "name": "table" }, + "rest_props": { "type": "Element", "name": "div" }, "extends": { "interface": "DataTableHeader", "import": "\"../DataTable/DataTable\"" @@ -9274,6 +9274,16 @@ "moduleName": "Tooltip", "filePath": "/src/Tooltip/Tooltip.svelte", "props": [ + { + "name": "align", + "kind": "let", + "description": "Set the alignment of the tooltip relative to the icon", + "type": "\"start\" | \"center\" | \"end\"", + "value": "\"center\"", + "isFunction": false, + "constant": false, + "reactive": false + }, { "name": "direction", "kind": "let", diff --git a/docs/src/pages/components/Tooltip.svx b/docs/src/pages/components/Tooltip.svx index d00df4f3..a9deb31b 100644 --- a/docs/src/pages/components/Tooltip.svx +++ b/docs/src/pages/components/Tooltip.svx @@ -6,8 +6,8 @@ ### Default (icon-only, "bottom" direction) - -

+ +

Resources are provisioned based on your account's organization.

@@ -27,6 +27,12 @@

Bottom

Left

+### Alignment + +

Start

+

End

+

Center

+ ### Interactive diff --git a/docs/yarn.lock b/docs/yarn.lock index d8f2b669..26ee964f 100644 --- a/docs/yarn.lock +++ b/docs/yarn.lock @@ -771,24 +771,24 @@ caniuse-lite@^1.0.30001135, caniuse-lite@^1.0.30001137: integrity sha512-VAy5RHDfTJhpxnDdp2n40GPPLp3KqNrXz1QqFv4J64HvArKs8nuNMOWkB3ICOaBTU/Aj4rYAo/ytdQDDFF/Pug== carbon-components-svelte@../: - version "0.21.0" + version "0.25.1" dependencies: - carbon-icons-svelte "^10.17.0" + carbon-icons-svelte "^10.21.0" flatpickr "4.6.3" -carbon-components@^10.23.1: - version "10.23.1" - resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.23.1.tgz#cf649a09aa25eac14dc158f0fb79ba625730026c" - integrity sha512-izeyNCo9cPfdw9358y5VPsDRzmGAO1wAjSnkD5gGEQO46P2HBdQcgXV1IqjAbFuit+TgfG/MrP38u+pmjp4zyQ== +carbon-components@^10.25.0: + version "10.25.0" + resolved "https://registry.npmjs.org/carbon-components/-/carbon-components-10.25.0.tgz#268441eb5f06be35f72790770bed9ba0cd52a0b1" + integrity sha512-0XzHaDxJ7aO23xZ7L/efAkSLuo3pKf7h94CAP0RsXPp2c9KL7uYdjtSZLmAqMkDQrOSORnkUju6zQhI+ZYcEIw== dependencies: flatpickr "4.6.1" lodash.debounce "^4.0.8" warning "^3.0.0" -carbon-icons-svelte@^10.17.0: - version "10.17.0" - resolved "https://registry.npmjs.org/carbon-icons-svelte/-/carbon-icons-svelte-10.17.0.tgz#f7559f58be9c789097ea4035e52dbc4c12691d45" - integrity sha512-as1RN87YLvF7iepGAGWQOk2oleyb4w17BoHSYyQgE3MceOla04YdSWASK5c22XZZnmMJbbrT17Z34Cl70niz0Q== +carbon-icons-svelte@^10.21.0: + version "10.21.0" + resolved "https://registry.npmjs.org/carbon-icons-svelte/-/carbon-icons-svelte-10.21.0.tgz#9bbdd37d5513d484e9706d6335c121f60f3186c4" + integrity sha512-5NNaRdmbS4N36dUGNj72Ys3VqVjH3fZ69AhYUHx+bH02GFYCwAaE49qjtP77kP7DKMtDV9NmMEti/P/JB83aYQ== caseless@~0.12.0: version "0.12.0" diff --git a/package.json b/package.json index b5b2a28c..d83c2d2d 100644 --- a/package.json +++ b/package.json @@ -27,7 +27,7 @@ "@rollup/plugin-node-resolve": "^10.0.0", "@tsconfig/svelte": "^1.0.10", "autoprefixer": "^9.8.6", - "carbon-components-10.23": "npm:carbon-components@10.23.1", + "carbon-components-10.25": "npm:carbon-components@10.25.0", "gh-pages": "^3.1.0", "husky": "^4.3.0", "lint-staged": "^10.5.1", diff --git a/scripts/build-css.js b/scripts/build-css.js index a6fd0080..fbaa39a2 100644 --- a/scripts/build-css.js +++ b/scripts/build-css.js @@ -18,12 +18,12 @@ const shared = { $css--default-type: true; $css--plex: true; - @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--reset.scss"; - @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--font-face.scss"; - @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--helpers.scss"; - @import "node_modules/carbon-components-10.23/scss/globals/scss/_css--body.scss"; - @import "node_modules/carbon-components-10.23/scss/globals/grid/_grid.scss"; - @import "node_modules/carbon-components-10.23/scss/globals/scss/styles.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--reset.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--font-face.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--helpers.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/scss/_css--body.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/grid/_grid.scss"; + @import "node_modules/carbon-components-10.25/scss/globals/scss/styles.scss"; `, components: ``, }; diff --git a/src/Tooltip/Tooltip.svelte b/src/Tooltip/Tooltip.svelte index fbb382f3..22c268ad 100644 --- a/src/Tooltip/Tooltip.svelte +++ b/src/Tooltip/Tooltip.svelte @@ -1,4 +1,10 @@