feat: ✨ add sd-map-marker

[karlbaumhauer]

User Story

As a user of the Solid Design System, I would like to utilize the map-marker component, which I can is maps e. g. from Google Maps.

Hand-off

https://www.figma.com/file/VTztxQ5pWG7ARg8hCX6PfR/branch/1zKhsJrAC54nmZFa7aR1te/Solid-DS-%E2%80%93-Component-Library?type=design&node-id=4803-25242&mode=design&t=xFKHAncUDI0lO5Hb-11

• Note: We won't do the flyout, because this is NOT part of the marker.
• If possible, try to make the focus in the shape of the "element".

Components detailed requirements

Props

Status	Name	Type	Default	Description
	variant	string: main, place?, cluster	main	description
	state	string: default, active, hover	default	if active or have is triggered via attribute, it should show a focus state as well
	animate	boolean	default	trigger animation ones and remove itself afterwards (see component-library)

CSS-Properties

• scaling - make it possible to scale everything at once, csee original component from component-library

Parts (besides the shoelace parts)

• every HTML element

Slots

• default - centered image as in component library

Stories (besides the default story)

• variants
• animate
• state x variant main, state x variant place
• scaling
• slots with icons see Figma for examples

DoR

• Item has business value
• Item has been estimated by the team
• Item is clear and well-defined
• Item dependencies have been identified

DoD

• Documentation has been created/updated (if applicable)
• Migration Guide has been created/updated (if applicable)
• Relevant E2E tests (Features, A11y, Bug fixes) are created/updated
• Relevant stories (Features, A11y) are created/updated
• Implementation works successfully on feature branch

[karlbaumhauer]

@mariohamann can you pre-fill this ticket for our next pre-refinement? In case there are no further questions, you can also add this to the refinement afterwards. I think we talked a lot (enough) about the expected outcome and the design ticket (#573) is already in progress.