phase2 / outline

Tooling infrastructure for modern web component development.
https://outline.phase2tech.com
MIT License
128 stars 27 forks source link

Component: `@phase2/outline-core-styled-text` #432

Open JSchreff opened 9 months ago

JSchreff commented 9 months ago

Description

Please include a summary of the change and which issue is fixed. Please also include relevant motivation and context. List any dependencies that are required for this change.

Fixes # (issue)

Type of change

Please delete options that are not relevant.

How Has This Been Tested?

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

Checklist

Summary by CodeRabbit

changeset-bot[bot] commented 9 months ago

⚠️ No Changeset found

Latest commit: b3cf30a9245aab22f080e8953797dd622c513ce4

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

netlify[bot] commented 9 months ago

Deploy Preview for outlinejs failed.

Name Link
Latest commit b3cf30a9245aab22f080e8953797dd622c513ce4
Latest deploy log https://app.netlify.com/sites/outlinejs/deploys/65de064cba503c0008d33ef9
coderabbitai[bot] commented 9 months ago

[!IMPORTANT]

Auto Review Skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository.

To trigger a single review, invoke the @coderabbitai review command.

Walkthrough

The update introduces the outline-core-styled-text component, enhancing text styling across applications. It covers a broad spectrum of text elements, including headings, paragraphs, lists, and more, with a focus on WYSIWYG content. The component, alongside its styles and utilities, aims to standardize text appearance, improve accessibility, and facilitate content management, particularly for external links and tooltips. This change integrates seamlessly with existing design systems and extends functionality for a better user experience.

Changes

File(s) Change Summary
.../outline-core-styled-text/docs/outline-core-styled-text.mdx Introduces the outline-core-styled-text component documentation, covering usage and settings.
.../outline-core-styled-text/index.ts Exports the OutlineCoreStyledText component and its associated sub-components, variables, and methods.
.../outline-core-styled-text/src/.ck.ck-content.global.css Adds CSS for WYSIWYG elements scoped to .ck.ck-content, including tooltip style overrides.
.../outline-core-styled-text/src/outline-core-styled-text.css Sets up basic styles for the outline-core-styled-text component.
.../outline-core-styled-text/src/outline-core-styled-text.lightdom.css Styles for WYSIWYG content within <outline-core-styled-text>, including fonts and colors.
.../outline-core-styled-text/src/outline-core-styled-text.shared.css Defines typography, spacing, list, link styles, and styles for specific elements like headings, paragraphs, and inline text elements.
.../outline-core-styled-text/src/outline-core-styled-text.ts Implements the OutlineCoreStyledText component with functionality for styling text elements, handling tooltip links, and wrapping the last word of links in a span.
.../outline-core-styled-text/src/sic-table.css Introduces styles for tables, including font sizes, colors, and scrollbar styles.
.../outline-core-styled-text/src/utilities/... Introduces utilities for checking file types (check-file-type.ts), adding external link messages (external-link-text.ts), creating tooltips (tooltip.ts), and wrapping the last word in links (wrap-last-word.ts).

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

Share - [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai) - [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai) - [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai) - [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

Tips ### Chat There are 3 ways to chat with CodeRabbit: - Review comments: Directly reply to a review comment made by CodeRabbit. Example: - `I pushed a fix in commit .` - `Generate unit-tests for this file.` - Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples: - `@coderabbitai generate unit tests for this file.` - `@coderabbitai modularize this function.` - PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples: - `@coderabbitai generate interesting stats about this repository from git and render them as a table.` - `@coderabbitai show all the console.log statements in this repository.` - `@coderabbitai read src/utils.ts and generate unit tests.` - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.` Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. ### CodeRabbit Commands (invoked as PR comments) - `@coderabbitai pause` to pause the reviews on a PR. - `@coderabbitai resume` to resume the paused reviews. - `@coderabbitai review` to trigger a review. This is useful when automatic reviews are disabled for the repository. - `@coderabbitai resolve` resolve all the CodeRabbit review comments. - `@coderabbitai help` to get help. Additionally, you can add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed. ### CodeRabbit Configration File (`.coderabbit.yaml`) - You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository. - The JSON schema for the configuration file is available [here](https://coderabbit.ai/integrations/coderabbit-overrides.v2.json). - If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/coderabbit-overrides.v2.json` ### CodeRabbit Discord Community Join our [Discord Community](https://discord.com/invite/GsXnASn26c) to get help, request features, and share feedback.
JSchreff commented 9 months ago

Todos:

socket-security[bot] commented 8 months ago

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package New capabilities Transitives Size Publisher
npm/@babel/helper-create-class-features-plugin@7.23.10 Transitive: environment, filesystem, unsafe +35 10.2 MB nicolo-ribaudo
npm/@babel/helper-create-regexp-features-plugin@7.22.15 Transitive: environment, filesystem, unsafe +31 9.81 MB nicolo-ribaudo
npm/@babel/helper-member-expression-to-functions@7.23.0 Transitive: environment +2 2.5 MB nicolo-ribaudo
npm/@babel/plugin-transform-class-properties@7.23.3 Transitive: environment, filesystem, unsafe +37 10.2 MB nicolo-ribaudo
npm/@babel/plugin-transform-modules-commonjs@7.23.3 Transitive: environment, filesystem, unsafe +31 9.84 MB nicolo-ribaudo
npm/@babel/plugin-transform-nullish-coalescing-operator@7.23.4 Transitive: environment, filesystem, unsafe +32 9.8 MB nicolo-ribaudo
npm/@babel/plugin-transform-optional-chaining@7.23.4 Transitive: environment, filesystem, unsafe +33 9.84 MB nicolo-ribaudo
npm/@babel/plugin-transform-private-methods@7.23.3 Transitive: environment, filesystem, unsafe +37 10.2 MB nicolo-ribaudo
npm/@csstools/postcss-progressive-custom-properties@1.3.0 None 0 43.9 kB alaguna
npm/@csstools/selector-specificity@2.2.0 None 0 16.7 kB alaguna
npm/@types/unist@2.0.10 None 0 8.56 kB types
npm/@yarnpkg/libzip@2.3.0 filesystem +1 784 kB arcanis
npm/bl@4.1.0 None +2 157 kB matteo.collina
npm/commander@6.2.1 filesystem, shell 0 113 kB abetomo
npm/core-js-compat@3.36.0 Transitive: environment, filesystem +3 2.74 MB zloirock
npm/css-tree@1.1.3 None +1 1.79 MB lahmatiy
npm/domelementtype@2.3.0 None 0 11.4 kB feedic
npm/domhandler@4.3.1 None +1 55.9 kB feedic
npm/duplexify@3.7.1 None +2 28.3 kB mafintosh
npm/end-of-stream@1.4.4 None 0 6.23 kB mafintosh
npm/esprima@4.0.1 None 0 314 kB ariya
npm/extend-shallow@3.0.2 None +2 21.4 kB phated
npm/get-caller-file@2.0.5 None 0 4.72 kB stefanpenner
npm/get-value@2.0.6 None 0 3.71 kB jonschlinkert
npm/graceful-fs@4.2.10 environment, filesystem 0 32.5 kB isaacs
npm/rollup-plugin-dts@6.1.0 environment, unsafe Transitive: filesystem +30 68.8 MB swatinem
npm/style-dictionary@3.7.1 filesystem Transitive: environment, shell +42 7.14 MB dbanksdesign
npm/tslib@2.4.0 None 0 50 kB typescript-bot
npm/vite@5.1.4 Transitive: environment, filesystem, network, shell +44 263 MB antfu, patak, soda, ...2 more

🚮 Removed packages: npm/@phase2/outline-config@0.0.14, npm/glob-parent@5.1.2, npm/globby@11.1.0, npm/graceful-fs@4.2.11, npm/has-property-descriptors@1.0.2, npm/has-symbols@1.0.3, npm/has-tostringtag@1.0.2, npm/hasown@2.0.1, npm/iconv-lite@0.4.24, npm/import-fresh@3.3.0, npm/internal-slot@1.0.7, npm/is-callable@1.2.7, npm/is-core-module@2.13.1, npm/is-date-object@1.0.5, npm/is-extglob@2.1.1, npm/is-glob@4.0.3, npm/is-string@1.0.7, npm/is-symbol@1.0.4, npm/is-typed-array@1.1.13, npm/is-windows@1.0.2, npm/istanbul-lib-coverage@3.2.2, npm/istanbul-lib-report@3.0.1, npm/js-yaml@3.14.1, npm/json5@2.2.3, npm/koa-send@5.0.1, npm/lefthook@1.6.1, npm/lint-staged@10.5.4, npm/lit-analyzer@1.2.1, npm/lit-html@2.8.0, npm/make-dir@3.1.0, npm/merge2@1.4.1, npm/micromatch@4.0.5, npm/mime-db@1.52.0, npm/mime-types@2.1.35, npm/minimist-options@4.1.0, npm/minimist@1.2.8, npm/mkdirp@1.0.4, npm/neo-async@2.6.2, npm/normalize-path@3.0.0, npm/npm-run-all@4.1.5, npm/npm-run-path@4.0.1, npm/object.assign@4.1.5, npm/object.fromentries@2.0.7, npm/object.values@1.1.7, npm/on-finished@2.4.1, npm/onetime@5.1.2, npm/open@8.4.2, npm/p-limit@2.3.0, npm/parse-json@5.2.0, npm/parseurl@1.3.3, npm/path-key@3.1.1, npm/picomatch@2.3.1, npm/pirates@4.0.6, npm/postcss-discard-comments@5.1.0, npm/postcss-loader@7.3.4, npm/postcss-nested-import@1.3.0, npm/postcss-preset-env@7.8.3, npm/postcss@8.4.8, npm/prettier-plugin-tailwindcss@0.1.13, npm/prettier@2.8.8, npm/progress@2.0.3, npm/qs@6.11.2, npm/react-dom@18.2.0, npm/react-syntax-highlighter@15.5.0, npm/react@18.2.0, npm/recast@0.23.4, npm/regexp.prototype.flags@1.5.2, npm/requireindex@1.2.0, npm/resolve-from@5.0.0, npm/resolve-global@1.0.0, npm/resolve@1.22.8, npm/rimraf@3.0.2, npm/rollup@3.29.4, npm/rsync@0.6.1, npm/safe-buffer@5.1.2, npm/semver@6.3.1, npm/set-function-name@2.0.1, npm/signal-exit@3.0.7, npm/split2@3.2.2, npm/storybook@7.6.16, npm/string-width@4.2.3, npm/strip-ansi@6.0.1, npm/strip-json-comments@3.1.1, npm/svgo@2.8.0, npm/tailwindcss@3.0.0, npm/ts-dedent@2.2.0, npm/ts-lit-plugin@1.2.1, npm/tsc@2.0.4, npm/tslib@2.6.2, npm/turbo@1.12.4, npm/type-is@1.6.18, npm/unpipe@1.0.0, npm/util-deprecate@1.0.2, npm/util@0.12.5, npm/vary@1.1.2, npm/vite@4.5.2, npm/which-typed-array@1.1.14, npm/yargs@17.7.2

View full report↗︎